From bb4da39a73cbd6fbe83f3b7c9ed5ae60fe58dd6b Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Wed, 15 Feb 2012 14:23:19 -0800 Subject: Tool Icons : New layout Signed-off-by: Armen Kesablyan --- .../layout/tool-button.reel/tool-button.html | 7 +-- .../layout/tool-button.reel/tool-button.js | 21 ++----- .../layout/tools-list.reel/tools-list.html | 17 +++++- js/data/tools-data.js | 66 +++++++++++----------- 4 files changed, 57 insertions(+), 54 deletions(-) (limited to 'js') 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 @@ "module": "js/components/layout/tool-button.reel", "name": "ToolButton", "properties": { - "element": {"#": "buttonBackground"}, - "button": {"#": "toolBarButton"} + "element": {"#": "toolBarButton"} } } } @@ -27,9 +26,7 @@ -
-
-
+
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 exports.ToolButton = Montage.create(Component, { - button: { value: null }, - data: { value: null }, _selected: { value: null }, @@ -64,32 +62,25 @@ exports.ToolButton = Montage.create(Component, { oneway: true }); } + + this.element.classList.add(this.data.id) } }, draw: { enumerable: false, value: function() { - var buttonid; - if(this.data.container) { - buttonid = this.data.subtools[this._subselected].id; this.element.title = this.data.subtools[this._subselected].toolTip; - this.button.classList.remove( this.data.subtools[this._currentSubSelected].id + "Unpressed" ); - this.button.classList.remove( this.data.subtools[this._currentSubSelected].id + "Pressed" ); + this.element.classList.remove(this.data.subtools[this._currentSubSelected].id); + this.element.classList.add(this.data.subtools[this._subselected].id); this._currentSubSelected = this._subselected; - } else { - buttonid = this.data.id; } if(this._selected) { - this.element.classList.add( "buttonSelected" ); - this.button.classList.remove( buttonid + "Unpressed" ); - this.button.classList.add( buttonid + "Pressed" ); + this.element.classList.add("active"); } else { - this.element.classList.remove( "buttonSelected" ); - this.button.classList.remove( buttonid + "Pressed" ); - this.button.classList.add( buttonid + "Unpressed" ); + this.element.classList.remove("active"); } } }, 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 @@ } }, + "groupLine": { + "module": "js/components/layout/tool-button.reel", + "name": "ToolButton", + "properties": { + "element": {"#": "groupLine"} + }, + "bindings": { + "data": { + "boundObject": {"@": "repetition1"}, + "boundObjectPropertyPath": "objectAtCurrentIteration", + "oneway": true + } + } + }, + "repetition1": { "module": "montage/ui/repetition.reel", "name": "Repetition", @@ -163,9 +178,9 @@
+
-
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, { "container": false, "selected": false }, - { - "id": "InkBottleTool", - "properties": "inkbottleProperties", - "spriteSheet": true, - "action": "InkBottleTool", - "toolTip": "Ink Bottle Tool", - "cursor": "url('images/tools/inkbottle_down.png'), default", - "lastInGroup": false, - "container": false, - "selected": false - }, - { - "id": "EyedropperTool", - "properties": "eyedropperProperties", - "spriteSheet": true, - "action": "EyedropperTool", - "toolTip": "Eyedropper Tool", - "cursor": "url('images/tools/eyedropper_down.png'), default", - "lastInGroup": false, - "container": false, - "selected": false - }, - { - "id": "EraserTool", - "properties": "eraserProperties", - "spriteSheet": true, - "action": "EraserTool", - "toolTip": "Eraser Tool", - "cursor": "auto", - "lastInGroup": false, - "container": false, - "selected": false - }, +// { +// "id": "InkBottleTool", +// "properties": "inkbottleProperties", +// "spriteSheet": true, +// "action": "InkBottleTool", +// "toolTip": "Ink Bottle Tool", +// "cursor": "url('images/tools/inkbottle_down.png'), default", +// "lastInGroup": false, +// "container": false, +// "selected": false +// }, +// { +// "id": "EyedropperTool", +// "properties": "eyedropperProperties", +// "spriteSheet": true, +// "action": "EyedropperTool", +// "toolTip": "Eyedropper Tool", +// "cursor": "url('images/tools/eyedropper_down.png'), default", +// "lastInGroup": false, +// "container": false, +// "selected": false +// }, +// { +// "id": "EraserTool", +// "properties": "eraserProperties", +// "spriteSheet": true, +// "action": "EraserTool", +// "toolTip": "Eraser Tool", +// "cursor": "auto", +// "lastInGroup": false, +// "container": false, +// "selected": false +// }, { "id": "RotateStageTool3D", "properties": "rotateStageProperties", -- cgit v1.2.3