mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-18 00:00:00 +00:00
Rewrite notifications with popover class
This commit is contained in:
Daniel Pan
@@ -12,10 +12,12 @@ define([
|
||||
'app/views/dir',
|
||||
'app/views/starred-file',
|
||||
'app/views/devices',
|
||||
'app/views/activities'
|
||||
'app/views/activities',
|
||||
'app/views/notifications'
|
||||
], function($, Backbone, Common, SideNavView, MyReposView,
|
||||
SharedReposView, GroupsView, GroupView,
|
||||
OrgView, DirView, StarredFileView, DevicesView, ActivitiesView) {
|
||||
OrgView, DirView, StarredFileView, DevicesView, ActivitiesView,
|
||||
NotificationsView) {
|
||||
"use strict";
|
||||
|
||||
var Router = Backbone.Router.extend({
|
||||
@@ -45,7 +47,7 @@ define([
|
||||
Common.prepareApiCsrf();
|
||||
Common.initLocale();
|
||||
Common.initAccountPopup();
|
||||
Common.initNoticePopup();
|
||||
//Common.initNoticePopup();
|
||||
|
||||
this.sideNavView = new SideNavView();
|
||||
app.ui.sideNavView = this.sideNavView;
|
||||
@@ -61,6 +63,8 @@ define([
|
||||
this.devicesView = new DevicesView();
|
||||
this.activitiesView = new ActivitiesView();
|
||||
|
||||
app.ui.notificationsView = this.notificationsView = new NotificationsView();
|
||||
|
||||
this.currentView = this.myReposView;
|
||||
|
||||
$('#info-bar .close').click(Common.closeTopNoticeBar);
|
||||
|
||||
139
static/scripts/app/views/notifications.js
Normal file
139
static/scripts/app/views/notifications.js
Normal file
@@ -0,0 +1,139 @@
|
||||
define([
|
||||
'jquery',
|
||||
'underscore',
|
||||
'backbone',
|
||||
'common',
|
||||
'app/views/widgets/popover'
|
||||
], function($, _, Backbone, Common, PopoverView) {
|
||||
'use strict';
|
||||
|
||||
var View = PopoverView.extend({
|
||||
id: 'notice-popover',
|
||||
className: 'popover',
|
||||
|
||||
template: _.template($('#notice-popover-tmpl').html()),
|
||||
|
||||
initialize: function(options) {
|
||||
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.orig_doc_title = document.title;
|
||||
var _this = this;
|
||||
var reqUnreadNum = function() {
|
||||
$.ajax({
|
||||
url: Common.getUrl({name: 'get_unseen_notices_num'}),
|
||||
dataType: 'json',
|
||||
cache: false,
|
||||
success: function(data) {
|
||||
var count = data['count'],
|
||||
num = $('.num', _this.$notifications);
|
||||
num.html(count);
|
||||
if (count > 0) {
|
||||
num.removeClass('hide');
|
||||
document.title = '(' + count + ')' + _this.orig_doc_title;
|
||||
} else {
|
||||
num.addClass('hide');
|
||||
document.title = _this.orig_doc_title;
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
reqUnreadNum();
|
||||
// request every 30s
|
||||
setInterval(reqUnreadNum, 30*1000);
|
||||
|
||||
$('#notice-icon').click(function() {
|
||||
_this.toggle();
|
||||
return false;
|
||||
});
|
||||
},
|
||||
|
||||
render: function() {
|
||||
this.$el.html(this.template());
|
||||
return this;
|
||||
},
|
||||
|
||||
// override hide function
|
||||
hide: function() {
|
||||
var _this = this;
|
||||
app.ui.currentPopover = null;
|
||||
this.$el.detach();
|
||||
|
||||
if (this.$(".unread").length > 0) {
|
||||
// set all unread notice to be read
|
||||
$.ajax({
|
||||
url: Common.getUrl({name: 'set_notices_seen'}),
|
||||
type: 'POST',
|
||||
dataType: 'json',
|
||||
beforeSend: Common.prepareCSRFToken,
|
||||
success: function() {
|
||||
$('.num', _this.$notifications).html(0).addClass('hide');
|
||||
document.title = _this.orig_doc_title;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
showContent: function() {
|
||||
var _this = this;
|
||||
|
||||
this.$noticeList.addClass('hide');
|
||||
this.$error.hide();
|
||||
this.$loadingTip.show();
|
||||
|
||||
$.ajax({
|
||||
url: Common.getUrl({name: 'get_popup_notices'}),
|
||||
dataType: 'json',
|
||||
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();
|
||||
var err_msg;
|
||||
if (xhr.responseText) {
|
||||
err_msg = $.parseJSON(xhr.responseText).error;
|
||||
} else {
|
||||
err_msg = gettext('Please check the network.');
|
||||
}
|
||||
_this.$error.html(err_msg).show();
|
||||
}
|
||||
});
|
||||
|
||||
this.$notifications.append(this.$el);
|
||||
return false;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
return View;
|
||||
});
|
||||
@@ -536,127 +536,6 @@ define([
|
||||
});
|
||||
},
|
||||
|
||||
initNoticePopup: function() {
|
||||
var _this = this;
|
||||
var msg_ct = $("#msg-count");
|
||||
|
||||
// for login page, and pages without 'header' such as 'file view' page.
|
||||
if (msg_ct.length == 0) {
|
||||
return false;
|
||||
}
|
||||
// original title
|
||||
var orig_doc_title = document.title;
|
||||
msg_ct.data('orig_doc_title', orig_doc_title); // for 'mark all read' in 'notice list' page
|
||||
var reqUnreadNum = function() {
|
||||
$.ajax({
|
||||
url: _this.getUrl({name: 'get_unseen_notices_num'}),
|
||||
dataType: 'json',
|
||||
cache: false,
|
||||
success: function(data) {
|
||||
var count = data['count'],
|
||||
num = $('.num', msg_ct);
|
||||
num.html(count);
|
||||
if (count > 0) {
|
||||
num.removeClass('hide');
|
||||
document.title = '(' + count + ')' + orig_doc_title;
|
||||
} else {
|
||||
num.addClass('hide');
|
||||
document.title = orig_doc_title;
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
reqUnreadNum();
|
||||
// request every 30s
|
||||
setInterval(reqUnreadNum, 30*1000);
|
||||
|
||||
$('#notice-icon').click(function() {
|
||||
var popup = $('#notice-popup');
|
||||
popup.toggleClass('hide');
|
||||
|
||||
if (!popup.hasClass('hide')) {
|
||||
$('.con', popup).css({'max-height':$(window).height() - $('#header').outerHeight() - $('.hd', popup).outerHeight() - 3});
|
||||
var loading_tip = $('.loading-tip', popup),
|
||||
notice_list = $('#notice-list');
|
||||
notice_list.addClass('hide');
|
||||
loading_tip.show();
|
||||
$('.error', popup).addClass('hide');
|
||||
|
||||
$.ajax({
|
||||
url: _this.getUrl({name: 'get_popup_notices'}),
|
||||
dataType: 'json',
|
||||
success: function(data) {
|
||||
loading_tip.hide();
|
||||
notice_list.html(data['notice_html']).removeClass('hide');
|
||||
|
||||
// set a notice to be read when <a> in it is clicked
|
||||
$('.unread a', notice_list).click(function() {
|
||||
var notice_id = $(this).parents('.unread').data('id');
|
||||
var link_href = $(this).attr('href');
|
||||
$.ajax({
|
||||
url: _this.getUrl({name: 'set_notice_seen_by_id'}) + '?notice_id=' + encodeURIComponent(notice_id),
|
||||
type: 'POST',
|
||||
dataType: 'json',
|
||||
beforeSend: _this.prepareCSRFToken,
|
||||
success: function(data) {
|
||||
location.href = link_href;
|
||||
},
|
||||
error: function() {
|
||||
location.href = link_href;
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
$('.detail', notice_list).click(function() {
|
||||
location.href = $('.brief a', $(this).parent()).attr('href');
|
||||
});
|
||||
},
|
||||
error: function (xhr, textStatus, errorThrown) {
|
||||
if (xhr.responseText) {
|
||||
var error = $.parseJSON(xhr.responseText).error;
|
||||
loading_tip.hide();
|
||||
if ($('.error', popup).length == 0) {
|
||||
loading_tip.after('<p class="error alc">' + error + '</p>');
|
||||
} else {
|
||||
$('.error', popup).removeClass('hide');
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
return false;
|
||||
});
|
||||
$(window).resize(function() {
|
||||
var popup = $('#notice-popup');
|
||||
if (!popup.hasClass('hide')) {
|
||||
$('.con', popup).css({'max-height':$(window).height() - $('#header').outerHeight() - $('.hd', popup).outerHeight() - 3});
|
||||
}
|
||||
});
|
||||
|
||||
$('#notice-popup .close').click(function() {
|
||||
$('#notice-popup').addClass('hide');
|
||||
if ($('#notice-list .unread').length > 0) {
|
||||
// set all unread notice to be read
|
||||
$.ajax({
|
||||
url: _this.getUrl({name: 'set_notices_seen'}),
|
||||
type: 'POST',
|
||||
dataType: 'json',
|
||||
beforeSend: _this.prepareCSRFToken,
|
||||
success: function() {
|
||||
$('.num', msg_ct).html(0).addClass('hide');
|
||||
document.title = orig_doc_title;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
$(document).click(function(e) {
|
||||
_this.closePopup(e, $('#notice-popup'), $('#notice-icon'));
|
||||
});
|
||||
},
|
||||
|
||||
closeTopNoticeBar: function () {
|
||||
if (!app.pageOptions.cur_note) {
|
||||
return false;
|
||||
|
||||
Reference in New Issue
Block a user