Make alert icons stay white while menus are open

Summary: I think this is what you're after?

Test Plan: clicky clicky

Reviewers: chad

Reviewed By: chad

Subscribers: epriestley

Differential Revision: https://secure.phabricator.com/D10966

resources/celerity/map.php

@@ -8,7 +8,7 @@
 return array(
   'names' => array(
     'core.pkg.css' => 'a157f664',
-    'core.pkg.js' => '7c53868c',
+    'core.pkg.js' => 'e4556c9b',
     'darkconsole.pkg.js' => 'df001cab',
     'differential.pkg.css' => '8af45893',
     'differential.pkg.js' => '42c10e78',
@@ -348,7 +348,7 @@ return array(
     'rsrc/image/texture/table_header_hover.png' => '038ec3b9',
     'rsrc/image/texture/table_header_tall.png' => 'd56b434f',
     'rsrc/js/application/aphlict/Aphlict.js' => '4a07e8e3',
-    'rsrc/js/application/aphlict/behavior-aphlict-dropdown.js' => '7d4cc76c',
+    'rsrc/js/application/aphlict/behavior-aphlict-dropdown.js' => '72118e8b',
     'rsrc/js/application/aphlict/behavior-aphlict-listen.js' => 'a826c925',
     'rsrc/js/application/aphlict/behavior-aphlict-status.js' => '58f7803f',
     'rsrc/js/application/auth/behavior-persona-login.js' => '9414ff18',
@@ -542,7 +542,7 @@ return array(
     'inline-comment-summary-css' => '8cfd34e8',
     'javelin-aphlict' => '4a07e8e3',
     'javelin-behavior' => '61cbc29a',
-    'javelin-behavior-aphlict-dropdown' => '7d4cc76c',
+    'javelin-behavior-aphlict-dropdown' => '72118e8b',
     'javelin-behavior-aphlict-listen' => 'a826c925',
     'javelin-behavior-aphlict-status' => '58f7803f',
     'javelin-behavior-aphront-basic-tokenizer' => 'b3a4b884',
@@ -1278,6 +1278,16 @@ return array(
       'phabricator-phtize',
       'changeset-view-manager',
     ),
+    '72118e8b' => array(
+      'javelin-behavior',
+      'javelin-request',
+      'javelin-stratcom',
+      'javelin-vector',
+      'javelin-dom',
+      'javelin-uri',
+      'javelin-behavior-device',
+      'phabricator-title',
+    ),
     '724b1247' => array(
       'javelin-behavior',
       'javelin-typeahead-ondemand-source',
@@ -1343,16 +1353,6 @@ return array(
       'javelin-request',
       'javelin-router',
     ),
-    '7d4cc76c' => array(
-      'javelin-behavior',
-      'javelin-request',
-      'javelin-stratcom',
-      'javelin-vector',
-      'javelin-dom',
-      'javelin-uri',
-      'javelin-behavior-device',
-      'phabricator-title',
-    ),
     '7e41274a' => array(
       'javelin-install',
     ),

src/view/page/menu/PhabricatorMainMenuView.php

@@ -316,11 +316,12 @@ final class PhabricatorMainMenuView extends AphrontView {
         ),
         $message_count_number);
 
-      $message_icon_tag = phutil_tag(
+      $message_icon_tag = javelin_tag(
         'span',
         array(
           'class' => 'phabricator-main-menu-message-icon phui-icon-view '.
                      'phui-font-fa fa-comments',
+          'sigil' => 'menu-icon',
         ),
         '');
 
@@ -401,11 +402,12 @@ final class PhabricatorMainMenuView extends AphrontView {
         ),
         $count_number);
 
-      $icon_tag = phutil_tag(
+      $icon_tag = javelin_tag(
         'span',
         array(
           'class' => 'phabricator-main-menu-alert-icon phui-icon-view '.
                      'phui-font-fa fa-bell',
+          'sigil' => 'menu-icon',
         ),
         '');
 

webroot/rsrc/js/application/aphlict/behavior-aphlict-dropdown.js

@@ -16,6 +16,7 @@ JX.behavior('aphlict-dropdown', function(config, statics) {
 
   var dropdown = JX.$(config.dropdownID);
   var bubble = JX.$(config.bubbleID);
+  var icon = JX.DOM.scry(bubble, 'span', 'menu-icon')[0];
 
   var count;
   if (config.countID) {
@@ -69,6 +70,9 @@ JX.behavior('aphlict-dropdown', function(config, statics) {
       if (!e.getNode('phabricator-notification-menu')) {
         // Click outside the dropdown; hide it.
         JX.DOM.hide(dropdown);
+        if (icon) {
+          JX.DOM.alterClass(icon, 'white', false);
+        }
         statics.visible = null;
         return;
       }
@@ -140,6 +144,10 @@ JX.behavior('aphlict-dropdown', function(config, statics) {
       p.setPos(dropdown);
 
       statics.visible = dropdown;
+
+      if (icon) {
+        JX.DOM.alterClass(icon, 'white', true);
+      }
     }
   );