diff options
author | Eric Guzman | 2012-02-13 15:48:37 -0800 |
---|---|---|
committer | Eric Guzman | 2012-02-13 15:48:37 -0800 |
commit | b2672478decd3ee3bfacf86b525551c997f9604d (patch) | |
tree | 79a88684406d3adf00350246a4da884b97fb0eac /js/panels/properties/sections | |
parent | a738121a921e4c721b280434952b415b9ab3b1a8 (diff) | |
parent | 0620e2f788861e824d6e49fa319da4d20b18a556 (diff) | |
download | ninja-b2672478decd3ee3bfacf86b525551c997f9604d.tar.gz |
Merge branch 'refs/heads/master' into StylesControllerUpdates
Conflicts:
js/controllers/styles-controller.js
Diffstat (limited to 'js/panels/properties/sections')
4 files changed, 129 insertions, 26 deletions
diff --git a/js/panels/properties/sections/custom.reel/custom.js b/js/panels/properties/sections/custom.reel/custom.js index 992db8e6..a2b9b9fa 100644 --- a/js/panels/properties/sections/custom.reel/custom.js +++ b/js/panels/properties/sections/custom.reel/custom.js | |||
@@ -6,6 +6,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage; | 7 | var Montage = require("montage/core/core").Montage; |
8 | var Component = require("montage/ui/component").Component; | 8 | var Component = require("montage/ui/component").Component; |
9 | var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; | ||
9 | 10 | ||
10 | //Custom Rows | 11 | //Custom Rows |
11 | var SingleRow = require("js/panels/properties/sections/custom-rows/single-row.reel").SingleRow; | 12 | var SingleRow = require("js/panels/properties/sections/custom-rows/single-row.reel").SingleRow; |
@@ -18,7 +19,7 @@ var Dropdown = require("js/components/combobox.reel").Combobox; | |||
18 | var TextField = require("js/components/textfield.reel").TextField; | 19 | var TextField = require("js/components/textfield.reel").TextField; |
19 | var FileInput = require("js/components/ui/file-input.reel").FileInput; | 20 | var FileInput = require("js/components/ui/file-input.reel").FileInput; |
20 | var Checkbox = require("js/components/checkbox.reel").Checkbox; | 21 | var Checkbox = require("js/components/checkbox.reel").Checkbox; |
21 | 22 | var ColorChip = require("js/components/ui/color-chip.reel").ColorChip; | |
22 | 23 | ||
23 | exports.CustomSection = Montage.create(Component, { | 24 | exports.CustomSection = Montage.create(Component, { |
24 | 25 | ||
@@ -88,10 +89,8 @@ exports.CustomSection = Montage.create(Component, { | |||
88 | value:{} | 89 | value:{} |
89 | }, | 90 | }, |
90 | 91 | ||
91 | handleChanging: | 92 | handleChanging: { |
92 | { | 93 | value:function(event) { |
93 | value:function(event) | ||
94 | { | ||
95 | var obj = event.currentTarget; | 94 | var obj = event.currentTarget; |
96 | this._dispatchPropEvent({"type": "changing", "id": obj.id, "prop": obj.prop, "value": obj.value, "control": obj}); | 95 | this._dispatchPropEvent({"type": "changing", "id": obj.id, "prop": obj.prop, "value": obj.value, "control": obj}); |
97 | } | 96 | } |
@@ -106,6 +105,27 @@ exports.CustomSection = Montage.create(Component, { | |||
106 | } | 105 | } |
107 | }, | 106 | }, |
108 | 107 | ||
108 | /** | ||
109 | * Color change handler. Hard coding the stage for now since only the stage PI uses this color chip | ||
110 | */ | ||
111 | handleColorChange: { | ||
112 | value: function(event) { | ||
113 | // Change the stage color for now | ||
114 | //console.log(this, event); | ||
115 | ElementsMediator.setProperty([this.application.ninja.currentDocument.documentRoot], this.id, [event._event.color.css], "Change", "pi", ''); | ||
116 | /* | ||
117 | var propEvent = document.createEvent("CustomEvent"); | ||
118 | propEvent.initEvent("propertyChange", true, true); | ||
119 | propEvent.type = "propertyChange"; | ||
120 | |||
121 | propEvent.prop = "background";//event.prop; | ||
122 | propEvent.value = event._event.color.css; | ||
123 | |||
124 | this.dispatchEvent(propEvent); | ||
125 | */ | ||
126 | } | ||
127 | }, | ||
128 | |||
109 | _dispatchPropEvent: { | 129 | _dispatchPropEvent: { |
110 | value: function(event) { | 130 | value: function(event) { |
111 | // console.log(event); | 131 | // console.log(event); |
@@ -140,6 +160,7 @@ exports.CustomSection = Montage.create(Component, { | |||
140 | case "textbox" : return this.createTextField(fields); | 160 | case "textbox" : return this.createTextField(fields); |
141 | case "file" : return this.createFileInput(fields); | 161 | case "file" : return this.createFileInput(fields); |
142 | case "checkbox" : return this.createCheckbox(fields); | 162 | case "checkbox" : return this.createCheckbox(fields); |
163 | case "chip" : return this.createColorChip(fields); | ||
143 | } | 164 | } |
144 | } | 165 | } |
145 | }, | 166 | }, |
@@ -305,6 +326,26 @@ exports.CustomSection = Montage.create(Component, { | |||
305 | 326 | ||
306 | return obj; | 327 | return obj; |
307 | } | 328 | } |
329 | }, | ||
330 | |||
331 | createColorChip: { | ||
332 | value: function(aField) { | ||
333 | var obj = ColorChip.create(); | ||
334 | |||
335 | obj.chip = true; | ||
336 | obj.iconType = "fillIcon"; | ||
337 | obj.mode = "chip"; | ||
338 | obj.offset = 0; | ||
339 | |||
340 | if (aField.id) obj.id = aField.id; | ||
341 | if (aField.prop) obj.prop = aField.prop; | ||
342 | |||
343 | obj.changeDelegate = this.handleColorChange; | ||
344 | |||
345 | this.controls[aField.id] = obj; | ||
346 | |||
347 | return obj; | ||
348 | } | ||
308 | } | 349 | } |
309 | 350 | ||
310 | }); \ No newline at end of file | 351 | }); \ No newline at end of file |
diff --git a/js/panels/properties/sections/position-and-size.reel/position-and-size.js b/js/panels/properties/sections/position-and-size.reel/position-and-size.js index 43f08fcf..49117090 100644 --- a/js/panels/properties/sections/position-and-size.reel/position-and-size.js +++ b/js/panels/properties/sections/position-and-size.reel/position-and-size.js | |||
@@ -28,6 +28,14 @@ exports.PosSize = Montage.create(Component, { | |||
28 | value: null | 28 | value: null |
29 | }, | 29 | }, |
30 | 30 | ||
31 | aspectRatioWidth: { | ||
32 | value: null | ||
33 | }, | ||
34 | |||
35 | aspectRatioHeight: { | ||
36 | value: null | ||
37 | }, | ||
38 | |||
31 | _disablePosition: { | 39 | _disablePosition: { |
32 | value: true | 40 | value: true |
33 | }, | 41 | }, |
@@ -62,9 +70,8 @@ exports.PosSize = Montage.create(Component, { | |||
62 | this.widthControl.addEventListener("change", this, false); | 70 | this.widthControl.addEventListener("change", this, false); |
63 | this.widthControl.addEventListener("changing", this, false); | 71 | this.widthControl.addEventListener("changing", this, false); |
64 | 72 | ||
65 | 73 | this.bindButton.identifier = "ratio"; | |
66 | //this._controlList[0].control.addEventListener("action", this._handleStageEvent.bind(this), false); | 74 | this.bindButton.addEventListener("action", this, false); |
67 | //PropertiesPanelModule.PropertiesPanelBase.PIControlList["stageWidthHeightLock"] = this._controlList[0].control; | ||
68 | 75 | ||
69 | } | 76 | } |
70 | }, | 77 | }, |
@@ -87,6 +94,25 @@ exports.PosSize = Montage.create(Component, { | |||
87 | } | 94 | } |
88 | }, | 95 | }, |
89 | 96 | ||
97 | /** | ||
98 | * Calculate the current aspect ration when the bind button is pressed. | ||
99 | * If one of the values is 0, then use 1:1 as the ratio; | ||
100 | */ | ||
101 | handleRatioAction: { | ||
102 | value: function() { | ||
103 | if(this.bindButton.value) { | ||
104 | this.aspectRatioWidth = this.heightControl.value / this.widthControl.value; | ||
105 | if(isNaN(this.aspectRatioWidth) || !isFinite(this.aspectRatioWidth) || this.aspectRatioWidth === 0) this.aspectRatioWidth = 1; | ||
106 | |||
107 | this.aspectRatioHeight = this.widthControl.value / this.heightControl.value; | ||
108 | if(isNaN(this.aspectRatioHeight) || !isFinite(this.aspectRatioHeight) || this.aspectRatioHeight === 0) this.aspectRatioHeight = 1; | ||
109 | } else { | ||
110 | this.aspectRatioWidth = 1; | ||
111 | this.aspectRatioHeight = 1; | ||
112 | } | ||
113 | } | ||
114 | }, | ||
115 | |||
90 | handleLeftChange: { | 116 | handleLeftChange: { |
91 | value: function(event) { | 117 | value: function(event) { |
92 | var prevPosition; | 118 | var prevPosition; |
@@ -121,6 +147,17 @@ exports.PosSize = Montage.create(Component, { | |||
121 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | 147 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; |
122 | 148 | ||
123 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; | 149 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; |
150 | |||
151 | if(this.bindButton.value) { | ||
152 | |||
153 | var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value); | ||
154 | |||
155 | if(!isFinite(newWidth)) newWidth = this.heightControl.value; | ||
156 | |||
157 | this.widthControl.value = newWidth; | ||
158 | this.application.ninja.elementMediator.setProperty(items, "width", [newWidth + "px"] , "Change", "pi"); | ||
159 | } | ||
160 | |||
124 | this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition); | 161 | this.application.ninja.elementMediator.setProperty(items, "height", [this.heightControl.value + "px"] , "Change", "pi", prevPosition); |
125 | this.savedPosition = null; | 162 | this.savedPosition = null; |
126 | } | 163 | } |
@@ -135,9 +172,23 @@ exports.PosSize = Montage.create(Component, { | |||
135 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; | 172 | if(this.savedPosition) prevPosition = [this.savedPosition + "px"]; |
136 | 173 | ||
137 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; | 174 | this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; |