aboutsummaryrefslogtreecommitdiff
path: root/js/panels
diff options
context:
space:
mode:
authorValerio Virgillito2012-02-10 17:21:28 -0800
committerValerio Virgillito2012-02-10 17:21:28 -0800
commita30d76ff641ce89686cf5fbd9f04ac9ab4e9c830 (patch)
tree41b7443e3a22c8215b30d992e06adc28c2f7919a /js/panels
parent666ae3e9119410cbf7fa974274d95336aaff091c (diff)
downloadninja-a30d76ff641ce89686cf5fbd9f04ac9ab4e9c830.tar.gz
initial color chip for the stage
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'js/panels')
-rw-r--r--js/panels/properties/content.reel/content.js37
-rw-r--r--js/panels/properties/sections/custom.reel/custom.js46
2 files changed, 78 insertions, 5 deletions
diff --git a/js/panels/properties/content.reel/content.js b/js/panels/properties/content.reel/content.js
index 0088447a..b15f2d71 100644
--- a/js/panels/properties/content.reel/content.js
+++ b/js/panels/properties/content.reel/content.js
@@ -150,6 +150,43 @@ exports.Content = Montage.create(Component, {
150 this.customPi = stage.elementModel.pi; 150 this.customPi = stage.elementModel.pi;
151 this.displayCustomProperties(stage, stage.elementModel.pi); 151 this.displayCustomProperties(stage, stage.elementModel.pi);
152 } 152 }
153
154 // For now hardcode the background since it is the only custom property
155 // No need to loop through all the properties.
156 var backgroundChip = this.customSections[0].content.controls["background"];
157 backgroundChip.initialColor = ElementsMediator.getProperty(stage, "background");
158
159 // Get stage color
160 //var backgroundColor =
161 //console.log(backgroundColor);
162
163 /*
164 var customPI = PiData[this.customPi];
165 // Get all the custom section for the custom PI
166 for(var i = 0, customSec; customSec = customPI[i]; i++) {
167
168 // Now set the Fields for the custom PI
169 for(var j = 0, fields; fields = customSec.Section[j]; j++) {
170 for(var k = 0, control; control = fields[k]; k++) {
171
172 var colorChipEl = this.customSections[i].content.controls[control.id];
173 this.foo = colorChipEl;
174 colorChipEl.addEventListener("firstDraw", this, false);
175
176 }
177 }
178 }
179 */
180 }
181 },
182
183 foo: {
184 value: null
185 },
186
187 handleFirstDraw: {
188 value: function() {
189 this.foo.chipBtn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 255, g: 0, b: 0}, css: 'rgb(255,0,0)'});
153 } 190 }
154 }, 191 },
155 192
diff --git a/js/panels/properties/sections/custom.reel/custom.js b/js/panels/properties/sections/custom.reel/custom.js
index 992db8e6..5315defc 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
7var Montage = require("montage/core/core").Montage; 7var Montage = require("montage/core/core").Montage;
8var Component = require("montage/ui/component").Component; 8var Component = require("montage/ui/component").Component;
9var ElementsMediator = require("js/mediators/element-mediator").ElementMediator;
9 10
10//Custom Rows 11//Custom Rows
11var SingleRow = require("js/panels/properties/sections/custom-rows/single-row.reel").SingleRow; 12var SingleRow = require("js/panels/properties/sections/custom-rows/single-row.reel").SingleRow;
@@ -18,7 +19,7 @@ var Dropdown = require("js/components/combobox.reel").Combobox;
18var TextField = require("js/components/textfield.reel").TextField; 19var TextField = require("js/components/textfield.reel").TextField;
19var FileInput = require("js/components/ui/file-input.reel").FileInput; 20var FileInput = require("js/components/ui/file-input.reel").FileInput;
20var Checkbox = require("js/components/checkbox.reel").Checkbox; 21var Checkbox = require("js/components/checkbox.reel").Checkbox;
21 22var ColorChip = require("js/components/ui/color-chip.reel").ColorChip;
22 23
23exports.CustomSection = Montage.create(Component, { 24exports.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,26 @@ exports.CustomSection = Montage.create(Component, {
106 } 105 }
107 }, 106 },
108 107
108 handleColorChange: {
109 value: function(event) {
110 // Change the stage color for now
111 console.log(this);
112 console.log(event);
113 console.log(event._event.color.css);
114 ElementsMediator.setProperty([this.application.ninja.currentDocument.documentRoot], "background", [event._event.color.css], "Change", "pi", 'foo');
115 /*
116 var propEvent = document.createEvent("CustomEvent");
117 propEvent.initEvent("propertyChange", true, true);
118 propEvent.type = "propertyChange";
119
120 propEvent.prop = "background";//event.prop;
121 propEvent.value = event._event.color.css;
122
123 this.dispatchEvent(propEvent);
124 */
125 }
126 },
127
109 _dispatchPropEvent: { 128 _dispatchPropEvent: {
110 value: function(event) { 129 value: function(event) {
111// console.log(event); 130// console.log(event);
@@ -140,6 +159,7 @@ exports.CustomSection = Montage.create(Component, {
140 case "textbox" : return this.createTextField(fields); 159 case "textbox" : return this.createTextField(fields);
141 case "file" : return this.createFileInput(fields); 160 case "file" : return this.createFileInput(fields);
142 case "checkbox" : return this.createCheckbox(fields); 161 case "checkbox" : return this.createCheckbox(fields);
162 case "chip" : return this.createColorChip(fields);
143 } 163 }
144 } 164 }
145 }, 165 },
@@ -305,6 +325,22 @@ exports.CustomSection = Montage.create(Component, {
305 325
306 return obj; 326 return obj;
307 } 327 }
328 },
329
330 createColorChip: {
331 value: function(aField) {
332 var obj = ColorChip.create();
333 obj.chip = true;
334 obj.iconType = "fillIcon";
335 obj.mode = "chip";
336 obj.offset = 0;
337
338 obj.changeDelegate = this.handleColorChange;
339
340 this.controls[aField.id] = obj;
341
342 return obj;
343 }
308 } 344 }
309 345
310}); \ No newline at end of file 346}); \ No newline at end of file