prepare new version. Update docs.

src/DragAndDrop.ts

@@ -1,22 +1,9 @@
-import { Animation } from './Animation';
 import { Konva } from './Global';
 import { Node } from './Node';
 import { Vector2d } from './types';
 import { Util } from './Util';
 
-// TODO: make better module,
-// make sure other modules import it without global
 export const DD = {
-  startPointerPos: {
-    x: 0,
-    y: 0
-  },
-  // properties
-  anim: new Animation(function() {
-    var b = this.dirty;
-    this.dirty = false;
-    return b;
-  }),
   get isDragging() {
     var flag = false;
     DD._dragElements.forEach(elem => {
@@ -27,10 +14,6 @@ export const DD = {
     return flag;
   },
   justDragged: false,
-  offset: {
-    x: 0,
-    y: 0
-  },
   get node() {
     // return first dragging node
     var node: Node | undefined;
@@ -67,8 +50,9 @@ export const DD = {
       const pos = stage._changedPointerPositions.find(
         pos => pos.id === elem.pointerId
       );
+
+      // not related pointer
       if (!pos) {
-        console.error('Can not find pointer');
         return;
       }
       if (!elem.isDragging) {
@@ -109,6 +93,9 @@ export const DD = {
       );
     });
   },
+
+  // dragBefore and dragAfter allows us to set correct order of events
+  // setup all in dragbefore, and stop dragging only after pointerup triggered.
   _endDragBefore(evt) {
     DD._dragElements.forEach((elem, key) => {
       const { node } = elem;
@@ -140,31 +127,6 @@ export const DD = {
         drawNode.draw();
       }
     });
-    // var node = DD.node;
-
-    // if (node) {
-    //   DD.anim.stop();
-
-    //   // only fire dragend event if the drag and drop
-    //   // operation actually started.
-    //   if (DD.isDragging) {
-    //     DD.isDragging = false;
-    //     DD.justDragged = true;
-    //     Konva.listenClickTap = false;
-
-    //     if (evt) {
-    //       evt.dragEndNode = node;
-    //     }
-    //   }
-
-    //   DD.node = null;
-
-    //   const drawNode =
-    //     node.getLayer() || (node instanceof Konva['Stage'] && node);
-    //   if (drawNode) {
-    //     drawNode.draw();
-    //   }
-    // }
   },
   _endDragAfter(evt) {
     DD._dragElements.forEach((elem, key) => {
@@ -181,19 +143,6 @@ export const DD = {
         DD._dragElements.delete(key);
       }
     });
-    // evt = evt || {};
-    // var dragEndNode = evt.dragEndNode;
-    // if (evt && dragEndNode) {
-    //   dragEndNode.fire(
-    //     'dragend',
-    //     {
-    //       type: 'dragend',
-    //       target: dragEndNode,
-    //       evt: evt
-    //     },
-    //     true
-    //   );
-    // }
   }
 };