aboutsummaryrefslogtreecommitdiff
path: root/js/components/tools-properties/shape-properties.reel
diff options
context:
space:
mode:
authorEric Guzman2012-02-08 14:41:56 -0800
committerEric Guzman2012-02-08 14:41:56 -0800
commit637db74743ac1397ade7edec3da3ae1c1cdaa82a (patch)
treebc16578a5368098956d39f16ddd48737a9bb355c /js/components/tools-properties/shape-properties.reel
parent40622aa97d31837254996b718b0a6feca2bcd0ce (diff)
parentab12be4e9a0d9fee4450795077b0107983b5682e (diff)
downloadninja-637db74743ac1397ade7edec3da3ae1c1cdaa82a.tar.gz
Merge branch 'refs/heads/master' into StylesControllerUpdates
Diffstat (limited to 'js/components/tools-properties/shape-properties.reel')
-rw-r--r--js/components/tools-properties/shape-properties.reel/shape-properties.css6
-rw-r--r--js/components/tools-properties/shape-properties.reel/shape-properties.html35
-rw-r--r--js/components/tools-properties/shape-properties.reel/shape-properties.js36
3 files changed, 48 insertions, 29 deletions
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.css b/js/components/tools-properties/shape-properties.reel/shape-properties.css
index 1e36b0bd..0441c1cf 100644
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.css
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.css
@@ -2,8 +2,4 @@
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/> 2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> 3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */ 5 </copyright> */ \ No newline at end of file
6
7#strokeIcon {
8 float: left;
9} \ No newline at end of file
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html
index 52502d47..64840b17 100644
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.html
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html
@@ -53,6 +53,26 @@
53 } 53 }
54 }, 54 },
55 55
56 "_strokeMaterial1": {
57 "module": "js/components/combobox.reel",
58 "name": "Combobox",
59 "properties": {
60 "element": {"#": "strokeMaterialCB"},
61 "labelField": "_name",
62 "dataField": "_name"
63 }
64 },
65
66 "_fillMaterial1": {
67 "module": "js/components/combobox.reel",
68 "name": "Combobox",
69 "properties": {
70 "element": {"#": "fillMaterialCB"},
71 "labelField": "_name",
72 "dataField": "_name"
73 }
74 },
75
56 "toolbutton1": { 76 "toolbutton1": {
57 "module": "js/components/layout/subtool-button.reel", 77 "module": "js/components/layout/subtool-button.reel",
58 "name": "SubToolButton", 78 "name": "SubToolButton",
@@ -89,10 +109,9 @@
89 "name": "ShapeProperties", 109 "name": "ShapeProperties",
90 "properties": { 110 "properties": {
91 "element": {"#": "shapeProperties"}, 111 "element": {"#": "shapeProperties"},
92 "_strokeStyle": {"#": "strokeStyleCB"}, 112 "_strokeMaterial": {"@": "_strokeMaterial1"},
93 "_strokeMaterial": {"#": "strokeMaterialCB"},
94 "_fillIcon": {"#": "fillIcon"}, 113 "_fillIcon": {"#": "fillIcon"},
95 "_fillMaterial": {"#": "fillMaterialCB"}, 114 "_fillMaterial": {"@": "_fillMaterial1"},
96 115
97 "_useWebGL": {"#": "useWebGLCH"}, 116 "_useWebGL": {"#": "useWebGLCH"},
98 "_materialLabel": {"#": "materialLabel"}, 117 "_materialLabel": {"#": "materialLabel"},
@@ -125,14 +144,6 @@
125 <label class="label">Stroke:</label> 144 <label class="label">Stroke:</label>
126 <div id="strokeControl" class="label"></div> 145 <div id="strokeControl" class="label"></div>
127 146
128 <label class="label">Style:</label>
129 <select id="strokeStyleCB" class="selectBox">
130 <option value="0">Hairline</option>
131 <option value="1" selected>Solid</option>
132 <option value="2">Dashed</option>
133 <option value="3">Dotted</option>
134 </select>
135
136 <div id="customProperties"> 147 <div id="customProperties">
137 <div id="ovalProperties" class="label"></div> 148 <div id="ovalProperties" class="label"></div>
138 <div id="rectProperties" class="label"></div> 149 <div id="rectProperties" class="label"></div>
@@ -142,7 +153,7 @@
142 <label class="label subOption optionLabel"><input id="useWebGLCH" type="checkbox" name="useWebGLControl" class="checkBoxAlign"/>Use WebGL</label> 153 <label class="label subOption optionLabel"><input id="useWebGLCH" type="checkbox" name="useWebGLControl" class="checkBoxAlign"/>Use WebGL</label>
143 154
144 <label id="materialLabel" class="label">Material:</label> 155 <label id="materialLabel" class="label">Material:</label>
145 <div id="strokeIcon" class="pencilToolUp"></div> 156 <div id="strokeIcon" class="pencilToolUp" style="float: left;"></div>
146 157
147 <select class="selectBox" id="strokeMaterialCB"> 158 <select class="selectBox" id="strokeMaterialCB">
148 </select> 159 </select>
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.js b/js/components/tools-properties/shape-properties.reel/shape-properties.js
index b0d674cc..79567453 100644
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.js
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.js
@@ -16,8 +16,17 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
16 value: function() { 16 value: function() {
17 this.rectProperties.visible = true; 17 this.rectProperties.visible = true;
18 18
19 ShapesController.DisplayMaterials(this._strokeMaterial); 19 Object.defineBinding(this._strokeMaterial, "items", {
20 ShapesController.DisplayMaterials(this._fillMaterial); 20 boundObject: this.application.ninja.appModel,
21 boundObjectPropertyPath: "materials",
22 oneway: false
23 });
24
25 Object.defineBinding(this._fillMaterial, "items", {
26 boundObject: this.application.ninja.appModel,
27 boundObjectPropertyPath: "materials",
28 oneway: false
29 });
21 30
22 this.handleChange(null); 31 this.handleChange(null);
23 this._useWebGL.addEventListener("change", this, false); 32 this._useWebGL.addEventListener("change", this, false);
@@ -36,12 +45,15 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
36 this._selectedSubTool = value; 45 this._selectedSubTool = value;
37 this[this._selectedSubTool.properties].visible = true; 46 this[this._selectedSubTool.properties].visible = true;
38 47
39 if(this._selectedSubTool.id === "LineTool") { 48 if(this._useWebGL.checked)
40 this._fillIcon.style["display"] = "none"; 49 {
41 this._fillMaterial.style["display"] = "none"; 50 if(this._selectedSubTool.id === "LineTool") {
42 } else { 51 this._fillIcon.style["display"] = "none";
43 this._fillIcon.style["display"] = ""; 52 this._fillMaterial.visible = false;
44 this._fillMaterial.style["display"] = ""; 53 } else {
54 this._fillIcon.style["display"] = "";
55 this._fillMaterial.visible = true;
56 }
45 } 57 }
46 58
47 } 59 }
@@ -55,11 +67,11 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
55 this._use3D = true; 67 this._use3D = true;
56 this._materialLabel.style["display"] = ""; 68 this._materialLabel.style["display"] = "";
57 this._strokeIcon.style["display"] = ""; 69 this._strokeIcon.style["display"] = "";
58 this._strokeMaterial.style["display"] = ""; 70 this._strokeMaterial.visible = true;
59 if(this.selectedSubTool.id !== "LineTool") 71 if(this.selectedSubTool.id !== "LineTool")
60 { 72 {
61 this._fillIcon.style["display"] = ""; 73 this._fillIcon.style["display"] = "";
62 this._fillMaterial.style["display"] = ""; 74 this._fillMaterial.visible = true;
63 } 75 }
64 } 76 }
65 else 77 else
@@ -67,9 +79,9 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
67 this._use3D = false; 79 this._use3D = false;
68 this._materialLabel.style["display"] = "none"; 80 this._materialLabel.style["display"] = "none";
69 this._strokeIcon.style["display"] = "none"; 81 this._strokeIcon.style["display"] = "none";
70 this._strokeMaterial.style["display"] = "none"; 82 this._strokeMaterial.visible = false;
71 this._fillIcon.style["display"] = "none"; 83 this._fillIcon.style["display"] = "none";
72 this._fillMaterial.style["display"] = "none"; 84 this._fillMaterial.visible = false;
73 } 85 }
74 } 86 }
75 } 87 }