aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js1
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud.reel/binding-hud.css11
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud.reel/binding-hud.js1
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.css4
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.js58
5 files changed, 57 insertions, 18 deletions
diff --git a/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js b/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js
index 6db86a78..18eb11c9 100755
--- a/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js
+++ b/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js
@@ -60,7 +60,6 @@ exports.BindingHudOption = Montage.create(Component, {
60 draw: { 60 draw: {
61 value:function() { 61 value:function() {
62 if(this.bound) { 62 if(this.bound) {
63 console.log(this.title);
64 this.element.classList.add("bound"); 63 this.element.classList.add("bound");
65 } else { 64 } else {
66 this.element.classList.remove("bound"); 65 this.element.classList.remove("bound");
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css
index c53c82e2..1c75b03a 100755
--- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css
+++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css
@@ -38,15 +38,16 @@
38 position:relative; 38 position:relative;
39 border-bottom:1px solid #505050; 39 border-bottom:1px solid #505050;
40 line-height:16px; 40 line-height:16px;
41 padding:1px 9px 1px 15px; 41 padding:1px 20px 1px 10px;
42} 42}
43.connectorBubble, .bindingHud .hudOption:hover, .bindingHud .hudOption .connectorBubble:hover { 43
44.bindingHud .hudOption .connectorBubble:hover {
44 box-shadow: inset 0px 0px 6px #5e9eff; 45 box-shadow: inset 0px 0px 6px #5e9eff;
45 display:block; 46 cursor: pointer;
46} 47}
47 48
48.hudOption.bound, .bindingHud .hudOption.bound { 49.hudOption.bound, .bindingHud .hudOption.bound {
49 background: #5e9eff; 50 background: -webkit-linear-gradient(top, #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%);
50} 51}
51 52
52.bindingHud .hudOption:last-child { 53.bindingHud .hudOption:last-child {
@@ -62,7 +63,7 @@
62 height: 12px; 63 height: 12px;
63 border-left: 0px; 64 border-left: 0px;
64 display: block; 65 display: block;
65 box-shadow: inset 0px 0px 6px #5e9eff; 66 box-shadow: inset 0px 0px 6px #AAA;
66 /*border-bottom-right-radius: 50%; 67 /*border-bottom-right-radius: 50%;
67 border-top-right-radius: 50%;*/ 68 border-top-right-radius: 50%;*/
68 69
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js
index 4260a66c..799c5866 100755
--- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js
+++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js
@@ -32,7 +32,6 @@ exports.BindingHud = Montage.create(Component, {
32 this.y = this._bindingArgs.component.element.offsetTop; 32 this.y = this._bindingArgs.component.element.offsetTop;
33 this.properties = this._bindingArgs.properties; 33 this.properties = this._bindingArgs.properties;
34 this.needsDraw = true; 34 this.needsDraw = true;
35 console.log("Binding Args Set", val);
36 } else { 35 } else {
37 this.properties = []; 36 this.properties = [];
38 } 37 }
diff --git a/js/stage/binding-view.reel/binding-view.css b/js/stage/binding-view.reel/binding-view.css
index fbd1b2b6..b6673da1 100755
--- a/js/stage/binding-view.reel/binding-view.css
+++ b/js/stage/binding-view.reel/binding-view.css
@@ -9,6 +9,10 @@
9 z-index: 2; 9 z-index: 2;
10} 10}
11 11
12.bindingView.mousedOverHud {
13 z-index: 12;
14}
15
12.hudRepeater { 16.hudRepeater {
13 position: absolute; 17 position: absolute;
14 width:100%; 18 width:100%;
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, {
36 }, 36 },
37 set: function(val) { 37 set: function(val) {
38 this._translateX = val; 38 this._translateX = val;
39 console.log("x", this._translateX);
40 } 39 }
41 }, 40 },
42 41
@@ -46,7 +45,6 @@ exports.BindingView = Montage.create(Component, {
46 }, 45 },
47 set: function(val) { 46 set: function(val) {
48 this._translateY = val; 47 this._translateY = val;
49 console.log("y", this._translateY);
50 } 48 }
51 }, 49 },
52 50
@@ -104,6 +102,10 @@ exports.BindingView = Montage.create(Component, {
104 value: null 102 value: null
105 }, 103 },
106 104
105 startConnector: {
106 value: null
107 },
108
107 //Public Objects 109 //Public Objects
108 hudRepeater: { value: null }, 110 hudRepeater: { value: null },
109 111
@@ -129,7 +131,6 @@ exports.BindingView = Montage.create(Component, {
129 this.application.ninja.objectsController.getPropertiesFromObject(this.selectedComponent, true).forEach(function(obj) { 131 this.application.ninja.objectsController.getPropertiesFromObject(this.selectedComponent, true).forEach(function(obj) {
130 this.componentsList[this.selectedComponent.identifier].properties.push({"title":obj}) 132 this.componentsList[this.selectedComponent.identifier].properties.push({"title":obj})
131 }.bind(this)); 133 }.bind(this));
132 console.log("components:",this.componentsList);
133 //Go through the loop and find every interacted object by bindings 134 //Go through the loop and find every interacted object by bindings
134 arrBindings.forEach(function(obj) { 135 arrBindings.forEach(function(obj) {
135 if(typeof (this.componentsList[obj.boundObject.identifier]) === "undefined") { 136 if(typeof (this.componentsList[obj.boundObject.identifier]) === "undefined") {
@@ -145,7 +146,6 @@ exports.BindingView = Montage.create(Component, {
145 for(var key in this.componentsList){ 146 for(var key in this.componentsList){
146 this.bindables.push(this.componentsList[key]); 147 this.bindables.push(this.componentsList[key]);
147 } 148 }
148 console.log(this.bindables);
149 // Get Bindings that exist; 149 // Get Bindings that exist;
150 150
151 151
@@ -231,6 +231,12 @@ exports.BindingView = Montage.create(Component, {
231 this.clearCanvas(); 231 this.clearCanvas();
232 } 232 }
233 233
234 if(this.mouseOverHud && !this._isDrawingConnection) {
235 if(!this.element.classList.contains("mousedOverHud")) { this.element.classList.add("mousedOverHud"); }
236 } else {
237 if(this.element.classList.contains("mousedOverHud")) { this.element.classList.remove("mousedOverHud"); }
238 }
239
234 } 240 }
235 }, 241 },
236 242
@@ -279,6 +285,27 @@ exports.BindingView = Montage.create(Component, {
279 value: {x: 0, y:0} 285 value: {x: 0, y:0}
280 }, 286 },
281 287
288 objectsTray: {
289 value:null
290 },
291
292
293 // When mouse pointer is on a hud this value will be set to true
294 _mouseOverHud: { value: false },
295 mouseOverHud: {
296 get: function() {
297 return this._mouseOverHud;
298 },
299 set: function(val) {
300 if(this._mouseOverHud !== val) {
301 this._mouseOverHud = val;
302 this.needsDraw = true;
303 }
304 }
305 },
306
307
308
282 handleMousemove: { 309 handleMousemove: {
283 value: function(e) { 310 value: function(e) {
284 var mousePoint = webkitConvertPointFromPageToNode(this.element, new WebKitPoint(e.pageX, e.pageY)); 311 var mousePoint = webkitConvertPointFromPageToNode(this.element, new WebKitPoint(e.pageX, e.pageY));
@@ -287,15 +314,18 @@ exports.BindingView = Montage.create(Component, {
287 if(obj.x < mousePoint.x && (obj.x + obj.element.offsetWidth) > mousePoint.x) { 314 if(obj.x < mousePoint.x && (obj.x + obj.element.offsetWidth) > mousePoint.x) {
288 if(obj.y < mousePoint.y && (obj.y + obj.element.offsetHeight) > mousePoint.y) { 315 if(obj.y < mousePoint.y && (obj.y + obj.element.offsetHeight) > mousePoint.y) {
289 overHud = true; 316 overHud = true;
290 console.log(overHud);
291 } 317 }
292 } 318 }
293 }.bind(this)); 319 }.bind(this));
294 if(overHud) { 320 if(typeof (this.objectsTray.element) !== "undefined") {
295 this.element.style.zIndex = "12"; 321 if (this.objectsTray.element.offsetLeft < mousePoint.x && (this.objectsTray.element.offsetLeft + this.objectsTray.element.offsetWidth) > mousePoint.x ) {
296 } else { 322 //console.log(this.objectsTray.element.offsetTop, (this.objectsTray.element.parentElement.offsetTop + this.objectsTray.element.offsetHeight) );
297 this.element.style.zIndex = "2"; 323 if(this.objectsTray.element.parentElement.offsetTop < mousePoint.y && (this.objectsTray.element.parentElement.offsetTop + this.objectsTray.element.offsetHeight) > mousePoint.y) {
324 overHud = true;
325 }
326 }
298 } 327 }
328 this.mouseOverHud = overHud;
299 329
300 if(this._isDrawingConnection) { 330 if(this._isDrawingConnection) {
301 this._currentMousePosition = mousePoint; 331 this._currentMousePosition = mousePoint;
@@ -306,8 +336,14 @@ exports.BindingView = Montage.create(Component, {
306 }, 336 },