[notice, account] modification

media/css/seahub.css

@@ -1197,23 +1197,22 @@ textarea:-moz-placeholder {/* for FF */
     margin:4px 0 0;
 }
 .popover-con {
+    padding:0 10px;
     overflow:auto;
 }
 a.popover-item {
+    display:block;
     color:#444;
     font-weight:normal;
-    text-decoration:none;
-    display:block;
-    padding-left:10px;
-    padding-right:10px;
     line-height:31px;
-    cursor:pointer;
+    text-decoration:none;
-    margin:5px 0;
+    padding:0 10px;
+    margin:5px -10px;
 }
 /**** user-item ****/ /* e.g. group member in 'group members' panel */
 .user-item {
-    margin:5px 0;
+    padding:0 10px;
-    padding-left:10px;
+    margin:5px -10px;
 }
 .user-item .txt {
     margin-left:40px;
@@ -1445,7 +1444,7 @@ button.dropdown-toggle:focus {
 /* top-bar */
 #notifications {
     position:relative;
-    margin:10px 32px 0 25px;
+    margin:10px 0 0 25px;
 }
 #notifications .sf2-icon-bell {
     font-size:24px;
@@ -1474,13 +1473,15 @@ button.dropdown-toggle:focus {
     font-weight:normal;
 }
 #notice-popover li {
-    padding:9px 10px 3px 8px;
+    padding:9px 0 3px;
     border-bottom:1px solid #dfdfe1;
 }
 #notice-popover li.unread {
     background:#f5f5f7;
+    padding-right:10px;
+    padding-left:8px;
     border-left:2px solid #feac74;
-    padding-left:6px;
+    margin:0 -10px;
 }
 #notice-popover .avatar {
     border-radius:1000px;
@@ -1494,12 +1495,14 @@ button.dropdown-toggle:focus {
     color:#999;
     text-align:right;
     margin:0;
+    clear:both;
 }
 #notice-popover .all {
     color:#a4a4a4;
 }
 #account {
     position:relative;
+    margin-left:32px;
 }
 #account .avatar {
     vertical-align:middle;
