diff options
Diffstat (limited to 'js/panels/properties.reel')
4 files changed, 36 insertions, 26 deletions
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js index eb362796..84b0d589 100755 --- a/js/panels/properties.reel/properties.js +++ b/js/panels/properties.reel/properties.js | |||
@@ -48,6 +48,7 @@ exports.Properties = Montage.create(Component, { | |||
48 | value : function() { | 48 | value : function() { |
49 | this.eventManager.addEventListener("openDocument", this, false); | 49 | this.eventManager.addEventListener("openDocument", this, false); |
50 | this.eventManager.addEventListener("selectionChange", this, false); | 50 | this.eventManager.addEventListener("selectionChange", this, false); |
51 | this.eventManager.addEventListener("closeDocument", this, false); | ||
51 | 52 | ||
52 | // This will be a toggle option | 53 | // This will be a toggle option |
53 | if(this.application.ninja.appData.PILiveUpdate) { | 54 | if(this.application.ninja.appData.PILiveUpdate) { |
@@ -72,7 +73,13 @@ exports.Properties = Montage.create(Component, { | |||
72 | this.application.ninja.currentDocument.model.views.design.propertiesPanel = this; | 73 | this.application.ninja.currentDocument.model.views.design.propertiesPanel = this; |
73 | 74 | ||
74 | // Display the default document root PI | 75 | // Display the default document root PI |
75 | this.displayElementProperties(this.application.ninja.currentDocument.documentRoot); | 76 | this.displayElementProperties(this.application.ninja.currentDocument.model.documentRoot); |
77 | } | ||
78 | }, | ||
79 | |||
80 | handleCloseDocument: { | ||
81 | value: function(){ | ||
82 | this.clear(); | ||
76 | } | 83 | } |
77 | }, | 84 | }, |
78 | 85 | ||
@@ -82,13 +89,13 @@ exports.Properties = Montage.create(Component, { | |||
82 | handleBlur: { | 89 | handleBlur: { |
83 | value: function(event) { | 90 | value: function(event) { |
84 | 91 | ||
85 | if(event.target.id === "elementId") { | 92 | if(event.target === this.elementId.element) { |
86 | 93 | ||
87 | // Remove all white spaces from the id | 94 | // Remove all white spaces from the id |
88 | this.elementId.value = this.elementId.value.replace(/\s/g, ''); | 95 | this.elementId.value = this.elementId.value.replace(/\s/g, ''); |
89 | 96 | ||
90 | // Check if that id is in use | 97 | // Check if that id is in use |
91 | if(this.application.ninja.currentDocument._document.getElementById(this.elementId.value) !== null) { | 98 | if(this.application.ninja.currentDocument.model.views.design.document.getElementById(this.elementId.value) !== null) { |
92 | // TODO: Replace with Ninja Alert | 99 | // TODO: Replace with Ninja Alert |
93 | alert("The following ID: " + this.elementId.value + " is already in use"); | 100 | alert("The following ID: " + this.elementId.value + " is already in use"); |
94 | } | 101 | } |
@@ -97,13 +104,13 @@ exports.Properties = Montage.create(Component, { | |||
97 | // ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi"); | 104 | // ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, "Change", "pi"); |
98 | ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, this.application.ninja.selectedElements[0].id, "pi"); | 105 | ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "id", this.elementId.value, this.application.ninja.selectedElements[0].id, "pi"); |
99 | } else { | 106 | } else { |
100 | ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.id); | 107 | ElementsMediator.setAttribute(this.application.ninja.currentDocument.model.documentRoot, "id", this.elementId.value, "Change", "pi", this.application.ninja.currentDocument.model.documentRoot.elementModel.id); |
101 | } | 108 | } |
102 | } else if(event.target.id === "elementClass") { | 109 | } else if(event.target === this.elementClass.element) { |
103 | if(this.application.ninja.selectedElements.length) { | 110 | if(this.application.ninja.selectedElements.length) { |
104 | ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "class", this.elementClass.value, this.application.ninja.selectedElements[0].className, "pi"); | 111 | ElementsMediator.setAttribute(this.application.ninja.selectedElements[0], "class", this.elementClass.value, this.application.ninja.selectedElements[0].className, "pi"); |
105 | } else { | 112 | } else { |
106 | ElementsMediator.setAttribute(this.application.ninja.currentDocument.documentRoot, "class", this.elementClass.value, "Change", "pi", this.application.ninja.currentDocument.documentRoot.elementModel.elementClass); | 113 | ElementsMediator.setAttribute(this.application.ninja.currentDocument.model.documentRoot, "class", this.elementClass.value, "Change", "pi", this.application.ninja.currentDocument.model.documentRoot.elementModel.elementClass); |
107 | } | 114 | } |
108 | } | 115 | } |
109 | } | 116 | } |
@@ -128,7 +135,7 @@ exports.Properties = Montage.create(Component, { | |||
128 | value: function(event) { | 135 | value: function(event) { |
129 | // console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update | 136 | // console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update |
130 | if(event.detail.source && event.detail.source !== "pi") { | 137 | if(event.detail.source && event.detail.source !== "pi") { |
131 | var el = this.application.ninja.currentDocument.documentRoot; | 138 | var el = this.application.ninja.currentDocument.model.documentRoot; |
132 | if(this.application.ninja.selectedElements.length) { | 139 | if(this.application.ninja.selectedElements.length) { |
133 | el = this.application.ninja.selectedElements[0]; | 140 | el = this.application.ninja.selectedElements[0]; |
134 | } | 141 | } |
@@ -154,7 +161,7 @@ exports.Properties = Montage.create(Component, { | |||
154 | handleSelectionChange: { | 161 | handleSelectionChange: { |
155 | value: function(event) { | 162 | value: function(event) { |
156 | if(event.detail.isDocument) { | 163 | if(event.detail.isDocument) { |
157 | this.displayElementProperties(this.application.ninja.currentDocument.documentRoot); | 164 | this.displayElementProperties(this.application.ninja.currentDocument.model.documentRoot); |
158 | } else { | 165 | } else { |
159 | if(this.application.ninja.selectedElements.length === 1) { | 166 | if(this.application.ninja.selectedElements.length === 1) { |
160 | this.displayElementProperties(this.application.ninja.selectedElements[0]); | 167 | this.displayElementProperties(this.application.ninja.selectedElements[0]); |
@@ -172,6 +179,7 @@ exports.Properties = Montage.create(Component, { | |||
172 | this.elementId.value = ""; | 179 | this.elementId.value = ""; |
173 | this.elementClass.value = ""; | 180 | this.elementClass.value = ""; |
174 | this.customPi = null; | 181 | this.customPi = null; |
182 | this.customSections = []; | ||
175 | } | 183 | } |
176 | }, | 184 | }, |
177 | 185 | ||
@@ -211,27 +219,29 @@ exports.Properties = Montage.create(Component, { | |||
211 | controls = this.customSections[n].content.controls; | 219 | controls = this.customSections[n].content.controls; |
212 | if(controls["colorSelect"]) { | 220 | if(controls["colorSelect"]) { |
213 | controls["colorSelect"].destroy(); | 221 | controls["colorSelect"].destroy(); |
214 | } else if(controls["stageBackground"]) { | 222 | } else if(controls["background"]) { |
215 | controls["stageBackground"].destroy(); | 223 | controls["background"].destroy(); |
216 | } | 224 | } |
217 | } | 225 | } |
218 | 226 | ||
219 | this.customPi = el.elementModel.pi; | 227 | this.customPi = el.elementModel.pi; |
220 | this.displayCustomProperties(el, el.elementModel.pi); | 228 | this.displayCustomProperties(el, el.elementModel.pi); |
221 | } | ||
222 | 229 | ||
223 | // Root element color chip | 230 | // Root element color chip |
224 | if(isRoot) { | 231 | if(isRoot) { |
225 | var backgroundChip = this.customSections[0].content.controls["background"]; | 232 | var backgroundChip = this.customSections[0].content.controls["background"]; |
226 | var rootBackgroundColor = ElementsMediator.getProperty(el, "background"); | 233 | var rootBackgroundColor = ElementsMediator.getProperty(el, "background"); |
227 | 234 | ||
228 | if(rootBackgroundColor) { | 235 | if(rootBackgroundColor) { |
229 | backgroundChip.color = rootBackgroundColor; | 236 | backgroundChip.color = rootBackgroundColor; |
230 | } else { | 237 | } else { |
231 | backgroundChip.color = null; | 238 | backgroundChip.color = null; |
239 | } | ||
232 | } | 240 | } |
233 | } | 241 | } |
234 | 242 | ||
243 | |||
244 | |||
235 | var previousInput = this.application.ninja.colorController.colorModel.input; | 245 | var previousInput = this.application.ninja.colorController.colorModel.input; |
236 | customPI = PiData[this.customPi]; | 246 | customPI = PiData[this.customPi]; |
237 | // Get all the custom section for the custom PI | 247 | // Get all the custom section for the custom PI |
diff --git a/js/panels/properties.reel/sections/custom.reel/custom.js b/js/panels/properties.reel/sections/custom.reel/custom.js index 49b4414e..ae408f11 100755 --- a/js/panels/properties.reel/sections/custom.reel/custom.js +++ b/js/panels/properties.reel/sections/custom.reel/custom.js | |||
@@ -116,7 +116,7 @@ exports.CustomSection = Montage.create(Component, { | |||
116 | value: function(event) { | 116 | value: function(event) { |
117 | // Change the stage color for now | 117 | // Change the stage color for now |
118 | //console.log(this, event); | 118 | //console.log(this, event); |
119 | ElementsMediator.setProperty([this.application.ninja.currentDocument.documentRoot], this.id, [event._event.color.css], "Change", "pi", ''); | 119 | ElementsMediator.setProperty([this.application.ninja.currentDocument.model.documentRoot], this.id, [event._event.color.css], "Change", "pi", ''); |
120 | /* | 120 | /* |
121 | var propEvent = document.createEvent("CustomEvent"); | 121 | var propEvent = document.createEvent("CustomEvent"); |
122 | propEvent.initEvent("propertyChange", true, true); | 122 | propEvent.initEvent("propertyChange", true, true); |
@@ -400,7 +400,7 @@ exports.CustomSection = Montage.create(Component, { | |||
400 | this.controls[aField.id] = obj; | 400 | this.controls[aField.id] = obj; |
401 | 401 | ||
402 | // TODO - Hack for now to reference the color select object to unregister color chips | 402 | // TODO - Hack for now to reference the color select object to unregister color chips |
403 | this.controls["stageBackground"] = obj; | 403 | this.controls["background"] = obj; |
404 | 404 | ||
405 | return obj; | 405 | return obj; |
406 | } | 406 | } |
diff --git a/js/panels/properties.reel/sections/position-size.reel/position-size.js b/js/panels/properties.reel/sections/position-size.reel/position-size.js index 10e084be..7c24e02a 100755 --- a/js/panels/properties.reel/sections/position-size.reel/position-size.js +++ b/js/panels/properties.reel/sections/position-size.reel/position-size.js | |||
@@ -158,7 +158,7 @@ exports.PositionSize = Montage.create(Component, { | |||
158 | if(!event.wasSetByCode) { | 158 | if(!event.wasSetByCode) { |
159 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | 159 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; |
160 | 160 | ||
161 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; | 161 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.model.documentRoot]; |
162 | 162 | ||
163 | if(this.bindButton.pressed) { | 163 | if(this.bindButton.pressed) { |
164 | 164 | ||
@@ -183,7 +183,7 @@ exports.PositionSize = Montage.create(Component, { | |||
183 | if(!event.wasSetByCode) { | 183 | if(!event.wasSetByCode) { |
184 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | 184 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; |
185 | 185 | ||
186 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; | 186 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.model.documentRoot]; |
187 | 187 | ||
188 | if(this.bindButton.pressed) { | 188 | if(this.bindButton.pressed) { |
189 | 189 | ||
@@ -231,7 +231,7 @@ exports.PositionSize = Montage.create(Component, { | |||
231 | 231 | ||
232 | if(!this.savedPosition) this.savedPosition = this.heightSize; | 232 | if(!this.savedPosition) this.savedPosition |