Merge pull request #1687 from samelhusseini/develop_pointerfixes

Pointer Event fixes

core/blockly.js

@@ -452,26 +452,30 @@ Blockly.bindEventWithChecks_ = function(node, name, thisObject, func,
   };
 
   var bindData = [];
-  // Don't register the mouse event if an equivalent pointer event is supported.
-  if ((window && !window.PointerEvent) || !(name in Blockly.Touch.TOUCH_MAP)) {
+  if (window && window.PointerEvent && (name in Blockly.Touch.TOUCH_MAP)) {
+    for (var i = 0, type; type = Blockly.Touch.TOUCH_MAP[name][i]; i++) {
+      node.addEventListener(type, wrapFunc, false);
+      bindData.push([node, type, wrapFunc]);
+    }
+  } else {
     node.addEventListener(name, wrapFunc, false);
     bindData.push([node, name, wrapFunc]);
-  }
 
-  // Add equivalent touch or pointer event.
-  if (name in Blockly.Touch.TOUCH_MAP) {
-    var touchWrapFunc = function(e) {
-      wrapFunc(e);
-      // Calling preventDefault stops the browser from scrolling/zooming the
-      // page.
-      var preventDef = !opt_noPreventDefault;
-      if (handled && preventDef) {
-        e.preventDefault();
+    // Add equivalent touch event.
+    if (name in Blockly.Touch.TOUCH_MAP) {
+      var touchWrapFunc = function(e) {
+        wrapFunc(e);
+        // Calling preventDefault stops the browser from scrolling/zooming the
+        // page.
+        var preventDef = !opt_noPreventDefault;
+        if (handled && preventDef) {
+          e.preventDefault();
+        }
+      };
+      for (var i = 0, type; type = Blockly.Touch.TOUCH_MAP[name][i]; i++) {
+        node.addEventListener(type, touchWrapFunc, false);
+        bindData.push([node, type, touchWrapFunc]);
       }
-    };
-    for (var i = 0, type; type = Blockly.Touch.TOUCH_MAP[name][i]; i++) {
-      node.addEventListener(type, touchWrapFunc, false);
-      bindData.push([node, type, touchWrapFunc]);
     }
   }
   return bindData;
@@ -501,29 +505,34 @@ Blockly.bindEvent_ = function(node, name, thisObject, func) {
   };
 
   var bindData = [];
-  // Don't register the mouse event if an equivalent pointer event is supported.
-  if ((window && !window.PointerEvent) || !(name in Blockly.Touch.TOUCH_MAP)) {
+  if (window && window.PointerEvent && (name in Blockly.Touch.TOUCH_MAP)) {
+    for (var i = 0, type; type = Blockly.Touch.TOUCH_MAP[name][i]; i++) {
+      node.addEventListener(type, wrapFunc, false);
+      bindData.push([node, type, wrapFunc]);
+    }
+  } else {
     node.addEventListener(name, wrapFunc, false);
     bindData.push([node, name, wrapFunc]);
-  }
-  // Add equivalent touch or pointer event.
-  if (name in Blockly.Touch.TOUCH_MAP) {
-    var touchWrapFunc = function(e) {
-      // Punt on multitouch events.
-      if (e.changedTouches && e.changedTouches.length == 1) {
-        // Map the touch event's properties to the event.
-        var touchPoint = e.changedTouches[0];
-        e.clientX = touchPoint.clientX;
-        e.clientY = touchPoint.clientY;
-      }
-      wrapFunc(e);
 
-      // Stop the browser from scrolling/zooming the page.
-      e.preventDefault();
-    };
-    for (var i = 0, type; type = Blockly.Touch.TOUCH_MAP[name][i]; i++) {
-      node.addEventListener(type, touchWrapFunc, false);
-      bindData.push([node, type, touchWrapFunc]);
+    // Add equivalent touch event.
+    if (name in Blockly.Touch.TOUCH_MAP) {
+      var touchWrapFunc = function(e) {
+        // Punt on multitouch events.
+        if (e.changedTouches && e.changedTouches.length == 1) {
+          // Map the touch event's properties to the event.
+          var touchPoint = e.changedTouches[0];
+          e.clientX = touchPoint.clientX;
+          e.clientY = touchPoint.clientY;
+        }
+        wrapFunc(e);
+
+        // Stop the browser from scrolling/zooming the page.
+        e.preventDefault();
+      };
+      for (var i = 0, type; type = Blockly.Touch.TOUCH_MAP[name][i]; i++) {
+        node.addEventListener(type, touchWrapFunc, false);
+        bindData.push([node, type, touchWrapFunc]);
+      }
     }
   }
   return bindData;

core/bubble.js

@@ -345,11 +345,16 @@ Blockly.Bubble.prototype.registerResizeEvent = function(callback) {
 
 /**
  * Move this bubble to the top of the stack.
+ * @return {!boolean} Whether or not the bubble has been moved.
  * @private
  */
 Blockly.Bubble.prototype.promote_ = function() {
   var svgGroup = this.bubbleGroup_.parentNode;
-  svgGroup.appendChild(this.bubbleGroup_);
+  if (svgGroup.lastChild !== this.bubbleGroup_) {
+    svgGroup.appendChild(this.bubbleGroup_);
+    return true;
+  }
+  return false;
 };
 
 /**

core/comment.js

@@ -122,7 +122,7 @@ Blockly.Comment.prototype.createEditor_ = function() {
   body.appendChild(textarea);
   this.textarea_ = textarea;
   this.foreignObject_.appendChild(body);
-  Blockly.bindEventWithChecks_(textarea, 'mouseup', this, this.textareaFocus_);
+  Blockly.bindEventWithChecks_(textarea, 'mouseup', this, this.textareaFocus_, true, true);
   // Don't zoom with mousewheel.
   Blockly.bindEventWithChecks_(textarea, 'wheel', this, function(e) {
     e.stopPropagation();
@@ -224,10 +224,11 @@ Blockly.Comment.prototype.textareaFocus_ = function(
   // Ideally this would be hooked to the focus event for the comment.
   // However doing so in Firefox swallows the cursor for unknown reasons.
   // So this is hooked to mouseup instead.  No big deal.
-  this.bubble_.promote_();
-  // Since the act of moving this node within the DOM causes a loss of focus,
-  // we need to reapply the focus.
-  this.textarea_.focus();
+  if (this.bubble_.promote_()) {
+    // Since the act of moving this node within the DOM causes a loss of focus,
+    // we need to reapply the focus.
+    this.textarea_.focus();
+  }
 };
 
 /**

core/css.js

@@ -386,9 +386,12 @@ Blockly.Css.CONTENT = [
   '.blocklyCommentTextarea {',
     'background-color: #ffc;',
     'border: 0;',
+    'outline: 0;',
     'margin: 0;',
     'padding: 2px;',
     'resize: none;',
+    'display: block;',
+    'overflow: hidden;',
   '}',
 
   '.blocklyHtmlInput {',

core/gesture.js

@@ -498,7 +498,7 @@ Blockly.Gesture.prototype.doStart = function(e) {
   }
 
   if (goog.string.caseInsensitiveEquals(e.type, 'touchstart') ||
-      goog.string.caseInsensitiveEquals(e.type, 'pointerdown')) {
+      (goog.string.caseInsensitiveEquals(e.type, 'pointerdown') && e.pointerType != 'mouse')) {
     Blockly.longStart_(e, this);
   }
 

core/touch.js

@@ -51,8 +51,14 @@ Blockly.Touch.TOUCH_MAP = {};
 if (window && window.PointerEvent) {
   Blockly.Touch.TOUCH_MAP = {
     'mousedown': ['pointerdown'],
+    'mouseenter': ['pointerenter'],
+    'mouseleave': ['pointerleave'],
     'mousemove': ['pointermove'],
-    'mouseup': ['pointerup', 'pointercancel']
+    'mouseout': ['pointerout'],
+    'mouseover': ['pointerover'],
+    'mouseup': ['pointerup', 'pointercancel'],
+    'touchend': ['pointerup'],
+    'touchcancel': ['pointercancel']
   };
 } else if (goog.events.BrowserFeature.TOUCH_ENABLED) {
   Blockly.Touch.TOUCH_MAP = {

core/touch_gesture.js

@@ -110,7 +110,7 @@ Blockly.TouchGesture.ZOOM_OUT_MULTIPLIER = 6;
  */
 Blockly.TouchGesture.prototype.doStart = function(e) {
   Blockly.TouchGesture.superClass_.doStart.call(this, e);
-  if (Blockly.Touch.isTouchEvent(e)) {
+  if (!this.isEnding_ && Blockly.Touch.isTouchEvent(e)) {
     this.handleTouchStart(e);
   }
 };
@@ -135,6 +135,7 @@ Blockly.TouchGesture.prototype.bindMouseEvents = function(e) {
       /*opt_noCaptureIdentifier*/ true);
 
   e.preventDefault();
+  e.stopPropagation();
 };
 
 /**
@@ -143,7 +144,7 @@ Blockly.TouchGesture.prototype.bindMouseEvents = function(e) {
  * @package
  */
 Blockly.TouchGesture.prototype.handleStart = function(e) {
-  if (!this.isDragging) {
+  if (this.isDragging()) {
     // A drag has already started, so this can no longer be a pinch-zoom.
     return;
   }
@@ -238,8 +239,8 @@ Blockly.TouchGesture.prototype.handleTouchStart = function(e) {
     var point1 = this.cachedPoints_[pointers[1]];
     this.startDistance_ = goog.math.Coordinate.distance(point0, point1);
     this.isMultiTouch_ = true;
+    e.preventDefault();
   }
-  e.preventDefault();
 };
 
 /**
@@ -272,8 +273,8 @@ Blockly.TouchGesture.prototype.handleTouchMove = function(e) {
       workspace.zoom(position.x, position.y, delta);
     }
     this.previousScale_ = scale;
+    e.preventDefault();
   }
-  e.preventDefault();
 };
 
 /**

core/workspace_svg.js

@@ -402,7 +402,7 @@ Blockly.WorkspaceSvg.prototype.createDom = function(opt_backgroundClass) {
 
   if (!this.isFlyout) {
     Blockly.bindEventWithChecks_(this.svgGroup_, 'mousedown', this,
-        this.onMouseDown_);
+        this.onMouseDown_, false, true);
     if (this.options.zoomOptions && this.options.zoomOptions.wheel) {
       // Mouse-wheel.
       Blockly.bindEventWithChecks_(this.svgGroup_, 'wheel', this,