1 files changed, 47 insertions, 11 deletions

diff --git a/js/stage/binding-view.reel/binding-view.js b/js/stage/binding-view.reel/binding-view.js
index 682c0827..0a663a4e 100755
--- a/js/stage/binding-view.reel/binding-view.js
+++ b/js/stage/binding-view.reel/binding-view.js
@@ -36,7 +36,6 @@ exports.BindingView = Montage.create(Component, {
         },
         set: function(val) {
             this._translateX = val;
-            console.log("x", this._translateX);
         }
     },
 
@@ -46,7 +45,6 @@ exports.BindingView = Montage.create(Component, {
         },
         set: function(val) {
             this._translateY = val;
-            console.log("y", this._translateY);
         }
     },
 
@@ -104,6 +102,10 @@ exports.BindingView = Montage.create(Component, {
         value: null
     },
 
+    startConnector: {
+        value: null
+    },
+
     //Public Objects
     hudRepeater: { value: null },
 
@@ -129,7 +131,6 @@ exports.BindingView = Montage.create(Component, {
                 this.application.ninja.objectsController.getPropertiesFromObject(this.selectedComponent, true).forEach(function(obj) {
                     this.componentsList[this.selectedComponent.identifier].properties.push({"title":obj})
                 }.bind(this));
-                console.log("components:",this.componentsList);
                 //Go through the loop and find every interacted object by bindings
                 arrBindings.forEach(function(obj) {
                     if(typeof (this.componentsList[obj.boundObject.identifier]) === "undefined") {
@@ -145,7 +146,6 @@ exports.BindingView = Montage.create(Component, {
                 for(var key in this.componentsList){
                     this.bindables.push(this.componentsList[key]);
                 }
-                console.log(this.bindables);
                 // Get Bindings that exist;
 
 
@@ -231,6 +231,12 @@ exports.BindingView = Montage.create(Component, {
                 this.clearCanvas();
             }
 
+            if(this.mouseOverHud && !this._isDrawingConnection) {
+                if(!this.element.classList.contains("mousedOverHud")) { this.element.classList.add("mousedOverHud"); }
+            } else {
+                if(this.element.classList.contains("mousedOverHud")) { this.element.classList.remove("mousedOverHud"); }
+            }
+
         }
     },
 
@@ -279,6 +285,27 @@ exports.BindingView = Montage.create(Component, {
         value: {x: 0, y:0}
     },
 
+    objectsTray: {
+        value:null
+    },
+
+
+    // When mouse pointer is on a hud this value will be set to true
+    _mouseOverHud: { value: false },
+    mouseOverHud: {
+        get: function() {
+            return this._mouseOverHud;
+        },
+        set: function(val) {
+            if(this._mouseOverHud !== val) {
+                this._mouseOverHud = val;
+                this.needsDraw = true;
+            }
+        }
+    },
+
+
+
     handleMousemove: {
         value: function(e) {
             var mousePoint = webkitConvertPointFromPageToNode(this.element, new WebKitPoint(e.pageX, e.pageY));
@@ -287,15 +314,18 @@ exports.BindingView = Montage.create(Component, {
                 if(obj.x < mousePoint.x && (obj.x + obj.element.offsetWidth) > mousePoint.x) {
                     if(obj.y < mousePoint.y && (obj.y + obj.element.offsetHeight) > mousePoint.y) {
                         overHud = true;
-                        console.log(overHud);
                     }
                 }
             }.bind(this));
-            if(overHud) {
-                this.element.style.zIndex = "12";
-            } else {
-                this.element.style.zIndex = "2";
+            if(typeof (this.objectsTray.element) !== "undefined") {
+                if (this.objectsTray.element.offsetLeft < mousePoint.x && (this.objectsTray.element.offsetLeft + this.objectsTray.element.offsetWidth) > mousePoint.x ) {
+                    //console.log(this.objectsTray.element.offsetTop, (this.objectsTray.element.parentElement.offsetTop + this.objectsTray.element.offsetHeight) );
+                    if(this.objectsTray.element.parentElement.offsetTop < mousePoint.y && (this.objectsTray.element.parentElement.offsetTop + this.objectsTray.element.offsetHeight) > mousePoint.y) {
+                        overHud = true;
+                    }
+                }
             }
+            this.mouseOverHud = overHud;
 
             if(this._isDrawingConnection) {
                 this._currentMousePosition = mousePoint;
@@ -306,8 +336,14 @@ exports.BindingView = Montage.create(Component, {
     },
 
     handleMouseup: {
-        value: function() {
+        value: function(e) {
             window.removeEventListener("mouseup", this);
+//            var mouseUpPoint = new WebKitPoint(e.pageX, e.pageY);
+//            var nodeEl = new webkitConvertPointFromPageToNode(this.element, mouseUpPoint);
+            this.element.style.zIndex = "12";
+            var nodeEl = document.elementFromPoint(e.pageX, e.pageY);
+            console.log(nodeEl);
+            this.element.style.zIndex = null;
             this._isDrawingConnection = false;
             this.needsDraw = true;
         }
@@ -316,7 +352,7 @@ exports.BindingView = Montage.create(Component, {
     handleMousedown: {
         value: function(e) {
             // We are looking for a mouse down on an option to start the connection visual
-            if(e._event.target.classList.contains("hudOption")) {
+            if(e._event.target.classList.contains("connectorBubble")) {
                 //NOTE: Test Code Please Clean Up
                 //alert(event._event.target.controller.title);
                 this._isDrawingConnection = true;