aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorArmen Kesablyan2012-02-15 14:23:19 -0800
committerArmen Kesablyan2012-02-15 14:23:19 -0800
commitbb4da39a73cbd6fbe83f3b7c9ed5ae60fe58dd6b (patch)
treecae6abe170b5ac861747dcd6db5a7c19ab34858c /js
parentace16ef22b3ff32663504df7720af481d76987d6 (diff)
downloadninja-bb4da39a73cbd6fbe83f3b7c9ed5ae60fe58dd6b.tar.gz
Tool Icons : New layout
Signed-off-by: Armen Kesablyan <armen@motorola.com>
Diffstat (limited to 'js')
-rw-r--r--js/components/layout/tool-button.reel/tool-button.html7
-rw-r--r--js/components/layout/tool-button.reel/tool-button.js21
-rw-r--r--js/components/layout/tools-list.reel/tools-list.html17
-rw-r--r--js/data/tools-data.js66
4 files changed, 57 insertions, 54 deletions
diff --git a/js/components/layout/tool-button.reel/tool-button.html b/js/components/layout/tool-button.reel/tool-button.html
index 81a9b927..476b66f3 100644
--- a/js/components/layout/tool-button.reel/tool-button.html
+++ b/js/components/layout/tool-button.reel/tool-button.html
@@ -16,8 +16,7 @@
16 "module": "js/components/layout/tool-button.reel", 16 "module": "js/components/layout/tool-button.reel",
17 "name": "ToolButton", 17 "name": "ToolButton",
18 "properties": { 18 "properties": {
19 "element": {"#": "buttonBackground"}, 19 "element": {"#": "toolBarButton"}
20 "button": {"#": "toolBarButton"}
21 } 20 }
22 } 21 }
23 } 22 }
@@ -27,9 +26,7 @@
27 </head> 26 </head>
28 27
29 <body> 28 <body>
30 <div id="buttonBackground" class="buttonBackground"> 29 <div id="toolBarButton"></div>
31 <div id="toolBarButton" class="toolBarButton"></div>
32 </div>
33 </body> 30 </body>
34 31
35</html> 32</html>
diff --git a/js/components/layout/tool-button.reel/tool-button.js b/js/components/layout/tool-button.reel/tool-button.js
index 509512d0..5cb0e7fc 100644
--- a/js/components/layout/tool-button.reel/tool-button.js
+++ b/js/components/layout/tool-button.reel/tool-button.js
@@ -11,8 +11,6 @@ var defaultEventManager = require("montage/core/event/event-manager").defaultEve
11 11
12exports.ToolButton = Montage.create(Component, { 12exports.ToolButton = Montage.create(Component, {
13 13
14 button: { value: null },
15
16 data: { value: null }, 14 data: { value: null },
17 15
18 _selected: { value: null }, 16 _selected: { value: null },
@@ -64,32 +62,25 @@ exports.ToolButton = Montage.create(Component, {
64 oneway: true 62 oneway: true
65 }); 63 });
66 } 64 }
65
66 this.element.classList.add(this.data.id)
67 } 67 }
68 }, 68 },
69 69
70 draw: { 70 draw: {
71 enumerable: false, 71 enumerable: false,
72 value: function() { 72 value: function() {
73 var buttonid;
74
75 if(this.data.container) { 73 if(this.data.container) {
76 buttonid = this.data.subtools[this._subselected].id;
77 this.element.title = this.data.subtools[this._subselected].toolTip; 74 this.element.title = this.data.subtools[this._subselected].toolTip;
78 this.button.classList.remove( this.data.subtools[this._currentSubSelected].id + "Unpressed" ); 75 this.element.classList.remove(this.data.subtools[this._currentSubSelected].id);
79 this.button.classList.remove( this.data.subtools[this._currentSubSelected].id + "Pressed" ); 76 this.element.classList.add(this.data.subtools[this._subselected].id);
80 this._currentSubSelected = this._subselected; 77 this._currentSubSelected = this._subselected;
81 } else {
82 buttonid = this.data.id;
83 } 78 }
84 79
85 if(this._selected) { 80 if(this._selected) {
86 this.element.classList.add( "buttonSelected" ); 81 this.element.classList.add("active");
87 this.button.classList.remove( buttonid + "Unpressed" );
88 this.button.classList.add( buttonid + "Pressed" );
89 } else { 82 } else {
90 this.element.classList.remove( "buttonSelected" ); 83 this.element.classList.remove("active");
91 this.button.classList.remove( buttonid + "Pressed" );
92 this.button.classList.add( buttonid + "Unpressed" );
93 } 84 }
94 } 85 }
95 }, 86 },
diff --git a/js/components/layout/tools-list.reel/tools-list.html b/js/components/layout/tools-list.reel/tools-list.html
index e12fd59b..c47359bf 100644
--- a/js/components/layout/tools-list.reel/tools-list.html
+++ b/js/components/layout/tools-list.reel/tools-list.html
@@ -25,6 +25,21 @@
25 } 25 }
26 }, 26 },
27 27
28 "groupLine": {
29 "module": "js/components/layout/tool-button.reel",
30 "name": "ToolButton",
31 "properties": {
32 "element": {"#": "groupLine"}
33 },
34 "bindings": {
35 "data": {
36 "boundObject": {"@": "repetition1"},
37 "boundObjectPropertyPath": "objectAtCurrentIteration",
38 "oneway": true
39 }
40 }
41 },
42
28 "repetition1": { 43 "repetition1": {
29 "module": "montage/ui/repetition.reel", 44 "module": "montage/ui/repetition.reel",
30 "name": "Repetition", 45 "name": "Repetition",
@@ -163,9 +178,9 @@
163 <div id="toolsList" class="toolsList"> 178 <div id="toolsList" class="toolsList">
164 <div id="toolscontainer" class="toolscontainer"> 179 <div id="toolscontainer" class="toolscontainer">
165 <div id="toolbutton" class="toolbutton"></div> 180 <div id="toolbutton" class="toolbutton"></div>
181 <hr id="groupLine" />
166 </div> 182 </div>
167 <!-- TODO: Remove and add as a component --> 183 <!-- TODO: Remove and add as a component -->
168 <hr class="toolbar_hr" />
169 <div id="colortoolbar"></div> 184 <div id="colortoolbar"></div>
170 </div> 185 </div>
171 186
diff --git a/js/data/tools-data.js b/js/data/tools-data.js
index de965dbc..8356c422 100644
--- a/js/data/tools-data.js
+++ b/js/data/tools-data.js
@@ -157,39 +157,39 @@ exports.ToolsData = Montage.create(Montage, {
157 "container": false, 157 "container": false,
158 "selected": false 158 "selected": false
159 }, 159 },
160 { 160// {
161 "id": "InkBottleTool", 161// "id": "InkBottleTool",
162 "properties": "inkbottleProperties", 162// "properties": "inkbottleProperties",
163 "spriteSheet": true, 163// "spriteSheet": true,
164 "action": "InkBottleTool", 164// "action": "InkBottleTool",
165 "toolTip": "Ink Bottle Tool", 165// "toolTip": "Ink Bottle Tool",
166 "cursor": "url('images/tools/inkbottle_down.png'), default", 166// "cursor": "url('images/tools/inkbottle_down.png'), default",
167 "lastInGroup": false, 167// "lastInGroup": false,
168 "container": false, 168// "container": false,
169 "selected": false 169// "selected": false
170 }, 170// },
171 { 171// {
172 "id": "EyedropperTool", 172// "id": "EyedropperTool",
173 "properties": "eyedropperProperties", 173// "properties": "eyedropperProperties",
174 "spriteSheet": true, 174// "spriteSheet": true,
175 "action": "EyedropperTool", 175// "action": "EyedropperTool",
176 "toolTip": "Eyedropper Tool", 176// "toolTip": "Eyedropper Tool",
177 "cursor": "url('images/tools/eyedropper_down.png'), default", 177// "cursor": "url('images/tools/eyedropper_down.png'), default",
178 "lastInGroup": false, 178// "lastInGroup": false,
179 "container": false, 179// "container": false,
180 "selected": false 180// "selected": false
181 }, 181// },
182 { 182// {
183 "id": "EraserTool", 183// "id": "EraserTool",
184 "properties": "eraserProperties", 184// "properties": "eraserProperties",
185 "spriteSheet": true, 185// "spriteSheet": true,
186 "action": "EraserTool", 186// "action": "EraserTool",
187 "toolTip": "Eraser Tool", 187// "toolTip": "Eraser Tool",
188 "cursor": "auto", 188// "cursor": "auto",
189 "lastInGroup": false, 189// "lastInGroup": false,
190 "container": false, 190// "container": false,
191 "selected": false 191// "selected": false
192 }, 192// },
193 { 193 {
194 "id": "RotateStageTool3D", 194 "id": "RotateStageTool3D",
195 "properties": "rotateStageProperties", 195 "properties": "rotateStageProperties",