From b0ad3cb49cc07e32a24cc0119a05c7faf245ae19 Mon Sep 17 00:00:00 2001
From: Eevee <git@veekun.com>
Date: Sun, 6 Dec 2009 21:14:54 -0800
Subject: [PATCH] Spruced up UI a little bit.

Logging in now produces a flash message.  Flash box is styled.

Registration mentions constraints on usernames.

Art view page has the art at the top, and relations are merged with
tags.
---
 floof/controllers/account.py          |  1 +
 floof/lib/helpers.py                  |  3 ++-
 floof/public/layout.css               |  2 ++
 floof/templates/account/register.mako |  2 +-
 floof/templates/art/show.mako         | 47 +++++++++++++++++++++--------------
 floof/templates/comments/lib.mako     |  2 +-
 6 files changed, 35 insertions(+), 22 deletions(-)

diff --git a/floof/controllers/account.py b/floof/controllers/account.py
index b48dc25..6459791 100644
--- a/floof/controllers/account.py
+++ b/floof/controllers/account.py
@@ -79,6 +79,7 @@ class AccountController(BaseController):
         # Remember who's logged in, and we're good to go
         session['user_id'] = user.id
         session.save()
+        h.flash(u'You are now logged in.')
 
         # XXX send me where I came from
         redirect('/')
diff --git a/floof/lib/helpers.py b/floof/lib/helpers.py
index 14f92d0..9fbfa7d 100644
--- a/floof/lib/helpers.py
+++ b/floof/lib/helpers.py
@@ -12,7 +12,8 @@ from pylons import config, url
 
 # Scaffolding helper imports
 from webhelpers.html.tags import *
-from webhelpers.html import literal
+from webhelpers.html.tools import *
+from webhelpers.html import HTML, literal
 from webhelpers.pylonslib import Flash
 import sqlalchemy.types as types
 flash = Flash()
diff --git a/floof/public/layout.css b/floof/public/layout.css
index 7a7308b..6f289a4 100644
--- a/floof/public/layout.css
+++ b/floof/public/layout.css
@@ -5,6 +5,8 @@ body { font-family: sans-serif; font-size: 12px; }
 #header #user { float: right; }
 #header #user form p { margin: 0; }
 
+#flash-messages { margin: 1em; padding: 1em; border: 3px double #c0c0c0; }
+
 #body { padding: 1em; }
 
 #footer { padding: 1em; background: #c0c0c0; }
diff --git a/floof/templates/account/register.mako b/floof/templates/account/register.mako
index 2de23a4..70d64b0 100644
--- a/floof/templates/account/register.mako
+++ b/floof/templates/account/register.mako
@@ -4,7 +4,7 @@
 
 ${h.form(url('register_finish'), method='POST')}
 <dl class="form">
-    <dt>Username</dt>
+    <dt>Username—lowercase letters, digits, and hyphens only; no more than 20 characters</dt>
     <dd>${h.text('username', value=c.username)}</dd>
 
     <dd>${h.submit(None, 'Register')}</dd>
diff --git a/floof/templates/art/show.mako b/floof/templates/art/show.mako
index 3ea3849..e13c295 100644
--- a/floof/templates/art/show.mako
+++ b/floof/templates/art/show.mako
@@ -5,19 +5,41 @@
 
 <h1>Viewing Art</h1>
 
-% if c.user:
-${h.form (h.url("art_tags", art_id=c.art.id))}
-Add Some Tags: ${h.text('tags')}
-${h.submit('submit', 'Tag!')}
-${h.end_form()}
+<div>
+    <img class="full" src="${h.storage_url('art/medium', c.art.hash)}">
+</div>
+
+<h2>Tags</h2>
+<ul>
+## Relations
+% for label, relations in (('Artist', c.art.artists), \
+                           ('Recipient', c.art.recipients), \
+                           ('Participant', c.art.participants)):
+    % for user in relations:
+    <li>${label}: <a href="${h.url('user_page', name=user.name)}">${user.name}</a>
+    % endfor
+% endfor
 
+## Regular tags
 % for tag in c.art.tags:
 ${h.form(h.url("art_tag", art_id=c.art.id, id=tag.id), method="delete")}
-${h.submit('delete', 'X')}
+${h.HTML.input(type='image', src='/icons/overlay/tag--minus.png', alt='[Remove]')}
 <a href="${url(controller='search', action='index', query=tag)}">${tag}</a>
 ${h.end_form()}
 % endfor
 
+% if c.user:
+${h.form(h.url("art_tags", art_id=c.art.id))}
+<p>
+    ${h.image('/icons/overlay/tag--plus.png', '')}
+    ${h.text('tags')} ${h.submit(None, 'Add tags!')}
+</p>
+${h.end_form()}
+% endif
+</ul>
+
+
+% if c.user:
 <h2>What do you think?</h2>
 ${h.form (h.url("rate_art", id=c.art.id), method="put")}
 % for score,text in sorted(Rating.options.items()):
@@ -32,17 +54,4 @@ ${h.submit('score', text)}
 ${h.end_form()}
 % endif
 
-<h2>Relations</h2>
-<ul>
-% for label, relations in (('Artist', c.art.artists), \
-                               ('Recipient', c.art.recipients), \
-                               ('Participant', c.art.participants)):
-% for user in relations:
-<li>${label}: <a href="${h.url('user_page', name=user.name)}">${user.name}</a>
-% endfor
-% endfor
-</ul>
-
-<img class="full" src="${h.storage_url('art/medium', c.art.hash)}">
-
 ${comments.comment_block(c.art.discussion.comments)}
diff --git a/floof/templates/comments/lib.mako b/floof/templates/comments/lib.mako
index e822a17..93fe086 100644
--- a/floof/templates/comments/lib.mako
+++ b/floof/templates/comments/lib.mako
@@ -1,5 +1,5 @@
 <%def name="comment_block(comments)">
-<h1>${len(comments)} comments</h1>
+<h1>${len(comments)} comment${'' if len(comments) == 1 else 's'}</h1>
 <p><a href="${url(controller='comments', action='thread', owner_url=h.get_comment_owner_url(**c.route))}">View all</a></p>
 <p><a href="${url(controller='comments', action='reply', owner_url=h.get_comment_owner_url(**c.route))}">Reply</a></p>
 ${comment_thread(comments)}
-- 
2.7.4