[perf-web] Fix grab-scrolling on Chrome



commit a201a50d7da6a7ee775a199523d93418d751fa22
Author: Owen W. Taylor <otaylor fishsoup net>
Date:   Sun Sep 14 17:31:21 2014 -0400

    Fix grab-scrolling on Chrome
    
    * Don't use MouseEvent.buttons
    * We reliably get mouse-up when the mouse is outside the window if
      we addEventListener on window rather than document.body, so simply
      handle mouse-up outside the window that way.
    * Add -webkit-grabbing to the grab-cursor CSS

 static/main.js  |   20 ++++++++++----------
 static/perf.css |    1 +
 2 files changed, 11 insertions(+), 10 deletions(-)
---
diff --git a/static/main.js b/static/main.js
index 4fe2618..f77f64d 100644
--- a/static/main.js
+++ b/static/main.js
@@ -628,7 +628,7 @@ function ScrollHandler(params)
         this.scrollFunctionY = params.scrollFunctionY;
 
     params.source.addEventListener("mousedown", function(event) {
-        if (event.buttons == 1) {
+        if (event.button == 0) {
             var node = event.target;
             while (node) {
                 if (node.tagName == "a")
@@ -641,23 +641,17 @@ function ScrollHandler(params)
             event.stopPropagation();
         }
     }.bind(this));
-    document.body.addEventListener("mousemove", function(event) {
+    window.addEventListener("mousemove", function(event) {
         if (this.dragStartX != null) {
-            if ((event.buttons & 1) == 0) {
-                this.dragStartX = null;
-                return;
-            }
             this.updateDrag(event.clientX, event.clientY);
             event.preventDefault();
             event.stopPropagation();
         }
     }.bind(this), true);
-    document.body.addEventListener("mouseup", function(event) {
+    window.addEventListener("mouseup", function(event) {
         if (this.dragStartX != null) {
             this.updateDrag(event.clientX, event.clientY);
-            $( document.body ).removeClass('panning');
-            this.dragStartX = null;
-            this.dragLocked = null;
+            this.endDrag();
             event.preventDefault();
             event.stopPropagation();
         }
@@ -708,6 +702,12 @@ ScrollHandler.prototype.updateDrag = function(x, y) {
         this.target.scrollTop = this.dragStartScrollTop - deltaY;
 }
 
+ScrollHandler.prototype.endDrag = function() {
+    $( document.body ).removeClass('panning');
+    this.dragStartX = null;
+    this.dragLocked = null;
+}
+
 ////////////////////////////////////////////////////////////////////////
 
 function Table(element) {
diff --git a/static/perf.css b/static/perf.css
index 3e7690b..58e13c5 100644
--- a/static/perf.css
+++ b/static/perf.css
@@ -8,6 +8,7 @@ body {
 }
 
 .panning {
+    cursor: -webkit-grabbing;
     cursor: grabbing;
 }
 


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]