revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2025-02-18 09:48:39 +01:00
Code Issues Releases Wiki Activity

Improve style of notifications

Browse source 
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
This commit is contained in:
epriestley 2012-12-07 16:26:43 -08:00
parent 0bd3f3c53e
commit 92678eb050
13 changed files with 149 additions and 89 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

151
src/__celerity_resource_map__.php
View file

@ -942,7 +942,7 @@ celerity_register_resource_map(array(
), ),
'javelin-behavior-aphlict-dropdown' => 'javelin-behavior-aphlict-dropdown' =>
array( array(
'uri' => '/res/e9b6fd18/rsrc/js/application/aphlict/behavior-aphlict-dropdown.js', 'uri' => '/res/f09bc90d/rsrc/js/application/aphlict/behavior-aphlict-dropdown.js',
'type' => 'js', 'type' => 'js',
'requires' => 'requires' =>
array( array(
@ -951,6 +951,7 @@ celerity_register_resource_map(array(
2 => 'javelin-stratcom', 2 => 'javelin-stratcom',
3 => 'javelin-vector', 3 => 'javelin-vector',
4 => 'javelin-dom', 4 => 'javelin-dom',
5 => 'javelin-uri',
), ),
'disk' => '/rsrc/js/application/aphlict/behavior-aphlict-dropdown.js', 'disk' => '/rsrc/js/application/aphlict/behavior-aphlict-dropdown.js',
), ),
@ -2638,7 +2639,7 @@ celerity_register_resource_map(array(
), ),
'phabricator-notification-menu-css' => 'phabricator-notification-menu-css' =>
array( array(
'uri' => '/res/b0d1caec/rsrc/css/application/base/notification-menu.css', 'uri' => '/res/a9ff4f31/rsrc/css/application/base/notification-menu.css',
'type' => 'css', 'type' => 'css',
'requires' => 'requires' =>
array( array(
@ -3192,7 +3193,7 @@ celerity_register_resource_map(array(
), array( ), array(
'packages' => 'packages' =>
array( array(
'668bdb91' => '6e75f775' =>
array( array(
'name' => 'core.pkg.css', 'name' => 'core.pkg.css',
'symbols' => 'symbols' =>
@ -3236,10 +3237,10 @@ celerity_register_resource_map(array(
36 => 'phabricator-crumbs-view-css', 36 => 'phabricator-crumbs-view-css',
37 => 'phabricator-object-item-list-view-css', 37 => 'phabricator-object-item-list-view-css',
), ),
'uri' => '/res/pkg/668bdb91/core.pkg.css', 'uri' => '/res/pkg/6e75f775/core.pkg.css',
'type' => 'css', 'type' => 'css',
), ),
'5673560d' => '5bcc25b6' =>
array( array(
'name' => 'core.pkg.js', 'name' => 'core.pkg.js',
'symbols' => 'symbols' =>
@ -3276,7 +3277,7 @@ celerity_register_resource_map(array(
29 => 'phabricator-textareautils', 29 => 'phabricator-textareautils',
30 => 'phabricator-file-upload', 30 => 'phabricator-file-upload',
), ),
'uri' => '/res/pkg/5673560d/core.pkg.js', 'uri' => '/res/pkg/5bcc25b6/core.pkg.js',
'type' => 'js', 'type' => 'js',
), ),
'3c5efda9' => '3c5efda9' =>
@ -3424,20 +3425,20 @@ celerity_register_resource_map(array(
'reverse' => 'reverse' =>
array( array(
'aphront-attached-file-view-css' => '7839ae2d', 'aphront-attached-file-view-css' => '7839ae2d',
'aphront-crumbs-view-css' => '668bdb91', 'aphront-crumbs-view-css' => '6e75f775',
'aphront-dialog-view-css' => '668bdb91', 'aphront-dialog-view-css' => '6e75f775',
'aphront-error-view-css' => '668bdb91', 'aphront-error-view-css' => '6e75f775',
'aphront-form-view-css' => '668bdb91', 'aphront-form-view-css' => '6e75f775',
'aphront-headsup-action-list-view-css' => 'c904bbee', 'aphront-headsup-action-list-view-css' => 'c904bbee',
'aphront-headsup-view-css' => '668bdb91', 'aphront-headsup-view-css' => '6e75f775',
'aphront-list-filter-view-css' => '668bdb91', 'aphront-list-filter-view-css' => '6e75f775',
'aphront-pager-view-css' => '668bdb91', 'aphront-pager-view-css' => '6e75f775',
'aphront-panel-view-css' => '668bdb91', 'aphront-panel-view-css' => '6e75f775',
'aphront-side-nav-view-css' => '668bdb91', 'aphront-side-nav-view-css' => '6e75f775',
'aphront-table-view-css' => '668bdb91', 'aphront-table-view-css' => '6e75f775',
'aphront-tokenizer-control-css' => '668bdb91', 'aphront-tokenizer-control-css' => '6e75f775',
'aphront-tooltip-css' => '668bdb91', 'aphront-tooltip-css' => '6e75f775',
'aphront-typeahead-control-css' => '668bdb91', 'aphront-typeahead-control-css' => '6e75f775',
'differential-changeset-view-css' => 'c904bbee', 'differential-changeset-view-css' => 'c904bbee',
'differential-core-view-css' => 'c904bbee', 'differential-core-view-css' => 'c904bbee',
'differential-inline-comment-editor' => '7ecd31fa', 'differential-inline-comment-editor' => '7ecd31fa',
@ -3452,18 +3453,18 @@ celerity_register_resource_map(array(
'diffusion-commit-view-css' => 'c8ce2d88', 'diffusion-commit-view-css' => 'c8ce2d88',
'diffusion-icons-css' => 'c8ce2d88', 'diffusion-icons-css' => 'c8ce2d88',
'inline-comment-summary-css' => 'c904bbee', 'inline-comment-summary-css' => 'c904bbee',
'javelin-aphlict' => '5673560d', 'javelin-aphlict' => '5bcc25b6',
'javelin-behavior' => 'db6d724d', 'javelin-behavior' => 'db6d724d',
'javelin-behavior-aphlict-dropdown' => '5673560d', 'javelin-behavior-aphlict-dropdown' => '5bcc25b6',
'javelin-behavior-aphlict-listen' => '5673560d', 'javelin-behavior-aphlict-listen' => '5bcc25b6',
'javelin-behavior-aphront-basic-tokenizer' => '5673560d', 'javelin-behavior-aphront-basic-tokenizer' => '5bcc25b6',
'javelin-behavior-aphront-drag-and-drop' => '7ecd31fa', 'javelin-behavior-aphront-drag-and-drop' => '7ecd31fa',
'javelin-behavior-aphront-drag-and-drop-textarea' => '7ecd31fa', 'javelin-behavior-aphront-drag-and-drop-textarea' => '7ecd31fa',
'javelin-behavior-aphront-form-disable-on-submit' => '5673560d', 'javelin-behavior-aphront-form-disable-on-submit' => '5bcc25b6',
'javelin-behavior-audit-preview' => '5e68be89', 'javelin-behavior-audit-preview' => '5e68be89',
'javelin-behavior-dark-console' => '3c5efda9', 'javelin-behavior-dark-console' => '3c5efda9',
'javelin-behavior-dark-console-ajax' => '3c5efda9', 'javelin-behavior-dark-console-ajax' => '3c5efda9',
'javelin-behavior-device' => '5673560d', 'javelin-behavior-device' => '5bcc25b6',
'javelin-behavior-differential-accept-with-errors' => '7ecd31fa', 'javelin-behavior-differential-accept-with-errors' => '7ecd31fa',
'javelin-behavior-differential-add-reviewers-and-ccs' => '7ecd31fa', 'javelin-behavior-differential-add-reviewers-and-ccs' => '7ecd31fa',
'javelin-behavior-differential-comment-jump' => '7ecd31fa', 'javelin-behavior-differential-comment-jump' => '7ecd31fa',
@ -3479,27 +3480,27 @@ celerity_register_resource_map(array(
'javelin-behavior-diffusion-commit-graph' => '5e68be89', 'javelin-behavior-diffusion-commit-graph' => '5e68be89',
'javelin-behavior-diffusion-pull-lastmodified' => '5e68be89', 'javelin-behavior-diffusion-pull-lastmodified' => '5e68be89',
'javelin-behavior-error-log' => '3c5efda9', 'javelin-behavior-error-log' => '3c5efda9',
'javelin-behavior-konami' => '5673560d', 'javelin-behavior-konami' => '5bcc25b6',
'javelin-behavior-lightbox-attachments' => '5673560d', 'javelin-behavior-lightbox-attachments' => '5bcc25b6',
'javelin-behavior-maniphest-batch-selector' => '7707de41', 'javelin-behavior-maniphest-batch-selector' => '7707de41',
'javelin-behavior-maniphest-subpriority-editor' => '7707de41', 'javelin-behavior-maniphest-subpriority-editor' => '7707de41',
'javelin-behavior-maniphest-transaction-controls' => '7707de41', 'javelin-behavior-maniphest-transaction-controls' => '7707de41',
'javelin-behavior-maniphest-transaction-expand' => '7707de41', 'javelin-behavior-maniphest-transaction-expand' => '7707de41',
'javelin-behavior-maniphest-transaction-preview' => '7707de41', 'javelin-behavior-maniphest-transaction-preview' => '7707de41',
'javelin-behavior-phabricator-active-nav' => '5673560d', 'javelin-behavior-phabricator-active-nav' => '5bcc25b6',
'javelin-behavior-phabricator-autofocus' => '5673560d', 'javelin-behavior-phabricator-autofocus' => '5bcc25b6',
'javelin-behavior-phabricator-keyboard-shortcuts' => '5673560d', 'javelin-behavior-phabricator-keyboard-shortcuts' => '5bcc25b6',
'javelin-behavior-phabricator-nav' => '5673560d', 'javelin-behavior-phabricator-nav' => '5bcc25b6',
'javelin-behavior-phabricator-object-selector' => '7ecd31fa', 'javelin-behavior-phabricator-object-selector' => '7ecd31fa',
'javelin-behavior-phabricator-oncopy' => '5673560d', 'javelin-behavior-phabricator-oncopy' => '5bcc25b6',
'javelin-behavior-phabricator-remarkup-assist' => '5673560d', 'javelin-behavior-phabricator-remarkup-assist' => '5bcc25b6',
'javelin-behavior-phabricator-search-typeahead' => '5673560d', 'javelin-behavior-phabricator-search-typeahead' => '5bcc25b6',
'javelin-behavior-phabricator-tooltips' => '5673560d', 'javelin-behavior-phabricator-tooltips' => '5bcc25b6',
'javelin-behavior-phabricator-watch-anchor' => '5673560d', 'javelin-behavior-phabricator-watch-anchor' => '5bcc25b6',
'javelin-behavior-refresh-csrf' => '5673560d', 'javelin-behavior-refresh-csrf' => '5bcc25b6',
'javelin-behavior-repository-crossreference' => '7ecd31fa', 'javelin-behavior-repository-crossreference' => '7ecd31fa',
'javelin-behavior-toggle-class' => '5673560d', 'javelin-behavior-toggle-class' => '5bcc25b6',
'javelin-behavior-workflow' => '5673560d', 'javelin-behavior-workflow' => '5bcc25b6',
'javelin-dom' => 'db6d724d', 'javelin-dom' => 'db6d724d',
'javelin-event' => 'db6d724d', 'javelin-event' => 'db6d724d',
'javelin-install' => 'db6d724d', 'javelin-install' => 'db6d724d',
@ -3518,48 +3519,48 @@ celerity_register_resource_map(array(
'javelin-util' => 'db6d724d', 'javelin-util' => 'db6d724d',
'javelin-vector' => 'db6d724d', 'javelin-vector' => 'db6d724d',
'javelin-workflow' => 'db6d724d', 'javelin-workflow' => 'db6d724d',
'lightbox-attachment-css' => '668bdb91', 'lightbox-attachment-css' => '6e75f775',
'maniphest-task-summary-css' => '7839ae2d', 'maniphest-task-summary-css' => '7839ae2d',
'maniphest-transaction-detail-css' => '7839ae2d', 'maniphest-transaction-detail-css' => '7839ae2d',
'phabricator-app-buttons-css' => '668bdb91', 'phabricator-app-buttons-css' => '6e75f775',
'phabricator-busy' => '5673560d', 'phabricator-busy' => '5bcc25b6',
'phabricator-content-source-view-css' => 'c904bbee', 'phabricator-content-source-view-css' => 'c904bbee',
'phabricator-core-buttons-css' => '668bdb91', 'phabricator-core-buttons-css' => '6e75f775',
'phabricator-core-css' => '668bdb91', 'phabricator-core-css' => '6e75f775',
'phabricator-crumbs-view-css' => '668bdb91', 'phabricator-crumbs-view-css' => '6e75f775',
'phabricator-directory-css' => '668bdb91', 'phabricator-directory-css' => '6e75f775',
'phabricator-drag-and-drop-file-upload' => '7ecd31fa', 'phabricator-drag-and-drop-file-upload' => '7ecd31fa',
'phabricator-dropdown-menu' => '5673560d', 'phabricator-dropdown-menu' => '5bcc25b6',
'phabricator-file-upload' => '5673560d', 'phabricator-file-upload' => '5bcc25b6',
'phabricator-filetree-view-css' => '668bdb91', 'phabricator-filetree-view-css' => '6e75f775',
'phabricator-flag-css' => '668bdb91', 'phabricator-flag-css' => '6e75f775',
'phabricator-form-view-css' => '668bdb91', 'phabricator-form-view-css' => '6e75f775',
'phabricator-header-view-css' => '668bdb91', 'phabricator-header-view-css' => '6e75f775',
'phabricator-jump-nav' => '668bdb91', 'phabricator-jump-nav' => '6e75f775',
'phabricator-keyboard-shortcut' => '5673560d', 'phabricator-keyboard-shortcut' => '5bcc25b6',
'phabricator-keyboard-shortcut-manager' => '5673560d', 'phabricator-keyboard-shortcut-manager' => '5bcc25b6',
'phabricator-main-menu-view' => '668bdb91', 'phabricator-main-menu-view' => '6e75f775',
'phabricator-menu-item' => '5673560d', 'phabricator-menu-item' => '5bcc25b6',
'phabricator-nav-view-css' => '668bdb91', 'phabricator-nav-view-css' => '6e75f775',
'phabricator-notification' => '5673560d', 'phabricator-notification' => '5bcc25b6',
'phabricator-notification-css' => '668bdb91', 'phabricator-notification-css' => '6e75f775',
'phabricator-notification-menu-css' => '668bdb91', 'phabricator-notification-menu-css' => '6e75f775',
'phabricator-object-item-list-view-css' => '668bdb91', 'phabricator-object-item-list-view-css' => '6e75f775',
'phabricator-object-selector-css' => 'c904bbee', 'phabricator-object-selector-css' => 'c904bbee',
'phabricator-paste-file-upload' => '5673560d', 'phabricator-paste-file-upload' => '5bcc25b6',
'phabricator-prefab' => '5673560d', 'phabricator-prefab' => '5bcc25b6',
'phabricator-project-tag-css' => '7839ae2d', 'phabricator-project-tag-css' => '7839ae2d',
'phabricator-remarkup-css' => '668bdb91', 'phabricator-remarkup-css' => '6e75f775',
'phabricator-shaped-request' => '7ecd31fa', 'phabricator-shaped-request' => '7ecd31fa',
'phabricator-side-menu-view-css' => '668bdb91', 'phabricator-side-menu-view-css' => '6e75f775',
'phabricator-standard-page-view' => '668bdb91', 'phabricator-standard-page-view' => '6e75f775',
'phabricator-textareautils' => '5673560d', 'phabricator-textareautils' => '5bcc25b6',
'phabricator-tooltip' => '5673560d', 'phabricator-tooltip' => '5bcc25b6',
'phabricator-transaction-view-css' => '668bdb91', 'phabricator-transaction-view-css' => '6e75f775',
'sprite-apps-large-css' => '668bdb91', 'sprite-apps-large-css' => '6e75f775',
'sprite-gradient-css' => '668bdb91', 'sprite-gradient-css' => '6e75f775',
'sprite-icon-css' => '668bdb91', 'sprite-icon-css' => '6e75f775',
'sprite-menu-css' => '668bdb91', 'sprite-menu-css' => '6e75f775',
'syntax-highlighting-css' => '668bdb91', 'syntax-highlighting-css' => '6e75f775',
), ),
)); ));

3
src/applications/feed/story/PhabricatorFeedStoryDifferential.php
View file

@ -16,6 +16,9 @@ final class PhabricatorFeedStoryDifferential extends PhabricatorFeedStory {
$view->setTitle($line); $view->setTitle($line);
$view->setEpoch($data->getEpoch()); $view->setEpoch($data->getEpoch());
$href = $this->getHandle($data->getValue('revision_phid'))->getURI();
$view->setHref($href);
$action = $data->getValue('action'); $action = $data->getValue('action');
switch ($action) { switch ($action) {
case DifferentialAction::ACTION_CREATE: case DifferentialAction::ACTION_CREATE:

3
src/applications/feed/story/PhabricatorFeedStoryDifferentialAggregate.php
View file

@ -59,6 +59,9 @@ final class PhabricatorFeedStoryDifferentialAggregate
$view->setViewed($this->getHasViewed()); $view->setViewed($this->getHasViewed());
$view->setTitle($title); $view->setTitle($title);
$href = $this->getHandle($data->getValue('revision_phid'))->getURI();
$view->setHref($href);
return $view; return $view;
} }

3
src/applications/feed/story/PhabricatorFeedStoryManiphest.php
View file

@ -41,6 +41,9 @@ final class PhabricatorFeedStoryManiphest
$view->setOneLineStory(true); $view->setOneLineStory(true);
} }
$href = $this->getHandle($data->getValue('taskPHID'))->getURI();
$view->setHref($href);
return $view; return $view;
} }

3
src/applications/feed/story/PhabricatorFeedStoryManiphestAggregate.php
View file

@ -59,6 +59,9 @@ final class PhabricatorFeedStoryManiphestAggregate
$view->setViewed($this->getHasViewed()); $view->setViewed($this->getHasViewed());
$view->setTitle($title); $view->setTitle($title);
$href = $this->getHandle($data->getValue('taskPHID'))->getURI();
$view->setHref($href);
return $view; return $view;
} }

16
src/applications/feed/view/PhabricatorFeedStoryView.php
View file

@ -8,6 +8,7 @@ final class PhabricatorFeedStoryView extends PhabricatorFeedView {
private $epoch; private $epoch;
private $viewer; private $viewer;
private $viewed; private $viewed;
private $href;
private $oneLine; private $oneLine;
@ -45,6 +46,15 @@ final class PhabricatorFeedStoryView extends PhabricatorFeedView {
return $this->viewed; return $this->viewed;
} }
public function setHref($href) {
$this->href = $href;
return $this;
}
public function getHref() {
return $this->href;
}
public function renderNotification() { public function renderNotification() {
$classes = array( $classes = array(
'phabricator-notification', 'phabricator-notification',
@ -54,10 +64,14 @@ final class PhabricatorFeedStoryView extends PhabricatorFeedView {
$classes[] = 'phabricator-notification-unread'; $classes[] = 'phabricator-notification-unread';
} }
return phutil_render_tag( return javelin_render_tag(
'div', 'div',
array( array(
'class' => implode(' ', $classes), 'class' => implode(' ', $classes),
'sigil' => 'notification',
'meta' => array(
'href' => $this->getHref(),
),
), ),
$this->title); $this->title);
} }

8
src/applications/notification/controller/PhabricatorNotificationPanelController.php
View file

@ -26,8 +26,12 @@ final class PhabricatorNotificationPanelController
'</div>'; '</div>';
} }
$content .= $content =
'<div class="phabricator-notification view-all-notifications">'. '<div class="phabricator-notification-header">'.
pht('Notifications').
'</div>'.
$content.
'<div class="phabricator-notification-view-all">'.
phutil_render_tag( phutil_render_tag(
'a', 'a',
array( array(

BIN
src/rsrc/logo.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 19 KiB

BIN
src/rsrc/logo.psd
View file

Binary file not shown.

BIN
src/rsrc/logo_with_text.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 28 KiB

BIN
src/rsrc/logo_with_text.psd
View file

Binary file not shown.

30
webroot/rsrc/css/application/base/notification-menu.css
View file

@ -16,18 +16,26 @@
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.5); box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.5);
z-index: 9; z-index: 9;
border: 1px solid #33393d; border: 2px solid #33393d;
border-top-width: 0; border-top-width: 0;
border-radius: 3px;
} }
.device .phabricator-notification-menu { .device .phabricator-notification-menu {
border-bottom: 1px solid #222222; border-bottom: 1px solid #222222;
} }
.phabricator-notification { .phabricator-notification {
padding: 6px 6px; padding: 6px;
margin: 1px 0; cursor: pointer;
}
.device-desktop .phabricator-notification:hover {
background: #f4f6f9;
}
.phabricator-notification + .phabricator-notification {
border-top: 1px solid #e9e9e9;
} }
.no-notifications { .no-notifications {
@ -43,9 +51,17 @@
background: #aacfef; background: #aacfef;
} }
.view-all-notifications { .phabricator-notification-header {
font-weight: bold;
padding: 6px;
font-size: 12px;
border-bottom: 1px solid #e9e9e9;
}
.phabricator-notification-view-all {
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
background: #eeeeee; background: #f7f7f7;
border-top: 1px solid #dddddd; border-top: 1px solid #e9e9e9;
padding: 6px;
} }

21
webroot/rsrc/js/application/aphlict/behavior-aphlict-dropdown.js
View file

@ -5,6 +5,7 @@
* javelin-stratcom * javelin-stratcom
* javelin-vector * javelin-vector
* javelin-dom * javelin-dom
* javelin-uri
*/ */
JX.behavior('aphlict-dropdown', function(config) { JX.behavior('aphlict-dropdown', function(config) {
@ -39,13 +40,25 @@ JX.behavior('aphlict-dropdown', function(config) {
'click', 'click',
null, null,
function(e) { function(e) {
if(e.getNode('phabricator-notification-menu')) { if (!e.getNode('phabricator-notification-menu')) {
// Click is inside the dropdown. // Click outside the dropdown; hide it.
JX.DOM.hide(dropdown);
visible = false;
return; return;
} }
JX.DOM.hide(dropdown); if (e.getNode('tag:a')) {
visible = false; // 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();
}
}); });