@@ -1516,7 +1519,6 @@ button.dropdown-toggle:focus {
     margin-left:45px;
 }
 .account-popup {
-    text-align:left;
     right:0;
     top:48px;
     font-size:13px;
@@ -1525,8 +1527,8 @@ button.dropdown-toggle:focus {
     top:-10px;
     left:200px;
 }
-.account-popup > .item:last-child {
+.account-popup .popover-con {
-    border-bottom:none;
+    padding:0;
 }
 .account-popup .item {
     display:block;

media/js/base.js

@@ -58,8 +58,6 @@ $(document).click(function(e) {
         }
     };
     closePopup($('#user-info-popup'), $('#my-info'));
-    closePopup($('#top-nav-grp-info'), $('#top-nav-grp'));
-    closePopup($('#notice-popup'), $('#notice-icon'));
 });
 
 // search: disable submit when input nothing

seahub/templates/base.html

@@ -46,12 +46,6 @@
                     {% include 'snippets/search_form.html' %}
                 {% endif %}
 
-                <div data-url="{% url 'unseen_notices_count' %}" id="notifications" class="fleft">
-                    <a href="#" class="no-deco" id="notice-icon" title="{% trans "Notifications" %}" aria-label="{% trans "Notifications" %}">
-                        <span class="sf2-icon-bell"></span>
-                        <span class="num hide">0</span>
-                    </a>
-                </div>
 
                 <div id="account" class="fright">
                     <a id="my-info" href="#" class="no-deco" aria-label="{% trans "View profile and more" %}">

seahub/templates/js/templates.html

@@ -1426,9 +1426,9 @@
     </div>
     <div class="popover-con">
         <span class="loading-icon loading-tip"></span>
+        <p class="error alc hide"></p>
         <ul class="hide notice-list"></ul>
         <p class="alc"><a href="{% url 'user_notification_list' %}" class="all">{% trans "See All Notifications" %}</a></p>
-        <p class="error alc hide"></p>
     </div>
 </script>
 
@@ -1444,7 +1444,7 @@
         </div>
         <div class="loading-icon loading-tip"></div>
         <p class="error alc hide"></p>
-        <div id="space-traffic" class="hide" data-url="{% url 'space_and_traffic' %}"></div>
+        <div id="space-traffic" class="hide"></div>
         <a class="item" href="{{ SITE_ROOT }}profile/">{% trans "Settings" %}</a>
         <a href="{{ SITE_ROOT }}accounts/logout/" class="item" id="logout">{% trans "Log out" %}</a>
     </div>

static/scripts/app/router.js

@@ -47,8 +47,6 @@ define([
 
             Common.prepareApiCsrf();
             Common.initLocale();
-            //Common.initAccountPopup();
-            //Common.initNoticePopup();
 
             this.sideNavView = new SideNavView();
             app.ui.sideNavView = this.sideNavView;

static/scripts/app/views/account.js

@@ -42,7 +42,7 @@ define([
             this.$space.addClass('hide');
 
             $.ajax({
-                url: this.$space.data('url'),
+                url: Common.getUrl({'name': 'space_and_traffic'}),
                 dataType: 'json',
                 cache: false,
                 success: function(data) {
@@ -62,7 +62,6 @@ define([
             });
 
             this.$account.append(this.$el);
-            return false;
         }
 
     });

static/scripts/app/views/notifications.js

@@ -17,13 +17,17 @@ define([
             PopoverView.prototype.initialize.call(this);
 
             this.render();
+
             this.$loadingTip = this.$('.loading-tip');
             this.$error = this.$('.error');
             this.$noticeList = this.$('.notice-list');
 
             this.$notifications = $("#notifications");
+            this.$num = $('.num', this.$notifications);
             this.orig_doc_title = document.title;
+
             var _this = this;
+
             var reqUnreadNum = function() {
                 $.ajax({
                     url: Common.getUrl({name: 'get_unseen_notices_num'}),
@@ -31,13 +35,13 @@ define([
                     cache: false,
                     success: function(data) {
                         var count = data['count'],
-                            num = $('.num', _this.$notifications);
+                            $num = _this.$num;
-                        num.html(count);
+                        $num.html(count);
                         if (count > 0) {
-                            num.removeClass('hide');
+                            $num.removeClass('hide');
                             document.title = '(' + count + ')' + _this.orig_doc_title;
                         } else {
-                            num.addClass('hide');
+                            $num.addClass('hide');
                             document.title =  _this.orig_doc_title;
                         }
                     }
@@ -58,6 +62,35 @@ define([
             return this;
         },
 
+        events: {
+            'click .detail': 'viewDetail',
+            'click .unread a': 'visitUnread'
+        },
+
+        viewDetail: function(e) {
+            var $el = $(e.currentTarget);
+            location.href = $('.brief a', $el.parent()).attr('href');
+        },
+
+        visitUnread: function(e) {
+            var $el = $(e.currentTarget);
+            var notice_id = $el.closest('.unread').data('id');
+            var link_href = $el.attr('href');
+            $.ajax({
+                url: Common.getUrl({name: 'set_notice_seen_by_id'}) + '?notice_id=' + encodeURIComponent(notice_id),
+                type: 'POST',
+                dataType: 'json',
+                beforeSend: Common.prepareCSRFToken,
+                success: function(data) {
+                    location.href = link_href;
+                },
+                error: function() {
+                    location.href = link_href;
+                }
+            });
+            return false;
+        },
+
         // override hide function
         hide: function() {
             var _this = this;
@@ -72,7 +105,7 @@ define([
                     dataType: 'json',
                     beforeSend: Common.prepareCSRFToken,
                     success: function() {
-                        $('.num', _this.$notifications).html(0).addClass('hide');
+                        _this.$num.html(0).addClass('hide');
                         document.title = _this.orig_doc_title;
                     }
                 });
@@ -94,28 +127,6 @@ define([
                 success: function(data) {
                     _this.$loadingTip.hide();
                     _this.$noticeList.html(data['notice_html']).show();
-
-                    // set a notice to be read when <a> in it is clicked
-                    $('.unread a', _this.$noticeList).click(function() {
-                        var notice_id = $(this).parents('.unread').data('id');
-                        var link_href = $(this).attr('href');
-                        $.ajax({
-                            url: Common.getUrl({name: 'set_notice_seen_by_id'}) + '?notice_id=' + encodeURIComponent(notice_id),
-                            type: 'POST',
-                            dataType: 'json',
-                            beforeSend: Common.prepareCSRFToken,
-                            success: function(data) {
-                                location.href = link_href;
-                            },
-                            error: function() {
-                                location.href = link_href;
-                            }
-                        });
-                        return false;
-                    });
-                    $('.detail', _this.$noticeList).click(function() {
-                        location.href = $('.brief a', $(this).parent()).attr('href');
-                    });
                 },
                 error: function (xhr, textStatus, errorThrown) {
                     _this.$loadingTip.hide();
@@ -130,7 +141,6 @@ define([
             });
 
             this.$notifications.append(this.$el);
-            return false;
         }
 
     });

static/scripts/app/views/widgets/popover.js

@@ -20,8 +20,7 @@ define([
         }
 
         if (!view.$el.is(target)
-            && !view.$el.find('*').is(target))
+            && !view.$el.find('*').is(target)) {
-        {
             view.hide();
         }
         return true;

static/scripts/common.js

@@ -153,6 +153,7 @@ define([
                 case 'events': return siteRoot + 'api2/events/';
                 case 'search_user': return siteRoot + 'api2/search-user/';
                 case 'user_profile': return siteRoot + 'profile/' + options.username + '/';
+                case 'space_and_traffic': return siteRoot + 'ajax/space_and_traffic/';
             }
         },