diff options
Diffstat (limited to 'js')
-rwxr-xr-x | js/stage/binding-view.reel/binding-hud.reel/binding-hud.js | 70 | ||||
-rwxr-xr-x | js/stage/binding-view.reel/binding-view.html | 2 | ||||
-rwxr-xr-x | js/stage/binding-view.reel/binding-view.js | 26 | ||||
-rw-r--r-- | js/tools/bindingTool.js | 18 |
4 files changed, 55 insertions, 61 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 6b802cb0..58cf197f 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 | |||
@@ -10,6 +10,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
10 | */ | 10 | */ |
11 | var Montage = require("montage/core/core").Montage, | 11 | var Montage = require("montage/core/core").Montage, |
12 | Component = require("montage/ui/component").Component; | 12 | Component = require("montage/ui/component").Component; |
13 | var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; | ||
13 | 14 | ||
14 | exports.BindingHud = Montage.create(Component, { | 15 | exports.BindingHud = Montage.create(Component, { |
15 | scrollUp: { | 16 | scrollUp: { |
@@ -49,10 +50,10 @@ exports.BindingHud = Montage.create(Component, { | |||
49 | value: null, | 50 | value: null, |
50 | serializable: true | 51 | serializable: true |
51 | }, | 52 | }, |
52 | _userComponent: { value: null }, | 53 | _userElement: { value: null }, |
53 | userComponent: { | 54 | userElement: { |
54 | get: function() { | 55 | get: function() { |
55 | return this._userComponent; | 56 | return this._userElement; |
56 | }, | 57 | }, |
57 | set: function(val) { | 58 | set: function(val) { |
58 | if(!val) { return; } | 59 | if(!val) { return; } |
@@ -61,14 +62,14 @@ exports.BindingHud = Montage.create(Component, { | |||
61 | bindingView = this.parentComponent.parentComponent, | 62 | bindingView = this.parentComponent.parentComponent, |
62 | isOffStage, icon, iconOffsets; | 63 | isOffStage, icon, iconOffsets; |
63 | 64 | ||
64 | this._userComponent = val; | 65 | this._userElement = val; |
65 | this.properties = this.getPropertyList(val); //controller.getPropertiesFromObject(val, true); | 66 | this.properties = this.getPropertyList(val.controller); //controller.getPropertiesFromObject(val, true); |
66 | 67 | ||
67 | controller.getObjectBindings(this.userComponent).forEach(function(obj) { | 68 | controller.getObjectBindings(this._userElement.controller).forEach(function(obj) { |
68 | this.boundProperties.push(obj.sourceObjectPropertyPath); | 69 | this.boundProperties.push(obj.sourceObjectPropertyPath); |
69 | }, this); | 70 | }, this); |
70 | 71 | ||
71 | isOffStage = controller.isOffStageObject(val); | 72 | isOffStage = controller.isOffStageObject(val.controller); |
72 | 73 | ||
73 | if(isOffStage) { | 74 | if(isOffStage) { |
74 | icon = bindingView.getOffStageIcon(val); | 75 | icon = bindingView.getOffStageIcon(val); |
@@ -76,9 +77,14 @@ exports.BindingHud = Montage.create(Component, { | |||
76 | this.title = icon.name; | 77 | this.title = icon.name; |
77 | this.x = iconOffsets.x; | 78 | this.x = iconOffsets.x; |
78 | this.y = iconOffsets.y - 80; | 79 | this.y = iconOffsets.y - 80; |
80 | } else { | ||
81 | this.title = this._userElement.controller.identifier; | ||
82 | this.x = this._userElement.offsetLeft; | ||
83 | this.y = this._userElement.offsetTop; | ||
84 | // this.x = parseInt(ElementsMediator.getProperty(val, "left")); | ||
85 | // this.y = parseInt(ElementsMediator.getProperty(val, "top")); | ||
79 | } | 86 | } |
80 | this.needsDraw = true; | 87 | this.needsDraw = true; |
81 | |||
82 | } | 88 | } |
83 | }, | 89 | }, |
84 | 90 | ||
@@ -88,8 +94,8 @@ exports.BindingHud = Montage.create(Component, { | |||
88 | 94 | ||
89 | var objectName, promotedProperties; | 95 | var objectName, promotedProperties; |
90 | 96 | ||
91 | if(this.userComponent._montage_metadata) { | 97 | if(this.userElement.controller._montage_metadata) { |
92 | objectName = this.userComponent._montage_metadata.objectName; | 98 | objectName = this.userElement.controller._montage_metadata.objectName; |
93 | 99 | ||
94 | if(this.panelData && this.panelData[objectName + 'Pi']) { | 100 | if(this.panelData && this.panelData[objectName + 'Pi']) { |
95 | 101 | ||
@@ -231,12 +237,6 @@ exports.BindingHud = Montage.create(Component, { | |||
231 | this.scrollUp.style.display = "block"; | 237 | this.scrollUp.style.display = "block"; |
232 | this.scrollDown.style.display = "block"; | 238 | this.scrollDown.style.display = "block"; |
233 | } | 239 | } |
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 | } | ||
240 | } | 240 | } |
241 | }, | 241 | }, |
242 | 242 | ||
@@ -295,22 +295,17 @@ exports.BindingHud = Montage.create(Component, { | |||
295 | 295 | ||
296 | handleMouseover: { | 296 | handleMouseover: { |
297 | value: function(e) { | 297 | value: function(e) { |
298 | |||
298 | if(this.scrollSpace < this.properties.length) { | 299 | if(this.scrollSpace < this.properties.length) { |
299 | if (this.scrollInterval === null) { | 300 | if (this.scrollInterval === null) { |
300 | if (e._event.target.classList.contains("scrollAreaBottom")) { | 301 | if (e._event.target.classList.contains("scrollAreaBottom")) { |
301 | self = e._event.target.parentElement.controller; | 302 | this.currentScrollDirection = "down"; |
302 | //e._event.target.parentElement.controller.currentScrollDirection = "down"; | ||
303 | this.scrollInterval = setInterval(function() { | ||
304 | self.optionsRepeater.element.scrollTop += 3; | ||
305 | }, 20); | ||
306 | } else { | 303 | } else { |
307 | this.scrollInterval = setInterval(function() { | 304 | this.currentScrollDirection = "up"; |
308 | self.optionsRepeater.element.scrollTop -= 3; | ||
309 | }, 20); | ||
310 | } | 305 | } |
311 | } | 306 | } |
312 | } | 307 | } |
313 | //this.needsDraw = true; | 308 | this.needsDraw = true; |
314 | } | 309 | } |
315 | }, | 310 | }, |
316 | 311 | ||
@@ -324,25 +319,24 @@ exports.BindingHud = Montage.create(Component, { | |||
324 | } | 319 | } |
325 | }, | 320 | }, |
326 | 321 | ||
327 | willDraw: { | 322 | draw: { |
328 | value: function() { | 323 | value: function() { |
329 | 324 | ||
330 | } | 325 | if(this.currentScrollDirection !== null) { |
331 | }, | 326 | this.scrollInterval = setInterval(function() { |
327 | if(this.currentScrollDirection === "down") { | ||
328 | this.optionsRepeater.element.scrollTop += 3; | ||
329 | } else { | ||
330 | this.optionsRepeater.element.scrollTop -= 3; | ||
331 | } | ||
332 | }.bind(this), 20); | ||
333 | } else { | ||
334 | clearInterval(this.scrollInterval); | ||
335 | } | ||
332 | 336 | ||
333 | draw: { | ||
334 | value: function() { | ||
335 | this.titleElement.innerHTML = this.title; | 337 | this.titleElement.innerHTML = this.title; |
336 | this.element.style.top = (this.y + this._resizedY) + "px"; | 338 | this.element.style.top = (this.y + this._resizedY) + "px"; |
337 | this.element.style.left = (this.x + this._resizedX) + "px"; | 339 | this.element.style.left = (this.x + this._resizedX) + "px"; |
338 | |||
339 | // if(this.currentScrollDirection !== null) { | ||
340 | // if(this.currentScrollDirection === "up") { | ||
341 | // this.optionsRepeater.element.scrollTop -= 18; | ||
342 | // } else { | ||
343 | // this.optionsRepeater.element.scrollTop += 18; | ||
344 | // } | ||
345 | // } | ||
346 | } | 340 | } |
347 | }, | 341 | }, |
348 | didDraw: { | 342 | didDraw: { |
diff --git a/js/stage/binding-view.reel/binding-view.html b/js/stage/binding-view.reel/binding-view.html index b6c5ff40..c8da1e7e 100755 --- a/js/stage/binding-view.reel/binding-view.html +++ b/js/stage/binding-view.reel/binding-view.html | |||
@@ -41,7 +41,7 @@ | |||
41 | "panelData": {"@": "panelData"} | 41 | "panelData": {"@": "panelData"} |
42 | }, | 42 | }, |
43 | "bindings": { | 43 | "bindings": { |
44 | "userComponent": {"<-": "@hudRepeater.objectAtCurrentIteration"} | 44 | "userElement": {"<-": "@hudRepeater.objectAtCurrentIteration"} |
45 | }, | 45 | }, |
46 | "listeners": [ | 46 | "listeners": [ |
47 | { | 47 | { |
diff --git a/js/stage/binding-view.reel/binding-view.js b/js/stage/binding-view.reel/binding-view.js index 94c84d02..ee44758c 100755 --- a/js/stage/binding-view.reel/binding-view.js +++ b/js/stage/binding-view.reel/binding-view.js | |||
@@ -97,20 +97,20 @@ exports.BindingView = Montage.create(Component, { | |||
97 | } | 97 | } |
98 | }, | 98 | }, |
99 | 99 | ||
100 | _selectedComponent: { value: null }, | 100 | _selectedElement: { value: null }, |
101 | selectedComponent: { | 101 | selectedElement: { |
102 | get: function() { | 102 | get: function() { |
103 | return this._selectedComponent; | 103 | return this._selectedElement; |
104 | }, | 104 | }, |
105 | set: function(val) { | 105 | set: function(val) { |
106 | this.boundComponents = []; | 106 | this.boundComponents = []; |
107 | if(this._selectedComponent !== val) { | 107 | if(this._selectedElement !== val) { |
108 | this.clearCanvas(); | 108 | this.clearCanvas(); |