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 ++++++++++++++++- 3 files changed, 24 insertions(+), 21 deletions(-) (limited to 'js/components') 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 @@
+
-
-- cgit v1.2.3 From 92873714dd6ffb259e6c5a27da2ade773d7b00f9 Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Wed, 15 Feb 2012 15:04:37 -0800 Subject: New Icons: Last set had imperfections Signed-off-by: Armen Kesablyan --- js/components/layout/tools-list.reel/tools-list.html | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) (limited to 'js/components') diff --git a/js/components/layout/tools-list.reel/tools-list.html b/js/components/layout/tools-list.reel/tools-list.html index c47359bf..2c5617e5 100644 --- a/js/components/layout/tools-list.reel/tools-list.html +++ b/js/components/layout/tools-list.reel/tools-list.html @@ -26,15 +26,15 @@ }, "groupLine": { - "module": "js/components/layout/tool-button.reel", - "name": "ToolButton", + "module": "montage/ui/condition.reel", + "name": "Condition", "properties": { "element": {"#": "groupLine"} }, "bindings": { - "data": { + "condition": { "boundObject": {"@": "repetition1"}, - "boundObjectPropertyPath": "objectAtCurrentIteration", + "boundObjectPropertyPath": "objectAtCurrentIteration.lastInGroup", "oneway": true } } @@ -178,7 +178,9 @@
-
+
+
+
-- cgit v1.2.3 From 7e08bdbd9db21880783b56a31b480ba33f3b5327 Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Thu, 16 Feb 2012 11:33:18 -0800 Subject: Tool Button Fixes Signed-off-by: Armen Kesablyan --- js/components/layout/subtool-button.reel/subtool-button.html | 7 ++----- js/components/layout/subtool-button.reel/subtool-button.js | 10 +++------- 2 files changed, 5 insertions(+), 12 deletions(-) (limited to 'js/components') diff --git a/js/components/layout/subtool-button.reel/subtool-button.html b/js/components/layout/subtool-button.reel/subtool-button.html index 9dad007d..24fce57c 100644 --- a/js/components/layout/subtool-button.reel/subtool-button.html +++ b/js/components/layout/subtool-button.reel/subtool-button.html @@ -16,8 +16,7 @@ "module": "js/components/layout/subtool-button.reel", "name": "SubToolButton", "properties": { - "element": {"#": "buttonBackground"}, - "button": {"#": "toolBarButton"} + "element": {"#": "toolButton"} } } } @@ -26,9 +25,7 @@ -
-
-
+
diff --git a/js/components/layout/subtool-button.reel/subtool-button.js b/js/components/layout/subtool-button.reel/subtool-button.js index d1adca43..2b066f24 100644 --- a/js/components/layout/subtool-button.reel/subtool-button.js +++ b/js/components/layout/subtool-button.reel/subtool-button.js @@ -35,7 +35,7 @@ exports.SubToolButton = Montage.create(Component, { boundObjectPropertyPath: "selected", oneway: false }); - + this.element.classList.add(this.data.id); } }, @@ -43,13 +43,9 @@ exports.SubToolButton = Montage.create(Component, { enumerable: false, value: function() { if(this._selected) { - this.element.classList.add( "buttonSelected" ); - this.button.classList.remove( this.data.id + "Unpressed" ); - this.button.classList.add( this.data.id + "Pressed" ); + this.element.classList.add("active"); } else { - this.element.classList.remove( "buttonSelected" ); - this.button.classList.remove( this.data.id + "Pressed" ); - this.button.classList.add( this.data.id + "Unpressed" ); + this.element.classList.remove("active"); } } }, -- cgit v1.2.3 From d2f4d5e5f6742d53b6324d585a700566f73c992a Mon Sep 17 00:00:00 2001 From: mqg734 Date: Tue, 21 Feb 2012 16:49:11 -0800 Subject: Updated Materials Library and Materials Editor Popup to work with latest version of Montage. We had to change our css to not use id's. Also, updated the popup to use Montage's Popup component. It looks like bump material has a bug. So loading that material results in a runtime error. --- js/components/textfield.reel/textfield.html | 2 +- .../rect-properties.reel/rect-properties.css | 12 ++++------ .../rect-properties.reel/rect-properties.html | 2 +- js/components/ui/color-chip.reel/color-chip.js | 20 +++++++++++----- js/components/ui/file-input.reel/file-input.html | 6 ++--- js/components/ui/file-input.reel/file-input.js | 2 +- js/components/ui/input-group.reel/input-group.html | 10 ++++---- .../ui/property-control.reel/property-control.html | 6 ++--- .../ui/property-control.reel/property-control.js | 27 +++++++++++----------- 9 files changed, 47 insertions(+), 40 deletions(-) (limited to 'js/components') diff --git a/js/components/textfield.reel/textfield.html b/js/components/textfield.reel/textfield.html index 89adf776..73defabd 100755 --- a/js/components/textfield.reel/textfield.html +++ b/js/components/textfield.reel/textfield.html @@ -19,6 +19,6 @@ - + \ No newline at end of file diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.css b/js/components/tools-properties/rect-properties.reel/rect-properties.css index f50a9873..6541f641 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.css +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.css @@ -4,7 +4,7 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ -.button { +.rectProperties .button { border:none; cursor:default; text-align:center; @@ -12,28 +12,26 @@ opacity:0.8; display:table-cell; vertical-align:middle; - width:100%; - height:100%; background-color:#333333; color:white; } -.button:hover +.rectProperties .button:hover { opacity:1; } -.button:active +.rectProperties .button:active { outline:solid 1px black; } -.button.on +.rectProperties .button.on { background-color: #333333; } -.button.off +.rectProperties .button.off { background-color: #cccccc; color:black; diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.html b/js/components/tools-properties/rect-properties.reel/rect-properties.html index e5c52466..214ff1d5 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.html +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.html @@ -68,7 +68,7 @@ -
+
diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js index e51bdd8a..ed1ac27a 100755 --- a/js/components/ui/color-chip.reel/color-chip.js +++ b/js/components/ui/color-chip.reel/color-chip.js @@ -29,12 +29,20 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { value: 20 }, - initialColor: { - value: false + color: { + value: {r:0, g:0, b:0, a:1, css:'rgb(0,0,0)', mode:'rgb'} }, changeDelegate: { - value: null + value: function(event) { + this.color = event._event.color; + + var evt = document.createEvent("CustomEvent"); + evt.initEvent("change", true, true); + evt.type = "change"; + + this.dispatchEvent(evt); + } }, prepareForDraw: { @@ -60,10 +68,10 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { value: function(evt) { if(this.chip) { // This is a single chip - Not related to the color panel -- Set the initial color if found - var mode = "rgb", r = 0, g = 0, b = 0, a = 1, css = "rgb(255,0,0)"; + var mode = "rgb", r = 0, g = 0, b = 0, a = 1, css = "rgb(0,0,0)"; - if(this.initialColor) { - var colorObj = this.application.ninja.colorController.getColorObjFromCss(this.initialColor); + if(this.color) { + var colorObj = this.application.ninja.colorController.getColorObjFromCss(this.color.css); mode = colorObj.mode; r = colorObj.value.r; g = colorObj.value.g; diff --git a/js/components/ui/file-input.reel/file-input.html b/js/components/ui/file-input.reel/file-input.html index 5cdd8f9e..2a8546a5 100755 --- a/js/components/ui/file-input.reel/file-input.html +++ b/js/components/ui/file-input.reel/file-input.html @@ -11,7 +11,7 @@ -
- +
+
diff --git a/js/components/ui/file-input.reel/file-input.js b/js/components/ui/file-input.reel/file-input.js index 2ea38162..b57f7c21 100755 --- a/js/components/ui/file-input.reel/file-input.js +++ b/js/components/ui/file-input.reel/file-input.js @@ -5,7 +5,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot */ var Montage = require("montage/core/core").Montage, -Component = require("montage/ui/component").Component; + Component = require("montage/ui/component").Component; var FileInput = exports.FileInput = Montage.create(Component, { diff --git a/js/components/ui/input-group.reel/input-group.html b/js/components/ui/input-group.reel/input-group.html index c99e29d6..0050b8cb 100755 --- a/js/components/ui/input-group.reel/input-group.html +++ b/js/components/ui/input-group.reel/input-group.html @@ -11,7 +11,7 @@ -
+
diff --git a/js/components/ui/property-control.reel/property-control.html b/js/components/ui/property-control.reel/property-control.html index 2e7c7b53..43e8e67f 100755 --- a/js/components/ui/property-control.reel/property-control.html +++ b/js/components/ui/property-control.reel/property-control.html @@ -11,14 +11,14 @@ -
+
diff --git a/js/components/ui/property-control.reel/property-control.js b/js/components/ui/property-control.reel/property-control.js index 586d2e9a..58b1be9f 100755 --- a/js/components/ui/property-control.reel/property-control.js +++ b/js/components/ui/property-control.reel/property-control.js @@ -6,16 +6,16 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage, Component = require("montage/ui/component").Component, - HotText = require("js/components/hottext").HotText, - HotTextUnit = require("js/components/hottextunit").HotTextUnit, - Slider = require("js/components/slider").Slider, - Button = require("js/components/button").Button, - Checkbox = require("js/components/checkbox").Checkbox, - Combobox = require("js/components/combobox").Combobox, - TextField = require("js/components/TextField").TextField, - ColorChip = require("js/components/ui/color-chip").ColorChip, - FileInput = require("js/components/ui/file-input").FileInput, - InputGroup = require("js/components/ui/input-group").InputGroup; + HotText = require("js/components/hottext.reel").HotText, + HotTextUnit = require("js/components/hottextunit.reel").HotTextUnit, + Slider = require("js/components/slider.reel").Slider, + Button = require("js/components/button.reel").Button, + Checkbox = require("js/components/checkbox.reel").Checkbox, + Combobox = require("js/components/combobox.reel").Combobox, + TextField = require("js/components/TextField.reel").TextField, + ColorChip = require("js/components/ui/color-chip.reel").ColorChip, + FileInput = require("js/components/ui/file-input.reel").FileInput, + InputGroup = require("js/components/ui/input-group.reel").InputGroup; var PropertyControl = exports.PropertyControl = Montage.create(Component, { @@ -134,7 +134,7 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, { { this._control[n] = defaults[n]; } - + this._labelField.innerHTML = this._label; this._control.needsDraw = true; } }, @@ -170,8 +170,6 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, { prepareForDraw: { value: function() { - this._labelField.innerHTML = this._label; - switch(this._controlType) { case "HotText": @@ -199,6 +197,9 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, { break; case "ColorChip": this._control = ColorChip.create(); + this._control.chip = true; + this._control.hasIcon = false; + this._control.mode = "chip"; this._control.addEventListener("change", this, false); this._prop = "color"; break; -- cgit v1.2.3 From 095acca0cdd72cbe6a26be74ec742ef98d529136 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 22 Feb 2012 16:53:31 -0800 Subject: Buttons in the rectangle properties in the tools options need to float left. Signed-off-by: Nivesh Rajbhandari --- .../tools-properties/rect-properties.reel/rect-properties.css | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'js/components') diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.css b/js/components/tools-properties/rect-properties.reel/rect-properties.css index 6541f641..74509555 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.css +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.css @@ -16,6 +16,10 @@ color:white; } +.rectProperties .subToolButton { + float:left; +} + .rectProperties .button:hover { opacity:1; -- cgit v1.2.3 From 3730bbc7cc5d5f07b3d788885475a8f9810b480e Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 22 Feb 2012 21:34:21 -0800 Subject: Updating textfield to only use nj-skinned class and updating input-group to check for nj-skinned class instead of textfield class for styling. Signed-off-by: Nivesh Rajbhandari --- js/components/textfield.reel/textfield.html | 2 +- js/components/ui/input-group.reel/input-group.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'js/components') diff --git a/js/components/textfield.reel/textfield.html b/js/components/textfield.reel/textfield.html index 73defabd..89adf776 100755 --- a/js/components/textfield.reel/textfield.html +++ b/js/components/textfield.reel/textfield.html @@ -19,6 +19,6 @@ - + \ No newline at end of file diff --git a/js/components/ui/input-group.reel/input-group.css b/js/components/ui/input-group.reel/input-group.css index 8e2267eb..0b7cd1ef 100755 --- a/js/components/ui/input-group.reel/input-group.css +++ b/js/components/ui/input-group.reel/input-group.css @@ -23,7 +23,7 @@ .propControl .inputRow div .hottext, .propControl .inputRow div .hottextInput, -.prop-controller .textfield +.prop-controller .nj-skinned { border: 1px solid black; width: 30px !important; -- cgit v1.2.3 From cc295dd0fb873505eed01c232bd987cf6e2dcdd9 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 23 Feb 2012 01:04:12 -0800 Subject: Fixing the breadcrumb button - removing toolbutton class since it is not a tool button Signed-off-by: Valerio Virgillito --- js/components/layout/bread-crumb.reel/bread-crumb.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/components') diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.html b/js/components/layout/bread-crumb.reel/bread-crumb.html index 67328479..c1b9ed61 100755 --- a/js/components/layout/bread-crumb.reel/bread-crumb.html +++ b/js/components/layout/bread-crumb.reel/bread-crumb.html @@ -62,7 +62,7 @@ -- cgit v1.2.3