Comments v3 (#1817)

* Add skeleton for workspace comments

* XML parsing and encoding of workspace comments.

* Minor fix: piping the height and width from xml to newWorkspaceComment

* Move height and width into workspace_comment_svg

* rename newWorkspaceComment to newComment

* minor refactoring. PR changes

* Functions for managing the comment's lifecycle

* Add initial tests

* Add another test

* Add basic rendering of a comment.

* Cleanup remaining highlighting steps from render

* Fix lint

* Fix aslant

* Add basic comment translate

* Simplify render code into one setPath method

* Move steps to setPath_

* Remove svg elements when disposing of a comment; some code cleanup

* Add a workspace comment on context menu click and position it where the initial context menu was clicked.

* Minor rendering changes, fixes RTL. Fix positioning of new (context menu) comments while workspace is scaled.

* PR feedback

* Gesture code for dragging comments

* Add comment (block drag) surface methods

* minor comment fix

* Comment fixes

* Add comment dragger

* Making rendered private

* Require CommentDragger

* Make basic comment dragging work

* Increase the border around the comment to make a bigger drag handle

* Remove typo

* Allow comments to be selected. Highlight selected comment. Only edit comment on click. Updated comment rendering.

* minor refactor: remove commented out code

* PR comments

* lint and rebuild

* Fix renamed function call

* Fix workspace getMetrics by storing comment size as a number, not a string

* Enable comment deletion when dragging over the toolbox or trash can

* Give issue references to some todos

* Create a helper function for workspace comment creation

* Integrate sam's workspace comments, using the bubble dragger

* Remove comment_dragger references

* Remove comment dragger.js

* Remove pointer handling

* Fix lint

* Move comment XML functions into the comment files.

* Fix tests

* Fix type annotations

* Fix comments on comments

* Fix compiler errors related to visibility.

* Fix merge issues and add an issue number to a TODO

* Add a new message for default text on workspace comments, and rebuild

* Add support for a context menu on workspace comment showing delete and duplication options.
Add copy and paste support.

* PR comment feedback

* Show a delete icon on the comment when selected. Delete icon deletes the comment. Comment can be deleted if dragged onto the toolbox or the trash icon. A normal bubble cannot be deleted that way.

* use isDeletable instead

* Support drag of the comment during editing mode using the top handle.

* Add skeletons for all workspace comment events

* Rebuild with new comments

* Get rid of confused TODO

* JSDoc on a function

* Fix broken tests

* More PR feedback

* Fix lint

* Delete comment on mouse out, highlight on mouse down.

* Fix lint.

* Show delete hand cursor when dragging a comment to delete over the toolbox

* Focus textarea on select

* Add delete events

* Remove workspace comment create event, and add TODO placeholder

* Provide default values if comment height and width are missing in XML

* Set comment handle fill to none by default

* Rebuild

* Comment de/serialization should include location.

* Add comment move events, with undo and redo

* Add comment change events

* Move files up to core

* Add package/private annotations wherever possible

* Move the workspace comment events up to core and into a single file

* Mark things package or private where possible

* Get rid of unnecessary changes to messge files

* Fix lint

* Fix some review feedback

* Make changes to the comment db happen in addTopComment and removeTopComment

* Add css classes for toggling comment focus

* Clean up css for comment focus

* Rebuild

core/bubble_dragger.js

@@ -26,21 +26,27 @@
 
 goog.provide('Blockly.BubbleDragger');
 
+goog.require('Blockly.Bubble');
+goog.require('Blockly.Events.CommentMove');
+goog.require('Blockly.WorkspaceCommentSvg');
+
 goog.require('goog.math.Coordinate');
 goog.require('goog.asserts');
 
 
 /**
- * Class for a bubble dragger.  It moves bubbles around the workspace when they
- * are being dragged by a mouse or touch.
- * @param {!Blockly.Bubble} bubble The bubble to drag.
+ * Class for a bubble dragger.  It moves things on the bubble canvas around the
+ * workspace when they are being dragged by a mouse or touch.  These can be
+ * block comments, mutators, warnings, or workspace comments.
+ * @param {!Blockly.Bubble|!Blockly.WorkspaceCommentSvg} bubble The item on the
+ *     bubble canvas to drag.
  * @param {!Blockly.WorkspaceSvg} workspace The workspace to drag on.
  * @constructor
  */
 Blockly.BubbleDragger = function(bubble, workspace) {
   /**
-   * The bubble that is being dragged.
-   * @type {!Blockly.Bubble}
+   * The item on the bubble canvas that is being dragged.
+   * @type {!Blockly.Bubble|!Blockly.WorkspaceCommentSvg}
    * @private
    */
   this.draggingBubble_ = bubble;
@@ -52,6 +58,22 @@ Blockly.BubbleDragger = function(bubble, workspace) {
    */
   this.workspace_ = workspace;
 
+  /**
+   * Which delete area the mouse pointer is over, if any.
+   * One of {@link Blockly.DELETE_AREA_TRASH},
+   * {@link Blockly.DELETE_AREA_TOOLBOX}, or {@link Blockly.DELETE_AREA_NONE}.
+   * @type {?number}
+   * @private
+   */
+  this.deleteArea_ = null;
+
+  /**
+   * Whether the bubble would be deleted if dropped immediately.
+   * @type {boolean}
+   * @private
+   */
+  this.wouldDeleteBubble_ = false;
+
   /**
    * The location of the top left corner of the dragging bubble's body at the
    * beginning of the drag, in workspace coordinates.
@@ -95,6 +117,15 @@ Blockly.BubbleDragger.prototype.startBubbleDrag = function() {
   if (this.dragSurface_) {
     this.moveToDragSurface_();
   }
+
+  this.draggingBubble_.setDragging && this.draggingBubble_.setDragging(true);
+
+  var toolbox = this.workspace_.getToolbox();
+  if (toolbox) {
+    var style = this.draggingBubble_.isDeletable() ? 'blocklyToolboxDelete' :
+        'blocklyToolboxGrab';
+    toolbox.addStyle(style);
+  }
 };
 
 /**
@@ -110,8 +141,55 @@ Blockly.BubbleDragger.prototype.dragBubble = function(e, currentDragDeltaXY) {
   var newLoc = goog.math.Coordinate.sum(this.startXY_, delta);
 
   this.draggingBubble_.moveDuringDrag(this.dragSurface_, newLoc);
-  // TODO (fenichel): Possibly update the cursor if dragging to the trash can
-  // is allowed.
+
+  if (this.draggingBubble_.isDeletable()) {
+    this.deleteArea_ =  this.workspace_.isDeleteArea(e);
+    this.updateCursorDuringBubbleDrag_();
+  }
+};
+
+/**
+ * Shut the trash can and, if necessary, delete the dragging bubble.
+ * Should be called at the end of a bubble drag.
+ * @return {boolean} whether the bubble was deleted.
+ * @private
+ */
+Blockly.BubbleDragger.prototype.maybeDeleteBubble_ = function() {
+  var trashcan = this.workspace_.trashcan;
+
+  if (this.wouldDeleteBubble_) {
+    if (trashcan) {
+      goog.Timer.callOnce(trashcan.close, 100, trashcan);
+    }
+    // Fire a move event, so we know where to go back to for an undo.
+    this.fireMoveEvent_();
+    this.draggingBubble_.dispose(false, true);
+  } else if (trashcan) {
+    // Make sure the trash can is closed.
+    trashcan.close();
+  }
+  return this.wouldDeleteBubble_;
+};
+
+/**
+ * Update the cursor (and possibly the trash can lid) to reflect whether the
+ * dragging bubble would be deleted if released immediately.
+ * @private
+ */
+Blockly.BubbleDragger.prototype.updateCursorDuringBubbleDrag_ = function() {
+  this.wouldDeleteBubble_ = this.deleteArea_ != Blockly.DELETE_AREA_NONE;
+  var trashcan = this.workspace_.trashcan;
+  if (this.wouldDeleteBubble_) {
+    this.draggingBubble_.setDeleteStyle(true);
+    if (this.deleteArea_ == Blockly.DELETE_AREA_TRASH && trashcan) {
+      trashcan.setOpen_(true);
+    }
+  } else {
+    this.draggingBubble_.setDeleteStyle(false);
+    if (trashcan) {
+      trashcan.setOpen_(false);
+    }
+  }
 };
 
 /**
@@ -131,14 +209,24 @@ Blockly.BubbleDragger.prototype.endBubbleDrag = function(
 
   // Move the bubble to its final location.
   this.draggingBubble_.moveTo(newLoc.x, newLoc.y);
-  // Put everything back onto the bubble canvas.
-  if (this.dragSurface_) {
-    this.dragSurface_.clearAndHide(this.workspace_.getBubbleCanvas());
-  }
+  var deleted = this.maybeDeleteBubble_();
 
-  this.fireMoveEvent_();
+  if (!deleted) {
+    // Put everything back onto the bubble canvas.
+    if (this.dragSurface_) {
+      this.dragSurface_.clearAndHide(this.workspace_.getBubbleCanvas());
+    }
+
+    this.draggingBubble_.setDragging && this.draggingBubble_.setDragging(false);
+    this.fireMoveEvent_();
+  }
   this.workspace_.setResizesEnabled(true);
 
+  if (this.workspace_.toolbox_) {
+    var style = this.draggingBubble_.isDeletable() ? 'blocklyToolboxDelete' :
+        'blocklyToolboxGrab';
+    this.workspace_.toolbox_.removeStyle(style);
+  }
   Blockly.Events.setGroup(false);
 };
 
@@ -147,6 +235,12 @@ Blockly.BubbleDragger.prototype.endBubbleDrag = function(
  * @private
  */
 Blockly.BubbleDragger.prototype.fireMoveEvent_ = function() {
+  if (this.draggingBubble_.isComment) {
+    var event = new Blockly.Events.CommentMove(this.draggingBubble_);
+    event.setOldCoordinate(this.startXY_);
+    event.recordNew();
+    Blockly.Events.fire(event);
+  }
   // TODO (fenichel): move events for comments.
   return;
 };