From f29b54944f9cfbc20d9e3c0e05ef9141599d34c3 Mon Sep 17 00:00:00 2001 From: Austin McKinley Date: Thu, 25 May 2017 13:41:21 -0700 Subject: [PATCH] Make closed objects in global typeahead look closed Summary: Fixes T6906. I found the code in `behavior-search-typeahead.js` that was throwing away the closedness-detction work done in `Prejab.js::transformDatasourceResults`. Modified it to re-add the correct class name to the `phabricator-main-search-typeahead-result` elements. Then I found some CSS in `typeahead-browse.css` and completely flailed around until realizing that particular CSS only gets loaded when hitting the typeahead endpoint directly. Copied the relevant bit of CSS over to `main-menu-view.css` (but maybe it should be removed from `typeahead-browse.css`?). This is my first JS/CSS change, so please don't assume I did anything right. Test Plan: {F4975800} Reviewers: #blessed_reviewers, chad Reviewed By: #blessed_reviewers, chad Subscribers: epriestley Maniphest Tasks: T6906 Differential Revision: https://secure.phabricator.com/D18017 --- resources/celerity/map.php | 44 +++++++++---------- webroot/rsrc/css/aphront/typeahead-browse.css | 16 ------- .../css/application/base/main-menu-view.css | 16 +++++++ .../rsrc/js/core/behavior-search-typeahead.js | 4 ++ 4 files changed, 42 insertions(+), 38 deletions(-) diff --git a/resources/celerity/map.php b/resources/celerity/map.php index a71d9f524e..bcfae6b7e6 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -9,8 +9,8 @@ return array( 'names' => array( 'conpherence.pkg.css' => 'ff161f2d', 'conpherence.pkg.js' => 'b5b51108', - 'core.pkg.css' => '71865bdf', - 'core.pkg.js' => '599698a7', + 'core.pkg.css' => 'd556e3e2', + 'core.pkg.js' => '21d34805', 'darkconsole.pkg.js' => '1f9a31bc', 'differential.pkg.css' => '7d4cfa59', 'differential.pkg.js' => '1d120743', @@ -35,11 +35,11 @@ return array( 'rsrc/css/aphront/table-view.css' => '34cf86b4', 'rsrc/css/aphront/tokenizer.css' => '9a8cb501', 'rsrc/css/aphront/tooltip.css' => '173b9431', - 'rsrc/css/aphront/typeahead-browse.css' => '8904346a', + 'rsrc/css/aphront/typeahead-browse.css' => '4f82e510', 'rsrc/css/aphront/typeahead.css' => '8a84cc7d', 'rsrc/css/application/almanac/almanac.css' => 'dbb9b3af', 'rsrc/css/application/auth/auth.css' => '0877ed6e', - 'rsrc/css/application/base/main-menu-view.css' => '5294060f', + 'rsrc/css/application/base/main-menu-view.css' => 'de9fe8c4', 'rsrc/css/application/base/notification-menu.css' => '6a697e43', 'rsrc/css/application/base/phui-theme.css' => '9f261c6b', 'rsrc/css/application/base/standard-page-view.css' => 'eb5b80c5', @@ -514,7 +514,7 @@ return array( 'rsrc/js/core/behavior-reorder-applications.js' => '76b9fc3e', 'rsrc/js/core/behavior-reveal-content.js' => '60821bc7', 'rsrc/js/core/behavior-scrollbar.js' => '834a1173', - 'rsrc/js/core/behavior-search-typeahead.js' => 'eded9ee8', + 'rsrc/js/core/behavior-search-typeahead.js' => 'd0a99ab4', 'rsrc/js/core/behavior-select-content.js' => 'bf5374ef', 'rsrc/js/core/behavior-select-on-click.js' => '4e3e79a6', 'rsrc/js/core/behavior-setup-check-https.js' => '491416b3', @@ -668,7 +668,7 @@ return array( 'javelin-behavior-phabricator-oncopy' => '2926fff2', 'javelin-behavior-phabricator-remarkup-assist' => 'acd29eee', 'javelin-behavior-phabricator-reveal-content' => '60821bc7', - 'javelin-behavior-phabricator-search-typeahead' => 'eded9ee8', + 'javelin-behavior-phabricator-search-typeahead' => 'd0a99ab4', 'javelin-behavior-phabricator-show-older-transactions' => 'ae95d984', 'javelin-behavior-phabricator-tooltips' => 'c420b0b9', 'javelin-behavior-phabricator-transaction-comment-form' => 'b23b49e6', @@ -792,7 +792,7 @@ return array( 'phabricator-flag-css' => 'bba8f811', 'phabricator-keyboard-shortcut' => '1ae869f2', 'phabricator-keyboard-shortcut-manager' => 'c19dd9b9', - 'phabricator-main-menu-view' => '5294060f', + 'phabricator-main-menu-view' => 'de9fe8c4', 'phabricator-nav-view-css' => 'faf6a6fc', 'phabricator-notification' => 'ccf1cbf8', 'phabricator-notification-css' => '3f6c89c9', @@ -914,7 +914,7 @@ return array( 'syntax-default-css' => '9923583c', 'syntax-highlighting-css' => 'cae95e89', 'tokens-css' => '3d0f239e', - 'typeahead-browse-css' => '8904346a', + 'typeahead-browse-css' => '4f82e510', 'unhandled-exception-css' => '4c96257a', ), 'requires' => array( @@ -1307,9 +1307,6 @@ return array( 'javelin-vector', 'javelin-typeahead-static-source', ), - '5294060f' => array( - 'phui-theme-css', - ), '54b612ba' => array( 'javelin-color', 'javelin-install', @@ -2016,6 +2013,17 @@ return array( 'javelin-vector', 'phabricator-diff-inline', ), + 'd0a99ab4' => array( + 'javelin-behavior', + 'javelin-typeahead-ondemand-source', + 'javelin-typeahead', + 'javelin-dom', + 'javelin-uri', + 'javelin-util', + 'javelin-stratcom', + 'phabricator-prefab', + 'phuix-icon-view', + ), 'd0c516d5' => array( 'javelin-behavior', 'javelin-dom', @@ -2088,6 +2096,9 @@ return array( 'javelin-typeahead-ondemand-source', 'javelin-dom', ), + 'de9fe8c4' => array( + 'phui-theme-css', + ), 'e0ec7f2f' => array( 'javelin-behavior', 'javelin-dom', @@ -2157,17 +2168,6 @@ return array( 'javelin-dom', 'phabricator-draggable-list', ), - 'eded9ee8' => array( - 'javelin-behavior', - 'javelin-typeahead-ondemand-source', - 'javelin-typeahead', - 'javelin-dom', - 'javelin-uri', - 'javelin-util', - 'javelin-stratcom', - 'phabricator-prefab', - 'phuix-icon-view', - ), 'edf8a145' => array( 'javelin-behavior', 'javelin-uri', diff --git a/webroot/rsrc/css/aphront/typeahead-browse.css b/webroot/rsrc/css/aphront/typeahead-browse.css index 625354bb71..7439d299e7 100644 --- a/webroot/rsrc/css/aphront/typeahead-browse.css +++ b/webroot/rsrc/css/aphront/typeahead-browse.css @@ -64,19 +64,3 @@ input.typeahead-browse-input { margin-top: 1px; margin-left: 6px; } - -.typeahead-browse-item .phabricator-main-search-typeahead-result { - margin: 2px 0; - padding: 0 8px; -} - -.typeahead-browse-item .phabricator-main-search-typeahead-result.has-image { - padding-left: 48px; -} - -.typeahead-browse-item - .phabricator-main-search-typeahead-result.result-closed - .result-name { - text-decoration: line-through; - color: {$lightgreytext}; -} diff --git a/webroot/rsrc/css/application/base/main-menu-view.css b/webroot/rsrc/css/application/base/main-menu-view.css index 28148ae71a..eb5cfad8c7 100644 --- a/webroot/rsrc/css/application/base/main-menu-view.css +++ b/webroot/rsrc/css/application/base/main-menu-view.css @@ -309,6 +309,22 @@ a.phabricator-core-user-menu .caret:before { color: {$darkgreytext}; } +.phabricator-main-search-typeahead-result.result-closed { + opacity: .8; + -webkit-filter: grayscale(100%); + filter: grayscale(100%); +} + +.phabricator-main-search-typeahead-result.result-closed + .result-name { + text-decoration: line-through; + color: {$lightgreytext}; +} + +.phabricator-main-search-typeahead-result.has-image { + padding-left: 48px; +} + .phabricator-main-search-typeahead-result .result-type { color: {$lightgreytext}; font-size: {$smallestfontsize}; diff --git a/webroot/rsrc/js/core/behavior-search-typeahead.js b/webroot/rsrc/js/core/behavior-search-typeahead.js index fc752a6079..ddcc2e6aaa 100644 --- a/webroot/rsrc/js/core/behavior-search-typeahead.js +++ b/webroot/rsrc/js/core/behavior-search-typeahead.js @@ -45,6 +45,10 @@ JX.behavior('phabricator-search-typeahead', function(config) { JX.$N('span', {className: 'result-type'}, object.type) ]); + if (object.closed) { + JX.DOM.alterClass(render, 'result-closed', true); + } + object.display = render; return object;