Updating bump logic to support single-direction scrollbars (#4652)

* Updating bump logic to support single-direction scrollbars

core/events/events.js

@@ -199,12 +199,23 @@ Blockly.Events.COMMENT_MOVE = 'comment_move';
  */
 Blockly.Events.FINISHED_LOADING = 'finished_loading';
 
+/**
+ * Type of events that cause objects to be bumped back into the visible
+ * portion of the workspace.
+ *
+ * Not to be confused with bumping so that disconnected connections do not
+ * appear connected.
+ * @typedef {!Blockly.Events.BlockCreate|!Blockly.Events.BlockMove|
+ * !Blockly.Events.CommentCreate|!Blockly.Events.CommentMove}
+ */
+Blockly.Events.BumpEvent;
+
 /**
  * List of events that cause objects to be bumped back into the visible
- * portion of the workspace (only used for non-movable workspaces).
+ * portion of the workspace.
  *
- * Not to be confused with bumping so that disconnected connections to do
- * not appear connected.
+ * Not to be confused with bumping so that disconnected connections do not
+ * appear connected.
  * @const
  */
 Blockly.Events.BUMP_EVENTS = [

core/flyout_horizontal.js

@@ -48,11 +48,15 @@ Blockly.utils.object.inherits(Blockly.HorizontalFlyout, Blockly.Flyout);
  * .viewWidth: Width of the visible rectangle,
  * .contentHeight: Height of the contents,
  * .contentWidth: Width of the contents,
+ * .scrollHeight: Height of the scroll area,
+ * .scrollWidth: Width of the scroll area,
  * .viewTop: Offset of top edge of visible rectangle from parent,
  * .contentTop: Offset of the top-most content from the y=0 coordinate,
+ * .scrollTop: Offset of the scroll area top from the y=0 coordinate,
  * .absoluteTop: Top-edge of view.
  * .viewLeft: Offset of the left edge of visible rectangle from parent,
  * .contentLeft: Offset of the left-most content from the x=0 coordinate,
+ * .scrollLeft:  Offset of the scroll area left from the x=0 coordinate,
  * .absoluteLeft: Left-edge of view.
  * @return {Blockly.utils.Metrics} Contains size and position metrics of the
  *     flyout.
@@ -83,11 +87,16 @@ Blockly.HorizontalFlyout.prototype.getMetrics_ = function() {
   var viewWidth = this.width_ - 2 * this.SCROLLBAR_PADDING;
 
   var metrics = {
-    contentHeight: (optionBox.height + 2 * this.MARGIN) * this.workspace_.scale,
-    contentWidth: (optionBox.width + 2 * this.MARGIN) * this.workspace_.scale,
+    contentHeight: optionBox.height * this.workspace_.scale,
+    contentWidth: optionBox.width * this.workspace_.scale,
     contentTop: 0,
     contentLeft: 0,
 
+    scrollHeight: (optionBox.height + 2 * this.MARGIN) * this.workspace_.scale,
+    scrollWidth: (optionBox.width + 2 * this.MARGIN) * this.workspace_.scale,
+    scrollTop: 0,
+    scrollLeft: 0,
+
     viewHeight: viewHeight,
     viewWidth: viewWidth,
     viewTop: -this.workspace_.scrollY,
@@ -115,8 +124,8 @@ Blockly.HorizontalFlyout.prototype.setMetrics_ = function(xyRatio) {
 
   if (typeof xyRatio.x == 'number') {
     this.workspace_.scrollX =
-        -(metrics.contentLeft +
-            (metrics.contentWidth - metrics.viewWidth) * xyRatio.x);
+        -(metrics.scrollLeft +
+            (metrics.scrollWidth - metrics.viewWidth) * xyRatio.x);
   }
 
   this.workspace_.translate(this.workspace_.scrollX + metrics.absoluteLeft,
@@ -267,7 +276,7 @@ Blockly.HorizontalFlyout.prototype.wheel_ = function(e) {
   if (delta) {
     var metrics = this.getMetrics_();
     var pos = metrics.viewLeft + delta;
-    var limit = metrics.contentWidth - metrics.viewWidth;
+    var limit = metrics.scrollWidth - metrics.viewWidth;
     pos = Math.min(pos, limit);
     pos = Math.max(pos, 0);
     this.workspace_.scrollbar.setX(pos);

core/flyout_vertical.js

@@ -55,9 +55,11 @@ Blockly.VerticalFlyout.registryName = 'verticalFlyout';
  * .contentWidth: Width of the contents,
  * .viewTop: Offset of top edge of visible rectangle from parent,
  * .contentTop: Offset of the top-most content from the y=0 coordinate,
+ * .scrollTop: Offset of the scroll area top from the y=0 coordinate,
  * .absoluteTop: Top-edge of view.
  * .viewLeft: Offset of the left edge of visible rectangle from parent,
  * .contentLeft: Offset of the left-most content from the x=0 coordinate,
+ * .scrollLeft:  Offset of the scroll area left from the x=0 coordinate,
  * .absoluteLeft: Left-edge of view.
  * @return {Blockly.utils.Metrics} Contains size and position metrics of the
  *     flyout.
@@ -87,10 +89,15 @@ Blockly.VerticalFlyout.prototype.getMetrics_ = function() {
   }
 
   var metrics = {
-    contentHeight: optionBox.height * this.workspace_.scale + 2 * this.MARGIN,
-    contentWidth: optionBox.width * this.workspace_.scale + 2 * this.MARGIN,
-    contentTop: optionBox.y - this.MARGIN,
-    contentLeft: optionBox.x - this.MARGIN,
+    contentHeight: optionBox.height * this.workspace_.scale,
+    contentWidth: optionBox.width * this.workspace_.scale,
+    contentTop: optionBox.y,
+    contentLeft: optionBox.x,
+
+    scrollHeight: (optionBox.height + 2 * this.MARGIN) * this.workspace_.scale,
+    scrollWidth: (optionBox.width + 2 * this.MARGIN) * this.workspace_.scale,
+    scrollTop: optionBox.y - this.MARGIN,
+    scrollLeft: optionBox.x - this.MARGIN,
 
     viewHeight: viewHeight,
     viewWidth: viewWidth,
@@ -118,8 +125,8 @@ Blockly.VerticalFlyout.prototype.setMetrics_ = function(xyRatio) {
   }
   if (typeof xyRatio.y == 'number') {
     this.workspace_.scrollY =
-        -(metrics.contentTop +
-            (metrics.contentHeight - metrics.viewHeight) * xyRatio.y);
+        -(metrics.scrollTop +
+            (metrics.scrollHeight - metrics.viewHeight) * xyRatio.y);
   }
   this.workspace_.translate(this.workspace_.scrollX + metrics.absoluteLeft,
       this.workspace_.scrollY + metrics.absoluteTop);
@@ -258,8 +265,8 @@ Blockly.VerticalFlyout.prototype.wheel_ = function(e) {
 
   if (scrollDelta.y) {
     var metrics = this.getMetrics_();
-    var pos = (metrics.viewTop - metrics.contentTop) + scrollDelta.y;
-    var limit = metrics.contentHeight - metrics.viewHeight;
+    var pos = (metrics.viewTop - metrics.scrollTop) + scrollDelta.y;
+    var limit = metrics.scrollHeight - metrics.viewHeight;
     pos = Math.min(pos, limit);
     pos = Math.max(pos, 0);
     this.workspace_.scrollbar.setY(pos);