Просмотр исходного кода

HUE-5331 [editor] Fix mousewheel scroll flakiness on the result grid

Enrico Berti 9 лет назад
Родитель
Сommit
2e7cab8

+ 13 - 10
desktop/core/src/desktop/static/desktop/js/jquery.horizontalscrollbar.js

@@ -56,19 +56,22 @@
           }
         });
         $(el).parents('.dataTables_wrapper').bind('mousewheel', function (e) {
-          var _deltaX = -e.deltaX*e.deltaFactor,
-              _deltaY = -e.deltaY;
+          var _deltaX = e.deltaX*e.deltaFactor,
+              _deltaY = e.deltaY;
 
-          if (Math.abs(_deltaX) > Math.abs(_deltaY)) {
-            this.scrollLeft += -_deltaX / 2;
+          if (Math.abs(_deltaX) >= Math.abs(_deltaY)) {
+            var self = this;
+            self.scrollLeft += _deltaX;
+            e.preventDefault();
             e.stopPropagation();
             e.stopImmediatePropagation();
-            scrollbar.css("left", ((scrollbarRail.width() - scrollbar.width()) * ($(el).parents('.dataTables_wrapper').scrollLeft() / ($(el).parents('.dataTables_wrapper')[0].scrollWidth - $(el).parents('.dataTables_wrapper').width()))) + "px");
-            window.clearTimeout(throttleScrollTimeout);
-            throttleScrollTimeout = window.setTimeout(function () {
-              $(el).parents('.dataTables_wrapper').trigger('scroll');
-            }, 50);
-            e.preventDefault();
+            if (self.scrollLeft > 0){
+              scrollbar.css("left", ((scrollbarRail[0].getBoundingClientRect().width - scrollbar[0].getBoundingClientRect().width) * (self.scrollLeft / (self.scrollWidth - self.getBoundingClientRect().width))) + "px");
+              window.clearTimeout(throttleScrollTimeout);
+              throttleScrollTimeout = window.setTimeout(function () {
+                $(el).parents('.dataTables_wrapper').trigger('scroll');
+              }, 50);
+            }
           }
         });
         scrollbarRail.addClass('hue-scrollbar-x-rail').appendTo($(el).parents(".dataTables_wrapper"));

+ 1 - 1
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -1023,7 +1023,7 @@ ${ hueIcons.symbols() }
   </div>
   <div class="resizer" data-bind="visible: isLeftPanelVisible() && assistAvailable(), splitDraggable : { appName: 'notebook', leftPanelVisible: isLeftPanelVisible, onPosition: function(){ huePubSub.publish('split.draggable.position') } }"><div class="resize-bar">&nbsp;</div></div>
   % endif
-  <div class="content-panel" data-bind="event: { scroll: function(){ var ls = $(MAIN_SCROLLABLE).data('lastScroll'); if (ls && ls != $(MAIN_SCROLLABLE).scrollTop()){ $(document).trigger('hideAutocomplete'); }; $(MAIN_SCROLLABLE).data('lastScroll', $(MAIN_SCROLLABLE).scrollTop()) } }, niceScroll, with: selectedNotebook">
+  <div class="content-panel" data-bind="event: { scroll: function(){ var ls = $(MAIN_SCROLLABLE).data('lastScroll'); if (ls && ls != $(MAIN_SCROLLABLE).scrollTop()){ $(document).trigger('hideAutocomplete'); }; $(MAIN_SCROLLABLE).data('lastScroll', $(MAIN_SCROLLABLE).scrollTop()) } }, with: selectedNotebook">
     <div>
       <div class="row-fluid row-container sortable-snippets" data-bind="css: {'is-editing': $root.isEditing},
         sortable: {