1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-04 20:52:43 +01:00
phorge-phorge/webroot/rsrc/js/application/aphlict/behavior-aphlict-dropdown.js
epriestley 92678eb050 Improve style of notifications
Summary:
  - Gets about 25% of the way toward @chad's notification mocks.
    - YES: Hover states, entire notification is a click target, border, header, footer.
    - NO: Profile pictures (lazy), timestamps (want to refactor time code before introducing a new formatting style), app icons (they'd look funny without timestamps I think)
  - Deletes some old files.
  - Mostly trying to get this good enough to turn on by default.

Test Plan: Looked at notifications. Clicked some notifications.

Reviewers: chad, btrahan

Reviewed By: btrahan

CC: aran

Differential Revision: https://secure.phabricator.com/D4119
2012-12-07 16:26:43 -08:00

92 lines
2 KiB
JavaScript

/**
* @provides javelin-behavior-aphlict-dropdown
* @requires javelin-behavior
* javelin-request
* javelin-stratcom
* javelin-vector
* javelin-dom
* javelin-uri
*/
JX.behavior('aphlict-dropdown', function(config) {
var dropdown = JX.$(config.dropdownID);
var count = JX.$(config.countID);
var bubble = JX.$(config.bubbleID);
var visible = false;
var request = null;
function refresh() {
if (request) { //already fetching
return;
}
request = new JX.Request('/notification/panel/', function(response) {
var display = (response.number > 999)
? "\u221E"
: response.number;
JX.DOM.setContent(count, display);
if (response.number == 0) {
JX.DOM.alterClass(bubble, 'alert-unread', false);
} else {
JX.DOM.alterClass(bubble, 'alert-unread', true);
}
JX.DOM.setContent(dropdown, JX.$H(response.content));
request = null;
});
request.send();
}
JX.Stratcom.listen(
'click',
null,
function(e) {
if (!e.getNode('phabricator-notification-menu')) {
// Click outside the dropdown; hide it.
JX.DOM.hide(dropdown);
visible = false;
return;
}
if (e.getNode('tag:a')) {
// User clicked a link, just follow the link.
return;
}
// If the user clicked a notification (but missed a link) and it has a
// primary URI, go there.
var href = e.getNodeData('notification').href;
if (href) {
JX.$U(href).go();
e.kill();
}
});
JX.DOM.listen(
bubble,
'click',
null,
function(e) {
if (!e.isNormalClick()) {
return;
}
if (visible) {
JX.DOM.hide(dropdown);
} else {
refresh();
var p = JX.$V(bubble);
p.y = null;
p.x -= 6;
p.setPos(dropdown);
JX.DOM.show(dropdown);
}
visible = !visible;
e.kill();
}
)
JX.Stratcom.listen('notification-panel-update', null, refresh);
});