Sfoglia il codice sorgente

HUE-6001 [assist] Slow down the entry indication on search result click

This also removes the highlighting of the parent entry.
Johan Ahlen 8 anni fa
parent
commit
318446b

File diff suppressed because it is too large
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


File diff suppressed because it is too large
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


+ 7 - 8
desktop/core/src/desktop/static/desktop/js/assist/assistDbEntry.js

@@ -227,17 +227,16 @@ var AssistDbEntry = (function () {
         }
         }
 
 
         window.setTimeout(function () {
         window.setTimeout(function () {
-          huePubSub.subscribeOnce('assist.db.scrollToComplete', function () {
-            foundEntry.highlight(true);
-            // Timeout is for animation effect
-            window.setTimeout(function () {
-              foundEntry.highlight(false);
-            }, 400);
-          });
-
           if (path.length > 1) {
           if (path.length > 1) {
             foundEntry.highlightInside(path.slice(1));
             foundEntry.highlightInside(path.slice(1));
           } else {
           } else {
+            huePubSub.subscribeOnce('assist.db.scrollToComplete', function () {
+              foundEntry.highlight(true);
+              // Timeout is for animation effect
+              window.setTimeout(function () {
+                foundEntry.highlight(false);
+              }, 1800);
+            });
             huePubSub.publish('assist.db.scrollTo', foundEntry);
             huePubSub.publish('assist.db.scrollTo', foundEntry);
           }
           }
         }, 0);
         }, 0);

+ 1 - 1
desktop/core/src/desktop/static/desktop/js/assist/assistDbSource.js

@@ -325,7 +325,7 @@ var AssistDbSource = (function () {
               // Timeout is for animation effect
               // Timeout is for animation effect
               window.setTimeout(function () {
               window.setTimeout(function () {
                 foundDb.highlight(false);
                 foundDb.highlight(false);
-              }, 400);
+              }, 1800);
             });
             });
             if (path.length > 1) {
             if (path.length > 1) {
               foundDb.highlightInside(path.slice(1), []);
               foundDb.highlightInside(path.slice(1), []);

+ 5 - 5
desktop/core/src/desktop/static/desktop/less/hue-assist.less

@@ -388,15 +388,15 @@
 }
 }
 
 
 .highlightable {
 .highlightable {
-  -webkit-transition: all .5s linear;
-  -moz-transition: all .5s linear;
-  -o-transition: all .5s linear;
-  transition: all .5s linear;
+  -webkit-transition: all .6s ease;
+  -moz-transition: all .6s ease;
+  -o-transition: all .6s ease;
+  transition: all .6s ease;
 }
 }
 
 
 .highlight {
 .highlight {
   color: @hue-primary-color-dark !important;
   color: @hue-primary-color-dark !important;
-  padding-left: 8px;
+  padding-left: 10px;
 }
 }
 
 
 .assist-details-header {
 .assist-details-header {

+ 1 - 1
desktop/core/src/desktop/templates/assist.mako

@@ -142,7 +142,7 @@ from notebook.conf import ENABLE_QUERY_BUILDER
       </div>
       </div>
       <a class="assist-entry assist-table-link" href="javascript:void(0)" data-bind="click: toggleOpen, attr: {'title': definition.title }, draggableText: { text: editorText,  meta: {'type': 'sql', 'table': tableName, 'database': databaseName} }">
       <a class="assist-entry assist-table-link" href="javascript:void(0)" data-bind="click: toggleOpen, attr: {'title': definition.title }, draggableText: { text: editorText,  meta: {'type': 'sql', 'table': tableName, 'database': databaseName} }">
         <i class="fa fa-fw fa-table muted valign-middle" data-bind="css: { 'fa-eye': definition.isView, 'fa-table': definition.isTable }"></i>
         <i class="fa fa-fw fa-table muted valign-middle" data-bind="css: { 'fa-eye': definition.isView, 'fa-table': definition.isTable }"></i>
-        <span data-bind="text: definition.displayName, css: { 'highlight': highlight }"></span> <!-- ko if: assistDbSource.activeSort() === 'popular' && popularity() > 0 --><i title="${ _('Popular') }" class="fa fa-star-o top-star"></i> <!-- /ko -->
+        <span class="highlightable" data-bind="text: definition.displayName, css: { 'highlight': highlight }"></span> <!-- ko if: assistDbSource.activeSort() === 'popular' && popularity() > 0 --><i title="${ _('Popular') }" class="fa fa-star-o top-star"></i> <!-- /ko -->
       </a>
       </a>
       <div class="center" data-bind="visible: loading"><i class="fa fa-spinner fa-spin assist-spinner"></i></div>
       <div class="center" data-bind="visible: loading"><i class="fa fa-spinner fa-spin assist-spinner"></i></div>
       <!-- ko template: { if: open, name: 'assist-db-entries'  } --><!-- /ko -->
       <!-- ko template: { if: open, name: 'assist-db-entries'  } --><!-- /ko -->

Some files were not shown because too many files changed in this diff