cloud-blocks/core/codesketch_gesture.js

Cloud Blocks is a library for building scratch computing interfaces with Luxrobo MODI.

/**
 * @license
 * Visual Blocks Editor
 *
 * Copyright 2017 Google Inc.
 * https://developers.google.com/blockly/
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/**
 * @fileoverview The class representing an in-progress gesture, usually a drag
 * or a tap.
 * @author Sophie
 */
'use strict';

goog.provide('Blockly.CodeSketchGesture');

goog.require('Blockly.CodeSketchBlockDragger');

/*
 * Note: In this file "start" refers to touchstart, mousedown, and pointerstart
 * events.  "End" refers to touchend, mouseup, and pointerend events.
 */
// TODO: Consider touchcancel/pointercancel.

/**
 * Class for one gesture.
 * @param {!Event} e The event that kicked off this gesture.
 * @param {!Blockly.WorkspaceSvg} creatorWorkspace The workspace that created
 *     this gesture and has a reference to it.
 * @constructor
 */
Blockly.CodeSketchGesture = function (e, creatorWorkspace) {
  Blockly.CodeSketchGesture.superClass_.constructor.call(
    this,
    e,
    creatorWorkspace
  );
};
goog.inherits(Blockly.CodeSketchGesture, Blockly.Gesture);

/**
 * Update this gesture to record whether a block is being dragged.
 * This function should be called on a mouse/touch move event the first time the
 * drag radius is exceeded.  It should be called no more than once per gesture.
 * If a block should be dragged, either from the flyout or in the workspace,
 * this function creates the necessary BlockDragger and starts the drag.
 * @return {boolean} true if a block is being dragged.
 * @private
 */
Blockly.CodeSketchGesture.prototype.updateIsDraggingBlock_ = function () {
  if (!this.targetBlock_) {
    return false;
  }

  if (this.flyout_) {
    this.isDraggingBlock_ = this.updateIsDraggingFromFlyout_();
  } else if (this.targetBlock_.isMovable() || this.shouldDuplicateOnDrag_) {
    this.isDraggingBlock_ = true;
    this.creatorWorkspace_.getFlyout().setBackgroundOpacity(true);
    this.creatorWorkspace_
      .getFlyout()
      .getWorkspace()
      .setBackgroundVisible(true);
  }

  if (this.isDraggingBlock_) {
    this.startDraggingBlock_();
    return true;
  }
  return false;
};

/**
 * Create a block dragger and start dragging the selected block.
 * @private
 */
Blockly.CodeSketchGesture.prototype.startDraggingBlock_ = function () {
  if (this.shouldDuplicateOnDrag_) {
    this.duplicateOnDrag_();
  }
  this.blockDragger_ = new Blockly.CodeSketchBlockDragger(
    this.targetBlock_,
    this.startWorkspace_
  );
  this.blockDragger_.startBlockDrag(this.currentDragDeltaXY_);
  this.blockDragger_.dragBlock(this.mostRecentEvent_, this.currentDragDeltaXY_);

  var flyout = this.creatorWorkspace_.toolbox_.flyout_.getClientRect();
  this.blockDragger_.isFromFlyout_ = flyout.contains(this.mouseDownXY_);
};

/**
 * Handle a mouse up or touch end event.
 * @param {!Event} e A mouse up or touch end event.
 * @package
 */
Blockly.CodeSketchGesture.prototype.handleUp = function (e) {
  this.updateFromEvent_(e);
  Blockly.longStop_();

  if (this.isEnding_) {
    return;
  }
  this.isEnding_ = true;
  // The ordering of these checks is important: drags have higher priority than
  // clicks.  Fields have higher priority than blocks; blocks have higher
  // priority than workspaces.
  // The ordering within drags does not matter, because the three types of
  // dragging are exclusive.
  if (this.isDraggingBubble_) {
    this.bubbleDragger_.endBubbleDrag(e, this.currentDragDeltaXY_);
  } else if (this.isDraggingBlock_) {
    this.blockDragger_.endBlockDrag(e, this.currentDragDeltaXY_);
  } else if (this.isDraggingWorkspace_) {
    this.workspaceDragger_.endDrag(this.currentDragDeltaXY_);
  } else if (this.isBubbleClick_()) {
    // Bubbles are in front of all fields and blocks.
    this.doBubbleClick_();
  } else if (this.isFieldClick_()) {
    this.doFieldClick_();
  } else if (this.isBlockClick_()) {
    this.doBlockClick_();
  } else if (this.isWorkspaceClick_()) {
    this.doWorkspaceClick_();
  }

  this.creatorWorkspace_.getFlyout().setBackgroundOpacity(false);
  this.creatorWorkspace_.getFlyout().getWorkspace().setBackgroundVisible(false);

  e.preventDefault();
  e.stopPropagation();

  this.dispose();
};