Changeset 146866 in webkit

Timestamp:

Mar 26, 2013 4:23:26 AM (11 years ago)

Author:

loislo@chromium.org

Message:

Web Inspector: OverviewGrid. Dragged window may change its width due to accumulating rounding error.
​https://bugs.webkit.org/show_bug.cgi?id=113138

Reviewed by Pavel Feldman.

The old version had problem with rounding because it recalculates the window size on each event.
The new version just calculates the dragging delta and moves the window
to the new position based on the initial values and the delta.

• inspector/front-end/OverviewGrid.js:

(WebInspector.OverviewGrid.Window.prototype._startWindowDragging):
(WebInspector.OverviewGrid.Window.prototype._windowDragging):
(WebInspector.OverviewGrid.Window.prototype._onMouseWheel):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/front-end/OverviewGrid.js (modified) (4 diffs)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2013-03-26  Ilya Tikhonovsky  <loislo@chromium.org>
+
+        Web Inspector: OverviewGrid. Dragged window may change its width due to accumulating rounding error.
+        https://bugs.webkit.org/show_bug.cgi?id=113138
+
+        Reviewed by Pavel Feldman.
+
+        The old version had problem with rounding because it recalculates the window size on each event.
+        The new version just calculates the dragging delta and moves the window
+        to the new position based on the initial values and the delta.
+
+        * inspector/front-end/OverviewGrid.js:
+        (WebInspector.OverviewGrid.Window.prototype._startWindowDragging):
+        (WebInspector.OverviewGrid.Window.prototype._windowDragging):
+        (WebInspector.OverviewGrid.Window.prototype._onMouseWheel):
+
 2013-03-26  Kent Tamura  <tkent@chromium.org>
 

trunk/Source/WebCore/inspector/front-end/OverviewGrid.js

@@ -306 +306 @@
     _startWindowDragging: function(event)
     {
-        var windowLeft = this._leftResizeElement.offsetLeft + WebInspector.OverviewGrid.ResizerOffset;
-        this._dragOffset = windowLeft - event.pageX;
+        this._dragStartPoint = event.pageX;
+        this._dragStartLeft = this.windowLeft;
+        this._dragStartRight = this.windowRight;
         return true;
     },
@@ -316 +317 @@
     _windowDragging: function(event)
     {
-        var windowLeft = this._leftResizeElement.offsetLeft + WebInspector.OverviewGrid.ResizerOffset;
-        var start = this._dragOffset + event.pageX;
-        this._moveWindow(start);
         event.preventDefault();
+        var delta = (event.pageX - this._dragStartPoint) / this._parentElement.clientWidth;
+        if (this._dragStartLeft + delta < 0)
+            delta = -this._dragStartLeft;
+
+        if (this._dragStartRight + delta > 1)
+            delta = 1 - this._dragStartRight;
+
+        this._setWindow(this._dragStartLeft + delta, this._dragStartRight + delta);
     },
 
@@ -328 +334 @@
     {
         delete this._dragOffset;
-    },
-
-    /**
-     * @param {number} start
-     */
-    _moveWindow: function(start)
-    {
-        var windowLeft = this._leftResizeElement.offsetLeft + WebInspector.OverviewGrid.ResizerOffset;
-        var windowRight = this._rightResizeElement.offsetLeft + WebInspector.OverviewGrid.ResizerOffset;
-        var windowSize = windowRight - windowLeft;
-        var end = start + windowSize;
-
-        if (start < 0) {
-            start = 0;
-            end = windowSize;
-        }
-
-        if (end > this._parentElement.clientWidth) {
-            end = this._parentElement.clientWidth;
-            start = end - windowSize;
-        }
-        this._setWindowPosition(start, end);
     },
 
@@ -429 +413 @@
         }
         if (typeof event.wheelDeltaX === "number" && event.wheelDeltaX) {
+            var offset = Math.round(event.wheelDeltaX * WebInspector.OverviewGrid.WindowScrollSpeedFactor);
             var windowLeft = this._leftResizeElement.offsetLeft + WebInspector.OverviewGrid.ResizerOffset;
-            var start = windowLeft - Math.round(event.wheelDeltaX * WebInspector.OverviewGrid.WindowScrollSpeedFactor);
-            this._moveWindow(start);
+            var windowRight = this._rightResizeElement.offsetLeft + WebInspector.OverviewGrid.ResizerOffset;
+
+            if (windowLeft - offset < 0)
+                offset = windowLeft;
+
+            if (windowRight - offset > this._parentElement.clientWidth)
+                offset = windowRight - this._parentElement.clientWidth;
+
+            this._setWindowPosition(windowLeft - offset, windowRight - offset);
+
             event.preventDefault();
         }