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.css6
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.html3
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.js124
-rwxr-xr-xjs/stage/stage.reel/stage.html2
-rwxr-xr-xjs/stage/stage.reel/stage.js12
-rw-r--r--js/tools/bindingTool.js10
9 files changed, 132 insertions, 38 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 543577d1..0365f52d 100755
--- a/js/stage/binding-view.reel/binding-view.css
+++ b/js/stage/binding-view.reel/binding-view.css
@@ -5,9 +5,11 @@
5 </copyright> */ 5 </copyright> */
6 6
7.bindingView { 7.bindingView {
8 height: 100%;
9 position: absolute; 8 position: absolute;
10 width:100%; 9 z-index: 2;
10}
11
12.bindingView.mousedOverHud {
11 z-index: 12; 13 z-index: 12;
12} 14}
13 15
diff --git a/js/stage/binding-view.reel/binding-view.html b/js/stage/binding-view.reel/binding-view.html
index 91c9e397..01bc3ff7 100755
--- a/js/stage/binding-view.reel/binding-view.html
+++ b/js/stage/binding-view.reel/binding-view.html
@@ -15,7 +15,8 @@
15 "prototype": "js/stage/binding-view.reel", 15 "prototype": "js/stage/binding-view.reel",
16 "properties": { 16 "properties": {
17 "element": {"#": "bindingView"}, 17 "element": {"#": "bindingView"},
18 "hudRepeater": {"@": "hudRepeater"} 18 "hudRepeater": {"@": "hudRepeater"},
19 "objectsTray": {"@": "objectsTray"}
19 } 20 }
20 }, 21 },
21 "hudRepeater": { 22 "hudRepeater": {
diff --git a/js/stage/binding-view.reel/binding-view.js b/js/stage/binding-view.reel/binding-view.js
index ac9751e8..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,32 @@ 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); 48 }
49 },
50
51 _width :{ value: 0 },
52 width: {
53 get:function() {
54 return this._width;
55 },
56 set: function(val) {
57 if(this._width !== val) {
58 this._width = val;
59 this.needsDraw = true;
60 }
61 }
62 },
63
64 _height :{ value: 0 },
65 height: {
66 get:function() {
67 return this._height;
68 },
69 set: function(val) {
70 if(this._height !== val) {
71 this._height = val;
72 this.needsDraw = true;
73 }
50 } 74 }
51 }, 75 },
52 76
@@ -78,6 +102,10 @@ exports.BindingView = Montage.create(Component, {
78 value: null 102 value: null
79 }, 103 },
80 104
105 startConnector: {
106 value: null
107 },
108
81 //Public Objects 109 //Public Objects
82 hudRepeater: { value: null }, 110 hudRepeater: { value: null },
83 111
@@ -103,7 +131,6 @@ exports.BindingView = Montage.create(Component, {
103 this.application.ninja.objectsController.getPropertiesFromObject(this.selectedComponent, true).forEach(function(obj) { 131 this.application.ninja.objectsController.getPropertiesFromObject(this.selectedComponent, true).forEach(function(obj) {
104 this.componentsList[this.selectedComponent.identifier].properties.push({"title":obj}) 132 this.componentsList[this.selectedComponent.identifier].properties.push({"title":obj})
105 }.bind(this)); 133 }.bind(this));
106 console.log("components:",this.componentsList);
107 //Go through the loop and find every interacted object by bindings 134 //Go through the loop and find every interacted object by bindings
108 arrBindings.forEach(function(obj) { 135 arrBindings.forEach(function(obj) {
109 if(typeof (this.componentsList[obj.boundObject.identifier]) === "undefined") { 136 if(typeof (this.componentsList[obj.boundObject.identifier]) === "undefined") {
@@ -119,7 +146,6 @@ exports.BindingView = Montage.create(Component, {
119 for(var key in this.componentsList){ 146 for(var key in this.componentsList){
120 this.bindables.push(this.componentsList[key]); 147 this.bindables.push(this.componentsList[key]);
121 } 148 }
122 console.log(this.bindables);
123 // Get Bindings that exist; 149 // Get Bindings that exist;
124 150
125 151
@@ -178,23 +204,39 @@ exports.BindingView = Montage.create(Component, {
178 this._context = this.application.ninja.stage.drawingCanvas.getContext('2d'); 204 this._context = this.application.ninja.stage.drawingCanvas.getContext('2d');
179 this.application.ninja.stage._iframeContainer.addEventListener("scroll", this, false); 205 this.application.ninja.stage._iframeContainer.addEventListener("scroll", this, false);
180 this.element.addEventListener("mousedown", this, false); 206 this.element.addEventListener("mousedown", this, false);
207 this.element.addEventListener("mousemove", this, false);
181 } 208 }
182 }, 209 },
183 210
184 draw: { 211 draw: {
185 value: function() { 212 value: function() {
213
214 this.element.style.width = this.width + "px";
215 this.element.style.height = this.height + "px";
186 if(this.selectedComponent !== null) { 216 if(this.selectedComponent !== null) {
187 this.canvas.width = this.application.ninja.stage.drawingCanvas.offsetWidth; 217 this.canvas.width = this.application.ninja.stage.drawingCanvas.offsetWidth;
188 this.canvas.height = this.application.ninja.stage.drawingCanvas.offsetHeight; 218 this.canvas.height = this.application.ninja.stage.drawingCanvas.offsetHeight;
189 this.clearCanvas(); 219 this.clearCanvas();
190 for(var i= 0; i < this.hudRepeater.childComponents.length; i++) { 220 for(var i= 0; i < this.hudRepeater.childComponents.length; i++) {
191