diff options
Diffstat (limited to 'js/stage')
-rwxr-xr-x | js/stage/binding-view.reel/binding-hud.reel/binding-hud.js | 44 | ||||
-rwxr-xr-x | js/stage/binding-view.reel/binding-view.js | 8 | ||||
-rw-r--r-- | js/stage/objects-tray.reel/objects-tray.html | 12 | ||||
-rw-r--r-- | js/stage/objects-tray.reel/objects-tray.js | 50 |
4 files changed, 101 insertions, 13 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 0893e8d8..dd88bef7 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 | |||
@@ -52,17 +52,35 @@ exports.BindingHud = Montage.create(Component, { | |||
52 | return this._userComponent; | 52 | return this._userComponent; |
53 | }, | 53 | }, |
54 | set: function(val) { | 54 | set: function(val) { |
55 | if (typeof(val) !== "undefined") { | 55 | if(!val) { return; } |
56 | this._userComponent = val; | 56 | |
57 | var controller = this.application.ninja.objectsController, | ||
58 | bindingView = this.parentComponent.parentComponent, | ||
59 | isOffStage, icon, iconOffsets; | ||
60 | |||
61 | this._userComponent = val; | ||
62 | this.properties = controller.getPropertiesFromObject(val, true); | ||
63 | |||
64 | controller.getObjectBindings(this.userComponent).forEach(function(obj) { | ||
65 | this.boundProperties.push(obj.sourceObjectPropertyPath); | ||
66 | }, this); | ||
67 | |||
68 | isOffStage = controller.isOffStageObject(val); | ||
69 | |||
70 | if(isOffStage) { | ||
71 | icon = bindingView.getOffStageIcon(val); | ||
72 | iconOffsets = this.getElementOffsetToParent(icon.element, bindingView.element); | ||
73 | this.title = icon.name; | ||
74 | this.x = iconOffsets.x; | ||
75 | this.y = iconOffsets.y - 80; | ||
76 | } else { | ||
57 | this.title = val.identifier; | 77 | this.title = val.identifier; |
58 | this.x = val.element.offsetLeft; | 78 | this.x = val.element.offsetLeft; |
59 | this.y = val.element.offsetTop; | 79 | this.y = val.element.offsetTop; |
60 | this.properties = this.application.ninja.objectsController.getPropertiesFromObject(val, true); | ||
61 | this.application.ninja.objectsController.getObjectBindings(this.userComponent).forEach(function(obj) { | ||
62 | this.boundProperties.push(obj.sourceObjectPropertyPath); | ||
63 | }.bind(this)); | ||
64 | this.needsDraw = true; | ||
65 | } | 80 | } |
81 | |||
82 | this.needsDraw = true; | ||
83 | |||
66 | } | 84 | } |
67 | }, | 85 | }, |
68 | 86 | ||
@@ -111,6 +129,18 @@ exports.BindingHud = Montage.create(Component, { | |||
111 | } | 129 | } |
112 | }, | 130 | }, |
113 | 131 | ||
132 | getElementOffsetToParent : { | ||
133 | value: function(element, parent) { | ||
134 | var nodeToPage = webkitConvertPointFromNodeToPage(element, new WebKitPoint(0, 0)), | ||
135 | parentToPage = webkitConvertPointFromNodeToPage(parent, new WebKitPoint(0, 0)); | ||
136 | |||
137 | return { | ||
138 | x : nodeToPage.x - parentToPage.x, | ||
139 | y : nodeToPage.y - parentToPage.y | ||
140 | } | ||
141 | } | ||
142 | }, | ||
143 | |||
114 | _x: { | 144 | _x: { |
115 | value: 20 | 145 | value: 20 |
116 | }, | 146 | }, |
diff --git a/js/stage/binding-view.reel/binding-view.js b/js/stage/binding-view.reel/binding-view.js index 1d5ef4db..505dd074 100755 --- a/js/stage/binding-view.reel/binding-view.js +++ b/js/stage/binding-view.reel/binding-view.js | |||
@@ -255,6 +255,14 @@ exports.BindingView = Montage.create(Component, { | |||
255 | value:null | 255 | value:null |
256 | }, | 256 | }, |
257 | 257 | ||
258 | getOffStageIcon : { | ||
259 | value: function(object) { | ||
260 | var index = this.objectsTray.offStageObjectsController.organizedObjects.indexOf(object); | ||
261 | |||
262 | return this.objectsTray.iconsRepetition.childComponents[index]; | ||
263 | } | ||
264 | }, | ||
265 | |||
258 | 266 | ||
259 | // When mouse pointer is on a hud this value will be set to true | 267 | // When mouse pointer is on a hud this value will be set to true |
260 | _mouseOverHud: { value: false }, | 268 | _mouseOverHud: { value: false }, |
diff --git a/js/stage/objects-tray.reel/objects-tray.html b/js/stage/objects-tray.reel/objects-tray.html index 0fece3fe..901f3e58 100644 --- a/js/stage/objects-tray.reel/objects-tray.html +++ b/js/stage/objects-tray.reel/objects-tray.html | |||
@@ -14,7 +14,9 @@ | |||
14 | "owner": { | 14 | "owner": { |
15 | "prototype": "js/stage/objects-tray.reel", | 15 | "prototype": "js/stage/objects-tray.reel", |
16 | "properties": { | 16 | "properties": { |
17 | "element": {"#": "objects-tray"} | 17 | "element": {"#": "objects-tray"}, |
18 | "iconsRepetition": {"@": "repetition" }, | ||
19 | "offStageObjectsController": {"@": "arrayController"} | ||
18 | } | 20 | } |
19 | }, | 21 | }, |
20 | "repetition" : { | 22 | "repetition" : { |
@@ -38,7 +40,13 @@ | |||
38 | "bindings": { | 40 | "bindings": { |
39 | "sourceObject" : {"<-": "@repetition.objectAtCurrentIteration"}, | 41 | "sourceObject" : {"<-": "@repetition.objectAtCurrentIteration"}, |
40 | "identifier" : {"<-": "@repetition.objectAtCurrentIteration.identifier"} | 42 | "identifier" : {"<-": "@repetition.objectAtCurrentIteration.identifier"} |
41 | } | 43 | }, |
44 | "listeners": [ | ||
45 | { | ||
46 | "type": "click", | ||
47 | "listener": {"@": "owner"} | ||
48 | } | ||
49 | ] | ||
42 | } | 50 | } |
43 | 51 | ||
44 | } | 52 | } |
diff --git a/js/stage/objects-tray.reel/objects-tray.js b/js/stage/objects-tray.reel/objects-tray.js index 190abf57..75ece4c3 100644 --- a/js/stage/objects-tray.reel/objects-tray.js +++ b/js/stage/objects-tray.reel/objects-tray.js | |||
@@ -15,6 +15,26 @@ exports.ObjectsTray = Montage.create(Component, { | |||
15 | hideClass : { value: 'hide-objects-tray'}, | 15 | hideClass : { value: 'hide-objects-tray'}, |
16 | _empty : { value: null }, | 16 | _empty : { value: null }, |
17 | _workspaceMode : { value: null }, | 17 | _workspaceMode : { value: null }, |
18 | |||
19 | iconsRepetition : { | ||
20 | value: null | ||
21 | }, | ||
22 | offStageObjectsController : { | ||
23 | value: null | ||
24 | }, | ||
25 | |||
26 | _showAllObjects : { value: null }, | ||
27 | showAllObjects : { | ||
28 | get : function() { return this._showAllObjects; }, | ||
29 | set : function(value) { | ||
30 | if(value === this._showAllObjects) { return; } | ||
31 | |||
32 | this._showAllObjects = value; | ||
33 | |||
34 | this.needsDraw = true; | ||
35 | } | ||
36 | }, | ||
37 | |||
18 | workspaceMode : { | 38 | workspaceMode : { |
19 | get : function() { return this._workspaceMode; }, | 39 | get : function() { return this._workspaceMode; }, |
20 | set : function(value) { | 40 | set : function(value) { |
@@ -43,6 +63,16 @@ exports.ObjectsTray = Montage.create(Component, { | |||
43 | } | 63 | } |
44 | }, | 64 | }, |
45 | 65 | ||
66 | offStageObjectFilter : { | ||
67 | value: function(obj) { | ||
68 | if(this.showAllObjects) { | ||
69 | return true; | ||
70 | } | ||
71 | |||
72 | return this.application.ninja.objectsController.isOffStageObject(obj); | ||
73 | } | ||
74 | }, | ||
75 | |||
46 | _hide : { value: null }, | 76 | _hide : { value: null }, |
47 | hide : { | 77 | hide : { |
48 | get : function() { return this._hide; }, | 78 | get : function() { return this._hide; }, |
@@ -55,10 +85,19 @@ exports.ObjectsTray = Montage.create(Component, { | |||
55 | } | 85 | } |
56 | }, | 86 | }, |
57 | 87 | ||
88 | displayHUDForObject : { | ||
89 | value: function(object) { | ||
90 | this.parentComponent.boundComponents.push(object); | ||
91 | } | ||
92 | }, | ||
93 | |||
94 | /* --------------------- | ||
95 | Draw Cycle | ||
96 | --------------------- */ | ||
58 | 97 | ||
59 | templateDidLoad: { | 98 | templateDidLoad: { |
60 | value: function() { | 99 | value: function() { |
61 | console.log('objects panel loaded'); | 100 | this.offStageObjectsController.filterFunction = this.offStageObjectFilter.bind(this); |
62 | } | 101 | } |
63 | }, | 102 | }, |
64 | 103 | ||
@@ -77,12 +116,15 @@ exports.ObjectsTray = Montage.create(Component, { | |||
77 | "oneway": true | 116 | "oneway": true |
78 | }); | 117 | }); |
79 | 118 | ||
119 | } | ||
120 | }, | ||
121 | willDraw : { | ||
122 | value: function() { | ||
80 | if(this.objects) { | 123 | if(this.objects) { |
81 | this.empty = !this.objects.length; | 124 | this._empty = !this.offStageObjectsController.organizedObjects.length; |
82 | } else { | 125 | } else { |
83 | this.empty = true; | 126 | this._empty = true; |
84 | } | 127 | } |
85 | |||
86 | } | 128 | } |