aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorNivesh Rajbhandari2012-03-20 10:59:05 -0700
committerNivesh Rajbhandari2012-03-20 11:04:12 -0700
commite1c4f30a4c13d747fa69d78598e0961286bbe571 (patch)
treebb2fb0955d771274f4e62b47280b95a8493e5aaf /js
parente33b3ce6f7b6789cfe854d4a6a8bb5bd57b8ae37 (diff)
downloadninja-e1c4f30a4c13d747fa69d78598e0961286bbe571.tar.gz
Support button control in Properties Panel and use them for edit fill and stroke material.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
Diffstat (limited to 'js')
-rwxr-xr-xjs/controllers/elements/shapes-controller.js13
-rwxr-xr-xjs/data/pi/pi-data.js14
-rwxr-xr-xjs/panels/Materials/materials-library-panel.reel/materials-library-panel.js32
-rwxr-xr-xjs/panels/properties.reel/sections/custom-rows/dual-row.reel/dual-row.js8
-rwxr-xr-xjs/panels/properties.reel/sections/custom.reel/custom.js44
5 files changed, 84 insertions, 27 deletions
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index d72d9c14..b3ac9ddb 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -6,10 +6,9 @@ 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,
8 CanvasController = require("js/controllers/elements/canvas-controller").CanvasController, 8 CanvasController = require("js/controllers/elements/canvas-controller").CanvasController,
9 njModule = require("js/lib/NJUtils"); 9 njModule = require("js/lib/NJUtils"),
10 10 World = require("js/lib/drawing/world").World,
11var World = require("js/lib/drawing/world").World; 11 MaterialsModel = require("js/models/materials-model").MaterialsModel;
12var MaterialsModel = require("js/models/materials-model").MaterialsModel;
13 12
14exports.ShapesController = Montage.create(CanvasController, { 13exports.ShapesController = Montage.create(CanvasController, {
15 14
@@ -100,6 +99,12 @@ exports.ShapesController = Montage.create(CanvasController, {
100 el.elementModel.shapeModel.GLWorld.render(); 99 el.elementModel.shapeModel.GLWorld.render();
101 } 100 }
102 break; 101 break;
102 case "editStrokeMaterial":
103 NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.strokeMaterial.getName()});
104 break;
105 case "editFillMaterial":
106 NJevent("showMaterialPopup",{materialId : el.elementModel.shapeModel.fillMaterial.getName()});
107 break;
103 default: 108 default:
104 CanvasController.setProperty(el, p, value); 109 CanvasController.setProperty(el, p, value);
105 } 110 }
diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js
index ba03c347..28ffa536 100755
--- a/js/data/pi/pi-data.js
+++ b/js/data/pi/pi-data.js
@@ -402,6 +402,13 @@ exports.PiData = Montage.create( Montage, {
402 items : { boundObject: "this.application.ninja.appModel", boundProperty: "materials" }, 402 items : { boundObject: "this.application.ninja.appModel", boundProperty: "materials" },
403 enabled: { boundObject: "this.controls", boundProperty: "useWebGl" }, 403 enabled: { boundObject: "this.controls", boundProperty: "useWebGl" },
404 divider : true 404 divider : true
405 },
406 {
407 type: "button",
408 id: "editStrokeMaterial",
409 prop: "editStrokeMaterial",
410 label: "Edit",
411 enabled: { boundObject: "this.controls", boundProperty: "useWebGl" }
405 } 412 }
406 ], 413 ],
407 [ 414 [
@@ -414,6 +421,13 @@ exports.PiData = Montage.create( Montage, {
414 dataField: "_name", 421 dataField: "_name",
415 items : { boundObject: "this.application.ninja.appModel", boundProperty: "materials" }, 422 items : { boundObject: "this.application.ninja.appModel", boundProperty: "materials" },
416 enabled: { boundObject: "this.controls", boundProperty: "useWebGl" } 423 enabled: { boundObject: "this.controls", boundProperty: "useWebGl" }
424 },
425 {
426 type: "button",
427 id: "editFillMaterial",
428 prop: "editFillMaterial",
429 label: "Edit",
430 enabled: { boundObject: "this.controls", boundProperty: "useWebGl" }
417 } 431 }
418 ] 432 ]
419 ] 433 ]
diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js
index 5fd86d00..2176c6d5 100755
--- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js
+++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js
@@ -26,28 +26,9 @@ exports.MaterialsLibraryPanel = Montage.create(Component, {
26 } 26 }
27 }, 27 },
28 28
29 willDraw: { 29 prepareForDraw: {
30 enumerable: false, 30 value : function() {
31 value: function() { 31 this.eventManager.addEventListener("showMaterialPopup", this, false);
32
33 }
34 },
35
36 draw: {
37 enumerable: false,
38 value: function() {
39
40 }
41 },
42
43 _loadXMLDoc: {
44 value:function(dname) {
45 if (window.XMLHttpRequest) {
46 xhttp = new XMLHttpRequest();
47 }
48 xhttp.open("GET", dname, false);
49 xhttp.send();
50 return xhttp.responseXML;
51 } 32 }
52 }, 33 },
53 34
@@ -74,6 +55,13 @@ exports.MaterialsLibraryPanel = Montage.create(Component, {
74 } 55 }
75 }, 56 },
76 57
58 handleShowMaterialPopup: {
59 enumerable: false,
60 value: function (event) {
61 this._showMaterialPopup(event.detail.materialId);
62 }
63 },
64
77 _materialPopup: { 65 _materialPopup: {
78 enumerable:true, 66 enumerable:true,
79 value:null 67 value:null
diff --git a/js/panels/properties.reel/sections/custom-rows/dual-row.reel/dual-row.js b/js/panels/properties.reel/sections/custom-rows/dual-row.reel/dual-row.js
index 72d216ca..4c5c80d7 100755
--- a/js/panels/properties.reel/sections/custom-rows/dual-row.reel/dual-row.js
+++ b/js/panels/properties.reel/sections/custom-rows/dual-row.reel/dual-row.js
@@ -43,7 +43,13 @@ exports.DualRow = Montage.create(Component, {
43 this.element.getElementsByClassName("lbl")[0].innerHTML = this.label + ":"; 43 this.element.getElementsByClassName("lbl")[0].innerHTML = this.label + ":";
44 } 44 }
45 if(this.label2 !== null) { 45 if(this.label2 !== null) {
46 this.element.getElementsByClassName("lbl")[1].innerHTML = this.label2 + ":"; 46 if(this.content2.type === "button") {
47 this.content2.element = document.createElement("button");
48 this.content2.element.classList.add("nj-skinned");
49 this.element.getElementsByClassName("lbl")[1].style.display = "none";
50 } else {
51 this.element.getElementsByClassName("lbl")[1].innerHTML = this.label2 + ":";
52 }
47 } else { 53 } else {
48 this.element.getElementsByClassName("lbl")[1].style.display = "none"; 54 this.element.getElementsByClassName("lbl")[1].style.display = "none";
49 } 55 }
diff --git a/js/panels/properties.reel/sections/custom.reel/custom.js b/js/panels/properties.reel/sections/custom.reel/custom.js
index 3c595980..d7334afe 100755
--- a/js/panels/properties.reel/sections/custom.reel/custom.js
+++ b/js/panels/properties.reel/sections/custom.reel/custom.js
@@ -20,6 +20,7 @@ var TextField = require("js/components/textfield.reel").TextField;
20var FileInput = require("js/components/ui/file-input.reel").FileInput; 20var FileInput = require("js/components/ui/file-input.reel").FileInput;
21var Checkbox = require("js/components/checkbox.reel").Checkbox; 21var Checkbox = require("js/components/checkbox.reel").Checkbox;
22var ColorChip = require("js/components/ui/color-chip.reel").ColorChip; 22var ColorChip = require("js/components/ui/color-chip.reel").ColorChip;
23var Button = require("montage/ui/button.reel").Button;
23 24
24exports.CustomSection = Montage.create(Component, { 25exports.CustomSection = Montage.create(Component, {
25 26
@@ -128,6 +129,15 @@ exports.CustomSection = Montage.create(Component, {
128 } 129 }
129 }, 130 },
130 131
132 handleAction: {
133 value:function(event) {
134 if(event._event.wasSetByCode) return;
135
136 var obj = event.currentTarget;
137 this._dispatchPropEvent({"type": "change", "id": obj.id, "prop": obj.prop, "value": obj.value, "control": obj});
138 }
139 },
140
131 _dispatchPropEvent: { 141 _dispatchPropEvent: {
132 value: function(event) { 142 value: function(event) {
133// console.log(event); 143// console.log(event);
@@ -163,6 +173,7 @@ exports.CustomSection = Montage.create(Component, {
163 case "file" : return this.createFileInput(fields); 173 case "file" : return this.createFileInput(fields);
164 case "checkbox" : return this.createCheckbox(fields); 174 case "checkbox" : return this.createCheckbox(fields);
165 case "chip" : return this.createColorChip(fields); 175 case "chip" : return this.createColorChip(fields);
176 case "button" : return this.createButton(fields);
166 } 177 }
167 } 178 }
168 }, 179 },
@@ -351,6 +362,39 @@ exports.CustomSection = Montage.create(Component, {
351 362
352 return obj; 363 return obj;
353 } 364 }
365 },
366
367 createButton: {
368 value: function(aField) {
369 var obj = Button.create();
370
371 // Set Values for Button
372 if (aField.id) obj.id = aField.id;
373 if (aField.label) obj.label = aField.label;
374 if (aField.prop) obj.prop = aField.prop;
375
376 // Special casing button so slot uses "button" tag instead of "div"
377 obj.type = "button";
378
3