fix: handle coordinates via e.x, e.y or e.clientX, e.clientY - otherwise it causes issues

Author: rychkog

package.json

@@ -1,21 +1,21 @@
 {
   "name": "ng2-branchy",
-  "version": "1.0.0",
-  "description": "angular2 component for visualizing a tree",
+  "version": "0.0.1",
+  "description": "angular2 component for visualizing data that can be naturally represented as a tree",
   "main": "ng2-branchy.js",
   "scripts": {
-    "preinstall": "rm -rf ./typings && typings install",
+    "preinstall": "typings install",
     "dev": "webpack-dev-server --inline --hot",
     "build": "webpack"
   },
   "author": "rychko.georgiy@gmail.com",
-  "license": "ISC",
+  "license": "MIT",
   "dependencies": {
-    "@angular/common": "2.0.0-rc.1",
-    "@angular/compiler": "2.0.0-rc.1",
-    "@angular/core": "2.0.0-rc.1",
-    "@angular/platform-browser": "2.0.0-rc.1",
-    "@angular/platform-browser-dynamic": "2.0.0-rc.1",
+    "@angular/common": "2.0.0-rc.2",
+    "@angular/compiler": "2.0.0-rc.2",
+    "@angular/core": "2.0.0-rc.2",
+    "@angular/platform-browser": "2.0.0-rc.2",
+    "@angular/platform-browser-dynamic": "2.0.0-rc.2",
     "es6-shim": "0.35.0",
     "file-loader": "0.8.5",
     "font-awesome": "4.6.1",

src/node-draggable.directive.ts

@@ -50,13 +50,13 @@ export class NodeDraggableDirective implements OnDestroy {
 
   private handleDragEnter(e: DragEvent): any {
     e.preventDefault();
-    if (this.containsElementAt(e.pageX, e.pageY)) {
+    if (this.containsElementAt(e)) {
       this.addClass('over-drop-target');
     }
   }
 
   private handleDragLeave(e: DragEvent): any {
-    if (!this.containsElementAt(e.pageX, e.pageY)) {
+    if (!this.containsElementAt(e)) {
       this.removeClass('over-drop-target');
     }
   }
@@ -78,15 +78,18 @@ export class NodeDraggableDirective implements OnDestroy {
 
   private isDropPossible(e: DragEvent) {
     const capturedNode = this.nodeDraggableService.getCapturedNode();
-    return capturedNode && capturedNode.canBeDroppedAt(this.nodeDraggable) && this.containsElementAt(e.pageX, e.pageY);
+    return capturedNode
+      && capturedNode.canBeDroppedAt(this.nodeDraggable)
+      && this.containsElementAt(e);
   }
 
   private handleDragEnd(e: DragEvent): any {
     this.removeClass('over-drop-target');
     this.nodeDraggableService.releaseCapturedNode();
   }
 
-  private containsElementAt(x: number, y: number): boolean {
+  private containsElementAt(e: DragEvent): boolean {
+    const {x = e.clientX, y = e.clientY} = e;
     return this.nodeNativeElement.contains(document.elementFromPoint(x, y));
   }
 

webpack.config.js

@@ -74,7 +74,7 @@ config.module = {
 
 config.plugins = [
     new HtmlWebpackPlugin({
-        title: 'ng2-tree',
+        title: 'ng2-branchy',
         template: 'demo/index.ejs',
         inject: 'body'
     }),