more changes to notification dropdown in header bar

v1.18.x
Julian Lam 12 years ago
parent 64f320743a
commit c8d48127ad

@ -742,4 +742,26 @@ body .navbar .nodebb-inline-block {
#chat-message-input {
width:95%;
}
.dropdown-toggle {
i {
font-size: 12px;
&.active {
color: #558;
text-shadow: 0 0 1em #aaf, 0 0 1em #aaf, 0 0 1em #aaf;
}
}
}
#notif-list {
li {
font-size: 12px;
width: 200px;
&.unread {
background: #eceff5;
}
}
}

@ -88,7 +88,50 @@
}, false);
// Notifications dropdown
// var notifTrigger = document.querySelector('.notifications a');
var notifTrigger = document.querySelector('.notifications a'),
notifList = document.getElementById('notif-list');
notifTrigger.addEventListener('click', function() {
socket.emit('api:notifications.get');
});
notifList.addEventListener('click', function(e) {
var target;
switch(e.target.nodeName) {
case 'SPAN': target = e.target.parentNode.parentNode; break;
case 'A': target = e.target.parentNode; break;
case 'li': target = e.target; break;
}
if (target) {
var nid = target.getAttribute('data-nid');
socket.emit('api:notifications.mark_read', nid);
}
})
socket.on('api:notifications.get', function(data) {
console.log(data);
var notifFrag = document.createDocumentFragment(),
notifEl = document.createElement('li'),
numRead = data.read.length,
numUnread = data.unread.length,
x;
notifList.innerHTML = '';
for(x=0;x<numUnread;x++) {
notifEl.setAttribute('data-nid', data.unread[x].nid);
notifEl.className = 'unread';
notifEl.innerHTML = '<a href="' + data.unread[x].path + '"><span class="pull-right">11m</span>' + data.unread[x].text + '</a>';
notifFrag.appendChild(notifEl.cloneNode(true));
}
for(x=0;x<numRead;x++) {
notifEl.setAttribute('data-nid', data.read[x].nid);
notifEl.className = '';
notifEl.innerHTML = '<a href="' + data.read[x].path + '"><span class="pull-right">11m</span>' + data.read[x].text + '</a>';
notifFrag.appendChild(notifEl.cloneNode(true));
}
notifList.appendChild(notifFrag);
});
socket.on('api:notifications.counts', function(counts) {
var notifIcon = document.querySelector('.notifications a i');
if ((counts.unread + counts.read) > 0) notifIcon.className = 'icon-circle active';
else notifIcon.className = 'icon-circle-blank';
});
}());
</script>
<!-- END Forum Info -->

@ -33,23 +33,23 @@
<div class="nav-collapse collapse">
<ul class="nav nodebb-inline-block">
<li>
<a href="/latest">Recent <span class="badge badge-inverse">3</span></a>
</li>
<li>
<a href="/popular">Popular</a>
</li>
<li>
<a href="/active">Active</a>
</li>
<li>
<a href="/users">Users</a>
</li>
<a href="/latest">Recent <span class="badge badge-inverse">3</span></a>
</li>
<li>
<a href="/popular">Popular</a>
</li>
<li>
<a href="/active">Active</a>
</li>
<li>
<a href="/users">Users</a>
</li>
</ul>
<ul class="nav pull-right nodebb-inline-block" id="right-menu">
<li class="notifications">
<a href="#" id="notif_dropdown"><i class="icon-circle-blank"></i></a>
<ul class="dropdown-menu" aria-labelledby="notif_dropdown">
<li>nibs!</li>
<li class="notifications dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="notif_dropdown"><i class="icon-circle-blank"></i></a>
<ul id="notif-list" class="dropdown-menu" aria-labelledby="notif_dropdown">
<li><a href="#"><i class="icon-refresh icon-spin"></i> Loading Notifications</a></li>
</ul>
</li>
</ul>

@ -1,13 +1,16 @@
var config = require('../config.js'),
RDB = require('./redis.js');
RDB = require('./redis.js'),
async = require('async');
(function(Notifications) {
Notifications.get = function(nid, callback) {
RDB.hmget('notifications:' + nid, 'text', 'score', 'path', function(err, notification) {
RDB.hmget('notifications:' + nid, 'text', 'score', 'path', 'datetime', function(err, notification) {
callback({
nid: nid,
text: notification[0],
score: notification[1],
path: notification[2]
path: notification[2],
datetime: notification[3]
});
});
}
@ -57,4 +60,14 @@ var config = require('../config.js'),
});
}
}
Notifications.mark_read_multiple = function(nids, uid, callback) {
async.each(nids, function(nid, next) {
Notifications.mark_read(nid, uid, function(success) {
if (success) next(null);
});
}, function(err) {
if (callback && !err) callback(true);
});
}
}(exports));

@ -776,7 +776,6 @@ var config = require('../config.js'),
next();
});
}, function(err) {
console.log(read);
next(null, read);
});
} else next(null, read);
@ -785,6 +784,22 @@ var config = require('../config.js'),
}, function(err, notifications) {
callback(notifications);
});
},
counts: function(uid, callback) {
async.parallel({
unread: function(next) {
RDB.zcount('uid:' + uid + ':notifications:unread', 0, 10, function(err, count) {
next(null, count);
});
},
read: function(next) {
RDB.zcount('uid:' + uid + ':notifications:read', 0, 10, function(err, count) {
next(null, count);
});
}
}, function(err, counts) {
callback(counts);
});
}
}
}(exports));

@ -240,9 +240,14 @@ var express = require('express'),
app.get('/api/:method/:id*', api_method);
app.get('/test', function(req, res) {
user.notifications.get(2, function(notifs) {
res.send(JSON.stringify(notifs, null, 4));
notifications.mark_read_multiple([1, 2], 1, function(success) {
res.send('mark: ' + success);
});
// notifications.create('some text', 5, '/category/2/general-discussion', function(nid) {
// notifications.push(nid, 1, function() {
// res.send('nid: ', nid)
// });
// });
});

@ -239,11 +239,21 @@ var SocketIO = require('socket.io').listen(global.server,{log:false}),
});
socket.on('api:notifications.get', function(data) {
notifications.get(uid, function(notifs) {
user.notifications.get(uid, function(notifs) {
socket.emit('api:notifications.get', notifs);
});
});
socket.on('api:notifications.counts', function(data) {
user.notifications.counts(uid, function(counts) {
socket.emit('api:notifications.counts', counts);
});
});
socket.on('api:notifications.mark_read', function(nid) {
notifications.mark_read(nid, uid);
});
socket.on('sendChatMessage', function(data) {
var touid = data.touid;

Loading…
Cancel
Save