aboutsummaryrefslogtreecommitdiff
path: root/js/panels/properties.reel
diff options
context:
space:
mode:
authorJon Reid2012-06-15 10:10:41 -0700
committerJon Reid2012-06-15 10:10:41 -0700
commit526ac54f73d53e1e2a3d6a4dbf4f9992c143baf7 (patch)
tree65939e59615aaa10a7db77211e71616ad531bd0e /js/panels/properties.reel
parentb5b760ee82e5cc4da176914983a6002cbf86c11a (diff)
parent5ee0c89fa0c7acc280ff3b884767e8513fd0b315 (diff)
downloadninja-526ac54f73d53e1e2a3d6a4dbf4f9992c143baf7.tar.gz
Merge remote-tracking branch 'ninja-internal/master' into test-merge
Conflicts: js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
Diffstat (limited to 'js/panels/properties.reel')
-rwxr-xr-xjs/panels/properties.reel/properties.html9
-rwxr-xr-xjs/panels/properties.reel/properties.js93
-rwxr-xr-xjs/panels/properties.reel/section.reel/section.js1
-rwxr-xr-xjs/panels/properties.reel/sections/custom-rows/single-row.reel/single-row.js4
-rwxr-xr-xjs/panels/properties.reel/sections/custom.reel/custom.js6
-rwxr-xr-xjs/panels/properties.reel/sections/position-size.reel/position-size.html25
-rwxr-xr-xjs/panels/properties.reel/sections/position-size.reel/position-size.js81
-rwxr-xr-xjs/panels/properties.reel/sections/three-d-view.reel/three-d-view.html2
-rwxr-xr-xjs/panels/properties.reel/sections/three-d-view.reel/three-d-view.js121
9 files changed, 289 insertions, 53 deletions
diff --git a/js/panels/properties.reel/properties.html b/js/panels/properties.reel/properties.html
index b9aa206b..a737bd39 100755
--- a/js/panels/properties.reel/properties.html
+++ b/js/panels/properties.reel/properties.html
@@ -13,24 +13,21 @@
13 "elementName": { 13 "elementName": {
14 "prototype": "montage/ui/textfield.reel", 14 "prototype": "montage/ui/textfield.reel",
15 "properties": { 15 "properties": {
16 "element": {"#": "elementName"}, 16 "element": {"#": "elementName"}
17 "readOnly": true
18 } 17 }
19 }, 18 },
20 19
21 "elementId": { 20 "elementId": {
22 "prototype": "montage/ui/textfield.reel", 21 "prototype": "montage/ui/textfield.reel",
23 "properties": { 22 "properties": {
24 "element": {"#": "elementId"}, 23 "element": {"#": "elementId"}
25 "readOnly": false
26 } 24 }
27 }, 25 },
28 26
29 "elementClass": { 27 "elementClass": {
30 "prototype": "montage/ui/textfield.reel", 28 "prototype": "montage/ui/textfield.reel",
31 "properties": { 29 "properties": {
32 "element": {"#": "elementClass"}, 30 "element": {"#": "elementClass"}
33 "readOnly": false
34 } 31 }
35 }, 32 },
36 33
diff --git a/js/panels/properties.reel/properties.js b/js/panels/properties.reel/properties.js
index 700b93f3..4aaeda93 100755
--- a/js/panels/properties.reel/properties.js
+++ b/js/panels/properties.reel/properties.js
@@ -43,15 +43,28 @@ exports.Properties = Montage.create(Component, {
43 }, 43 },
44 44
45 elementName: { 45 elementName: {
46 value: null 46 value: null,
47 serializable: true
47 }, 48 },
48 49
49 elementId: { 50 elementId: {
50 value: null 51 value: null,
52 serializable: true
51 }, 53 },
52 54
53 elementClass: { 55 elementClass: {
54 value: null 56 value: null,
57 serializable: true
58 },
59
60 positionSize: {
61 value: null,
62 serializable: true
63 },
64
65 threeD: {
66 value: null,
67 serializable: true
55 }, 68 },
56 69
57 customSections: { 70 customSections: {
@@ -144,6 +157,7 @@ exports.Properties = Montage.create(Component, {
144 157
145 handleElementChange: { 158 handleElementChange: {
146 value: function(event) { 159 value: function(event) {
160 var l, t, h, w, lvu, tvu, hvu, wvu;
147// console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update 161// console.log("Element Change PI ", event.detail.source); // If the event comes from the pi don't need to update
148 if(event.detail.source && event.detail.source !== "pi") { 162 if(event.detail.source && event.detail.source !== "pi") {
149 var el = this.application.ninja.currentDocument.model.documentRoot; 163 var el = this.application.ninja.currentDocument.model.documentRoot;
@@ -152,10 +166,24 @@ exports.Properties = Montage.create(Component, {
152 } 166 }
153 167
154 // TODO - This should only update the properties that were changed. 168 // TODO - This should only update the properties that were changed.
155 this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(el, "left")); 169 l = ElementsMediator.getProperty(el, "left");
156 this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(el, "top")); 170 t = ElementsMediator.getProperty(el, "top");
157 this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(el, "height")); 171 lvu = document.application.njUtils.getValueAndUnits(l);
158 this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(el, "width")); 172 tvu = document.application.njUtils.getValueAndUnits(t);
173 this.positionSize.leftUnits = lvu[1];
174 this.positionSize.leftPosition = lvu[0];
175 this.positionSize.topUnits = tvu[1];
176 this.positionSize.topPosition = tvu[0];
177
178 h = ElementsMediator.getProperty(el, "height");
179 w = ElementsMediator.getProperty(el, "width");
180 hvu = document.application.njUtils.getValueAndUnits(h);
181 wvu = document.application.njUtils.getValueAndUnits(w);
182
183 this.positionSize.heightUnits = hvu[1] || "px"; // canvas (and shapes) don't have units.
184 this.positionSize.heightSize = hvu[0];
185 this.positionSize.widthUnits = wvu[1] || "px";
186 this.positionSize.widthSize = wvu[0];
159 187
160 if(this.threeD.inGlobalMode) { 188 if(this.threeD.inGlobalMode) {
161 this.threeD.x3D = ElementsMediator.get3DProperty(el, "x3D"); 189 this.threeD.x3D = ElementsMediator.get3DProperty(el, "x3D");
@@ -210,7 +238,8 @@ exports.Properties = Montage.create(Component, {
210 238
211 displayElementProperties: { 239 displayElementProperties: {
212 value: function (el) { 240 value: function (el) {
213 var customPI, currentValue, isRoot = this.application.ninja.selectionController.isDocument; 241 var customPI, currentValue, isRoot = this.application.ninja.selectionController.isDocument,
242 l, t, h, w, lvu, tvu, hvu, wvu;
214 243
215 this.elementName.value = el.elementModel.selection; 244 this.elementName.value = el.elementModel.selection;
216 this.elementId.value = el.getAttribute("id") || ""; 245 this.elementId.value = el.getAttribute("id") || "";
@@ -220,11 +249,24 @@ exports.Properties = Montage.create(Component, {
220 this.threeD.disableTranslation = isRoot; 249 this.threeD.disableTranslation = isRoot;
221 this.threeD.flatten = ElementsMediator.getProperty(el, "-webkit-transform-style") !== "preserve-3d"; 250 this.threeD.flatten = ElementsMediator.getProperty(el, "-webkit-transform-style") !== "preserve-3d";
222 251
223 this.positionSize.leftPosition = parseFloat(ElementsMediator.getProperty(el, "left")); 252 l = ElementsMediator.getProperty(el, "left");
224 this.positionSize.topPosition = parseFloat(ElementsMediator.getProperty(el, "top")); 253 t = ElementsMediator.getProperty(el, "top");
225 this.positionSize.heightSize = parseFloat(ElementsMediator.getProperty(el, "height")); 254 lvu = document.application.njUtils.getValueAndUnits(l);
226 this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(el, "width")); 255 tvu = document.application.njUtils.getValueAndUnits(t);
227// this.positionSize.widthSize = ElementsMediator.getProperty(el, "width"); 256 this.positionSize.leftUnits = lvu[1];
257 this.positionSize.leftPosition = lvu[0];
258 this.positionSize.topUnits = tvu[1];
259 this.positionSize.topPosition = tvu[0];
260
261 h = ElementsMediator.getProperty(el, "height");
262 w = ElementsMediator.getProperty(el, "width");
263 hvu = document.application.njUtils.getValueAndUnits(h);
264 wvu = document.application.njUtils.getValueAndUnits(w);
265
266 this.positionSize.heightUnits = hvu[1] || "px"; // canvas (and shapes) don't have units.
267 this.positionSize.heightSize = hvu[0];
268 this.positionSize.widthUnits = wvu[1] || "px";
269 this.positionSize.widthSize = wvu[0];
228 270
229 if(this.threeD.inGlobalMode) 271 if(this.threeD.inGlobalMode)
230 { 272 {
@@ -278,10 +320,23 @@ exports.Properties = Montage.create(Component, {
278 320
279 if(control.type !== "color") { 321 if(control.type !== "color") {
280 currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator); 322 currentValue = ElementsMediator.getProperty(el, control.prop, control.valueMutator);
281 if(currentValue === null) { 323 if(control.type === "hottext") {
282 currentValue = control.defaultValue; 324 if(currentValue == null) {
325 currentValue = control.defaultValue;
326 }
327 if(typeof(currentValue) === "string") {
328 currentValue = document.application.njUtils.getValueAndUnits(currentValue);
329 this.customSections[i].content.controls[control.id + "Units"] = currentValue[1] || "px";
330 this.customSections[i].content.controls[control.id] = currentValue[0];
331 } else {
332 this.customSections[i].content.controls[control.id] = currentValue;
333 }
334 } else {
335 if(currentValue === null) {
336 currentValue = control.defaultValue;
337 }
338 this.customSections[i].content.controls[control.id] = currentValue;
283 } 339 }
284 this.customSections[i].content.controls[control.id] = currentValue;
285 } else { 340 } else {
286 if(control.prop === "border") { 341 if(control.prop === "border") {
287 // TODO - For now, always return the top border if multiple border sides 342 // TODO - For now, always return the top border if multiple border sides
@@ -403,7 +458,11 @@ exports.Properties = Montage.create(Component, {
403 value: function(e) { 458 value: function(e) {
404 if(e.wasSetByCode) return; 459 if(e.wasSetByCode) return;
405 460
406 ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [e.value + "px"], "Changing", "pi"); 461 var newValue;
462
463 e.units ? newValue = e.value + e.units : newValue = e.value;
464
465 ElementsMediator.setProperty(this.application.ninja.selectedElements, e.prop, [newValue], "Changing", "pi");
407 }