aboutsummaryrefslogtreecommitdiff
path: root/js/stage
diff options
context:
space:
mode:
authorArmen Kesablyan2012-06-27 15:38:33 -0700
committerArmen Kesablyan2012-06-27 15:38:33 -0700
commit8eb74d31d3c9ac60d48312d8774fd02cad0c77af (patch)
treeae79629cedf9f683d77749a25988060ab9623216 /js/stage
parentec6759f9821a5647905617e3992fdda1cea390ef (diff)
parent61a41e74154715b0b42a429158fa1f2a44d2eb9a (diff)
downloadninja-8eb74d31d3c9ac60d48312d8774fd02cad0c77af.tar.gz
Merge branch 'Bindables_GIO' of https://github.com/ericguzman/ninja-internal
Diffstat (limited to 'js/stage')
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud.reel/binding-hud.css24
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud.reel/binding-hud.js46
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.html6
3 files changed, 56 insertions, 20 deletions
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 680f9183..5818eca8 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
@@ -6,14 +6,12 @@
6 6
7.bindingHud { 7.bindingHud {
8 position: absolute; 8 position: absolute;
9 background: rgba(0, 0, 0, 0.85); 9 background: rgba(24, 24, 24, 0.85);
10 /*padding: 0px;*/
11 color: #C4C4C4; 10 color: #C4C4C4;
12 font-size: 11px; 11 font-size: 11px;
13 box-shadow: inset 0px 0px 0px 0px #CCC; 12 box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.61);
14 border-radius: 6px; 13 border-radius: 6px;
15 padding: 3px 1px 1px; 14 padding: 3px 8px;
16 border:1px solid #000;
17 text-shadow: 1px 1px 0px #000; 15 text-shadow: 1px 1px 0px #000;
18} 16}
19 17
@@ -58,35 +56,35 @@
58 56
59.bindingHud .hudOption .connectorBubble { 57.bindingHud .hudOption .connectorBubble {
60 position: absolute; 58 position: absolute;
61 right: 5px; 59 right: 2px;
62 top: 3px; 60 top: 3px;
63 border-radius: 50%; 61 border-radius: 50%;
64 width: 10px; 62 width: 10px;
65 height: 10px; 63 height: 10px;
66 border-left: 0px; 64 border-left: 0px;
67 display: block; 65 display: block;
68 background-color: #313131; 66 background-color: #353535;
69 box-shadow: inset 0px 2px 7px 1px #0F0F0F, 0 1px #424242; 67 box-shadow: inset 0px 2px 3px 1px #222, 0 1px #666;
70 68
71} 69}
72 70
73.splitter.scrollArea { 71.splitter.scrollArea {
74 background-color: transparent; 72 background-color: transparent;
75 background-size: 12%; 73 background-size: 10%;
76 background-position-y: 2px; 74 background-position-y: 2px;
77 display: none; 75 display: none;
78 height:11px; 76 height:11px;
79 text-align: center; 77 text-align: center;
80} 78}
81.splitter.scrollAreaTop { 79.splitter.scrollAreaTop {
82 border-top: 1px solid #353535; 80 border-bottom: 1px solid #141414;
83 box-shadow: 0 -1px 0 0 #141414; 81 box-shadow: 0 1px 0 0 #525252;
84} 82}
85.splitter.scrollAreaBottom { 83.splitter.scrollAreaBottom {
86 -webkit-transform: rotate(180deg); 84 -webkit-transform: rotate(180deg);
87 border-top-left-radius: 6px; 85 border-top-left-radius: 6px;
88 border-top-right-radius: 6px; 86 border-top-right-radius: 6px;
89 border-bottom: 1px solid #353535; 87 border-bottom: 1px solid #525252;
90 box-shadow: 0 1px 0 0 #141414; 88 box-shadow: 0 1px 0 0 #141414;
91 margin-top: 4px; 89 margin-top: 4px;
92} 90}
@@ -95,7 +93,7 @@
95 opacity: 0.5; 93 opacity: 0.5;
96} 94}
97.splitter.scrollArea:hover:not(.disabled) { 95.splitter.scrollArea:hover:not(.disabled) {
98 background-color: #252525; 96 background-color: #303030;
99} 97}
100 98
101 99
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 85e4b87b..6b802cb0 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
@@ -45,7 +45,10 @@ exports.BindingHud = Montage.create(Component, {
45 optionsRepeater: { 45 optionsRepeater: {
46 value: null 46 value: null
47 }, 47 },
48 48 panelData : {
49 value: null,
50 serializable: true
51 },
49 _userComponent: { value: null }, 52 _userComponent: { value: null },
50 userComponent: { 53 userComponent: {
51 get: function() { 54 get: function() {
@@ -59,7 +62,7 @@ exports.BindingHud = Montage.create(Component, {
59 isOffStage, icon, iconOffsets; 62 isOffStage, icon, iconOffsets;
60 63
61 this._userComponent = val; 64 this._userComponent = val;
62 this.properties = controller.getPropertiesFromObject(val, true); 65 this.properties = this.getPropertyList(val); //controller.getPropertiesFromObject(val, true);
63 66
64 controller.getObjectBindings(this.userComponent).forEach(function(obj) { 67 controller.getObjectBindings(this.userComponent).forEach(function(obj) {
65 this.boundProperties.push(obj.sourceObjectPropertyPath); 68 this.boundProperties.push(obj.sourceObjectPropertyPath);
@@ -79,6 +82,37 @@ exports.BindingHud = Montage.create(Component, {
79 } 82 }
80 }, 83 },
81 84
85 getPropertyList : {
86 value: function(component) {
87 var props = this.application.ninja.objectsController.getPropertiesFromObject(component, true);
88
89 var objectName, promotedProperties;
90
91 if(this.userComponent._montage_metadata) {
92 objectName = this.userComponent._montage_metadata.objectName;
93
94 if(this.panelData && this.panelData[objectName + 'Pi']) {
95
96 promotedProperties = this.panelData[objectName + 'Pi'][0].Section.map(function(item) {
97 return item[0].prop;
98 });
99
100 //// Remove promoted properties from current position in array
101 props = props.filter(function(prop) {
102 return promotedProperties.indexOf(prop) === -1;
103 });
104
105 //// Add them at the top
106
107 props = promotedProperties.concat(props);
108
109 }
110 }
111
112 return props;
113 }
114 },
115
82 properties: { value: [] }, 116 properties: { value: [] },
83 117
84 _isResizing: { 118 _isResizing: {
@@ -249,11 +283,11 @@ exports.BindingHud = Montage.create(Component, {
249 if(direction === "down") { 283 if(direction === "down") {
250 this.scrollInterval = setInterval(function() { 284 this.scrollInterval = setInterval(function() {
251 this.optionsRepeater.element.scrollTop += 3; 285 this.optionsRepeater.element.scrollTop += 3;
252 }.bind(this), 50); 286 }.bind(this), 20);
253 } else { 287 } else {
254 this.scrollInterval = setInterval(function() { 288 this.scrollInterval = setInterval(function() {
255 this.optionsRepeater.element.scrollTop -= 3; 289 this.optionsRepeater.element.scrollTop -= 3;
256 }.bind(this), 50); 290 }.bind(this), 20);
257 } 291 }
258 } 292 }
259 } 293 }
@@ -268,11 +302,11 @@ exports.BindingHud = Montage.create(Component, {
268 //e._event.target.parentElement.controller.currentScrollDirection = "down"; 302 //e._event.target.parentElement.controller.currentScrollDirection = "down";
269 this.scrollInterval = setInterval(function() { 303 this.scrollInterval = setInterval(function() {
270 self.optionsRepeater.element.scrollTop += 3; 304 self.optionsRepeater.element.scrollTop += 3;
271 }, 50); 305 }, 20);
272 } else { 306 } else {
273 this.scrollInterval = setInterval(function() { 307 this.scrollInterval = setInterval(function() {
274 self.optionsRepeater.element.scrollTop -= 3; 308 self.optionsRepeater.element.scrollTop -= 3;
275 }, 50); 309 }, 20);
276 } 310 }
277 } 311 }
278 } 312 }
diff --git a/js/stage/binding-view.reel/binding-view.html b/js/stage/binding-view.reel/binding-view.html
index 9eb338d8..b6c5ff40 100755
--- a/js/stage/binding-view.reel/binding-view.html
+++ b/js/stage/binding-view.reel/binding-view.html
@@ -37,7 +37,8 @@
37 "hud": { 37 "hud": {
38 "prototype": "js/stage/binding-view.reel/binding-hud.reel", 38 "prototype": "js/stage/binding-view.reel/binding-hud.reel",
39 "properties": { 39 "properties": {
40 "element": {"#" : "hud"} 40 "element": {"#" : "hud"},
41 "panelData": {"@": "panelData"}
41 }, 42 },