From b4ab3e558f26549c63fa0d0a542e208d2be62d56 Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Mon, 18 Jun 2012 20:10:34 -0700 Subject: Binding - Drop Locate connector Signed-off-by: Armen Kesablyan --- js/stage/binding-view.reel/binding-view.js | 58 ++++++++++++++++++++++++------ 1 file changed, 47 insertions(+), 11 deletions(-) (limited to 'js/stage/binding-view.reel/binding-view.js') 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; -- cgit v1.2.3