From 7340a69fe6da9acd34d97bfb584f442777149c4e Mon Sep 17 00:00:00 2001
From: Richard Harding <rharding@mitechie.com>
Date: Thu, 29 Mar 2012 19:08:10 -0400
Subject: [PATCH] Add icons to the nav and for invite notification, fix the
 events in invite view

---
 bookie/static/css/base.scss          | 13 ++++++++++
 bookie/static/js/bookie/view.js      | 10 ++++----
 bookie/templates/accounts/index.mako |  3 +--
 bookie/templates/bmark/func.mako     |  2 --
 bookie/templates/jstpl.mako          |  6 ++++-
 bookie/templates/main_wrap.mako      | 36 ++++++++++++++++++++++++----
 combo.py                             |  5 ++--
 7 files changed, 58 insertions(+), 17 deletions(-)

diff --git a/bookie/static/css/base.scss b/bookie/static/css/base.scss
index 50af0b8a..10e93887 100644
--- a/bookie/static/css/base.scss
+++ b/bookie/static/css/base.scss
@@ -35,6 +35,10 @@ em.icon {
     position: absolute;
 }
 
+.navigation .icon {
+    padding: 0;
+}
+
 @mixin cabin() {
     font-family: 'Cabin', sans-serif;
 }
@@ -132,6 +136,10 @@ a {
     display: inline;
     float: right;
 
+    span {
+        margin: 0 .3em;
+    }
+
     a {
         text-decoration: none;
     }
@@ -310,6 +318,11 @@ form {
         margin-bottom: .3em;
         color: black;
 
+        .icon {
+            color: black;
+            font-size: 16px;
+        }
+
         &:hover {
             cursor: hand;
         }
diff --git a/bookie/static/js/bookie/view.js b/bookie/static/js/bookie/view.js
index 0be27a43..224b20d0 100644
--- a/bookie/static/js/bookie/view.js
+++ b/bookie/static/js/bookie/view.js
@@ -1012,10 +1012,10 @@ YUI.add('bookie-view', function (Y) {
             'input#send_invite': {
                 click: 'invite'
             },
-            '.invite_container form': {
+            'form': {
                 submit: 'kill'
             },
-            '#invite_heading': {
+            '.heading': {
                 click: '_toggle_container'
             }
         },
@@ -1102,7 +1102,7 @@ YUI.add('bookie-view', function (Y) {
         },
 
         render: function () {
-            return this.ctpl(this.get('user'));
+            this.get('container').setContent(this.ctpl(this.get('user')));
         },
 
         /**
@@ -1139,9 +1139,7 @@ YUI.add('bookie-view', function (Y) {
             },
 
             container: {
-                valueFn: function () {
-                    return Y.one('#invite_container');
-                }
+                value: '#invite_container'
             },
 
             /**
diff --git a/bookie/templates/accounts/index.mako b/bookie/templates/accounts/index.mako
index 8aa08888..7d63d574 100644
--- a/bookie/templates/accounts/index.mako
+++ b/bookie/templates/accounts/index.mako
@@ -118,8 +118,7 @@ ${password_reset(user, reset=False)}
                             invite_ct: ${user.invite_ct}
                         }
                     });
-
-                    Y.one('#invite_container').setContent(invite_view.render());
+                    invite_view.render();
                 % endif
             });
         });
diff --git a/bookie/templates/bmark/func.mako b/bookie/templates/bmark/func.mako
index bfae4abc..8c07566a 100644
--- a/bookie/templates/bmark/func.mako
+++ b/bookie/templates/bmark/func.mako
@@ -46,5 +46,3 @@
         pager.set('page', ${page});
     % endif
 </%def>
-
-
diff --git a/bookie/templates/jstpl.mako b/bookie/templates/jstpl.mako
index de2f8413..825e1c09 100644
--- a/bookie/templates/jstpl.mako
+++ b/bookie/templates/jstpl.mako
@@ -112,7 +112,11 @@
 
 <script type="text/template" id="account_invites">
     <div class="form">
-        <a href="" id="invite_heading" class="heading">You have invites!</a>
+        <a href="" id="invite_heading" class="heading">
+            <span aria-hidden="true" class="icon icon-envelope" title="You have invites!"></span>
+            <em class="icon">Invite</em>
+            You have invites!
+        </a>
         <div id="invite_body" style="display: none; opacty: 0;">
             <p>Please, invite others to join Bookie and Bmark.us.</p>
             <form id="#invite_form">
diff --git a/bookie/templates/main_wrap.mako b/bookie/templates/main_wrap.mako
index 6ffcd31b..2d99b56b 100644
--- a/bookie/templates/main_wrap.mako
+++ b/bookie/templates/main_wrap.mako
@@ -57,17 +57,45 @@
                 <span class="alt_logo">&nbsp;&#45; bookmark your web</span>
             </div>
             <div class="navigation">
-                <span class="item"><a href="/recent" class="button nav_button">All</a></span>
+                <span class="item">
+                    <a href="/recent" class="button nav_button">
+                        <span aria-hidden="true" class="icon icon-tags" title="All Bookmarks"></span>
+                        <em class="icon">All Bookmarks</em>
+                        All
+                    </a>
+                </span>
 
                 % if request.user:
-                    <span class="item"><a href="/${request.user.username}/recent" class="button nav_button">Mine</a></span>
+                    <span class="item">
+                        <a href="/${request.user.username}/recent" class="button nav_button">
+                            <span aria-hidden="true" class="icon icon-tag"
+                            title="My Bookmarks"></span>
+                            <em class="icon">My Bookmarks</em>
+                            Mine
+                        </a>
+                    </span>
                 % endif
 
-                <span class="item"><a href="/search" class="button nav_button">Search</a></span>
+                <span class="item">
+                    <a href="/search" class="button nav_button">
+                        <span aria-hidden="true" class="icon icon-search" title="Search"></span>
+                        <em class="icon">Search</em>
+                        Search
+                    </a>
+                </span>
 
                 % if request.user and request.user.username:
                     <span class="item">
-                        <a href="${request.route_url('user_account', username=request.user.username)}" class="button nav_button">Account
+                        <a href="${request.route_url('user_account', username=request.user.username)}" class="button nav_button">
+                            % if request.user.has_invites():
+                                <span aria-hidden="true" class="icon icon-envelope" title="You have invites!"></span>
+                                <em class="icon">Invite</em>
+                            % else:
+                                <span aria-hidden="true" class="icon icon-user" title="Account Details"></span>
+                                <em class="icon">Account Details</em>
+
+                            % endif
+                            Account
                     </a></span>
                 % else:
                     <span class="item"><a href="/login" class="button nav_button">Login</a></span>
diff --git a/combo.py b/combo.py
index 9f91a1d2..c53b65d4 100644
--- a/combo.py
+++ b/combo.py
@@ -1,6 +1,7 @@
 """WSGI file to serve the combo JS out of convoy"""
+import os
 from convoy.combo import combo_app
 
-JS_FILES = '/home/bmark.us/prod/bookie/bookie/static/js/build'
-
+root_dir = os.path.dirname(__file__)
+JS_FILES = root_dir + '/bookie/static/js/build'
 application = combo_app(JS_FILES)