diff options
Diffstat (limited to 'js/stage/binding-view.reel/binding-hud.reel/binding-hud.js')
-rwxr-xr-x | js/stage/binding-view.reel/binding-hud.reel/binding-hud.js | 63 |
1 files changed, 52 insertions, 11 deletions
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 9918b06d..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); |
@@ -73,17 +76,43 @@ exports.BindingHud = Montage.create(Component, { | |||
73 | this.title = icon.name; | 76 | this.title = icon.name; |
74 | this.x = iconOffsets.x; | 77 | this.x = iconOffsets.x; |
75 | this.y = iconOffsets.y - 80; | 78 | this.y = iconOffsets.y - 80; |
76 | } else { | ||
77 | this.title = val.identifier; | ||
78 | this.x = val.element.offsetLeft; | ||
79 | this.y = val.element.offsetTop; | ||
80 | } | 79 | } |
81 | |||
82 | this.needsDraw = true; | 80 | this.needsDraw = true; |
83 | 81 | ||
84 | } | 82 | } |
85 | }, | 83 | }, |
86 | 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 | |||
87 | properties: { value: [] }, | 116 | properties: { value: [] }, |
88 | 117 | ||
89 | _isResizing: { | 118 | _isResizing: { |
@@ -202,6 +231,12 @@ exports.BindingHud = Montage.create(Component, { | |||
202 | this.scrollUp.style.display = "block"; | 231 | this.scrollUp.style.display = "block"; |
203 | this.scrollDown.style.display = "block"; | 232 | this.scrollDown.style.display = "block"; |
204 | } | 233 | } |
234 | var isOffStage = this.application.ninja.objectsController.isOffStageObject(this.userComponent); | ||
235 | if(!isOffStage) { | ||
236 | this.title = this.userComponent.identifier; | ||
237 | this.x = this.userComponent.element.offsetLeft; | ||
238 | this.y = this.userComponent.element.offsetTop; | ||
239 | } | ||
205 | } | 240 | } |
206 | }, | 241 | }, |
207 | 242 | ||
@@ -248,11 +283,11 @@ exports.BindingHud = Montage.create(Component, { | |||
248 | if(direction === "down") { | 283 | if(direction === "down") { |
249 | this.scrollInterval = setInterval(function() { | 284 | this.scrollInterval = setInterval(function() { |
250 | this.optionsRepeater.element.scrollTop += 3; | 285 | this.optionsRepeater.element.scrollTop += 3; |
251 | }.bind(this), 50); | 286 | }.bind(this), 20); |
252 | } else { | 287 | } else { |
253 | this.scrollInterval = setInterval(function() { | 288 | this.scrollInterval = setInterval(function() { |
254 | this.optionsRepeater.element.scrollTop -= 3; | 289 | this.optionsRepeater.element.scrollTop -= 3; |
255 | }.bind(this), 50); | 290 | }.bind(this), 20); |
256 | } | 291 | } |
257 | } | 292 | } |
258 | } | 293 | } |
@@ -267,11 +302,11 @@ exports.BindingHud = Montage.create(Component, { | |||
267 | //e._event.target.parentElement.controller.currentScrollDirection = "down"; | 302 | //e._event.target.parentElement.controller.currentScrollDirection = "down"; |
268 | this.scrollInterval = setInterval(function() { | 303 | this.scrollInterval = setInterval(function() { |
269 | self.optionsRepeater.element.scrollTop += 3; | 304 | self.optionsRepeater.element.scrollTop += 3; |
270 | }, 50); | 305 | }, 20); |
271 | } else { | 306 | } else { |
272 | this.scrollInterval = setInterval(function() { | 307 | this.scrollInterval = setInterval(function() { |
273 | self.optionsRepeater.element.scrollTop -= 3; | 308 | self.optionsRepeater.element.scrollTop -= 3; |
274 | }, 50); | 309 | }, 20); |
275 | } | 310 | } |
276 | } | 311 | } |
277 | } | 312 | } |
@@ -289,6 +324,12 @@ exports.BindingHud = Montage.create(Component, { | |||
289 | } | 324 | } |
290 | }, | 325 | }, |
291 | 326 | ||
327 | willDraw: { | ||
328 | value: function() { | ||
329 | |||
330 | } | ||
331 | }, | ||
332 | |||
292 | draw: { | 333 | draw: { |
293 | value: function() { | 334 | value: function() { |
294 | this.titleElement.innerHTML = this.title; | 335 | this.titleElement.innerHTML = this.title; |