From 1a759361b82127f9d5c1428dc889fffdf2daaf86 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Thu, 3 May 2012 15:11:56 -0700 Subject: First round of moving color chips into the sub tools. Shape and Pen tool now have chips in the sub tool bar. Still need to complete adding chips to the Brush tool and finalizing the subtool bar layout to our spec for all of the subtools. --- js/components/tools-properties/brush-properties.reel/brush-properties.js | 1 + 1 file changed, 1 insertion(+) (limited to 'js/components/tools-properties/brush-properties.reel') diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.js b/js/components/tools-properties/brush-properties.reel/brush-properties.js index fdcd50f8..677cd2d9 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.js +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.js @@ -36,6 +36,7 @@ exports.BrushProperties = Montage.create(ToolProperties, { } } }, + strokeSize: { get: function() { return this._strokeSize; } }, -- cgit v1.2.3 From 29ad6355ef60cfb3b3fc7f780504f3ed30845883 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Mon, 7 May 2012 14:30:47 -0700 Subject: More implementation of moving color chips to the individual subtools. Removed the tool color bar Added new icons for inkbottle Removed Pencil tool Removed Inkbottle tool Added chips to the pen, brush and tag tools Aligned controls in several subtools --- .../brush-properties.reel/brush-properties.css | 22 ++++++++++ .../brush-properties.reel/brush-properties.html | 29 ++++++------- .../brush-properties.reel/brush-properties.js | 48 +++++++++++++++++++++- 3 files changed, 84 insertions(+), 15 deletions(-) (limited to 'js/components/tools-properties/brush-properties.reel') diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.css b/js/components/tools-properties/brush-properties.reel/brush-properties.css index 7f1b0f7f..0912dd7e 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.css +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.css @@ -3,4 +3,26 @@ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ + + .optionsBrushTool { + padding: 6px; +} + .optionsBrushTool > * { + float:left; +} + + .optionsBrushTool .fillColorCtrl { + width: 20px; + height: 18px; + margin-left: 3px; + margin-right: 8px; + border: 1px black solid; +} + + .optionsBrushTool .colorCtrlIcon { + width: 20px; + height: 20px; + -webkit-transform: scale(0.8); + background-color: rgb(40, 40, 40); +} \ No newline at end of file diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.html b/js/components/tools-properties/brush-properties.reel/brush-properties.html index b0c02734..e4cd69b8 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.html +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html @@ -64,6 +64,7 @@ "prototype": "js/components/tools-properties/brush-properties.reel", "properties": { "element": {"#": "brushProperties"}, + "_fillColorCtrl": {"#": "fillColorCtrl"}, "_strokeSize": {"@": "strokeSizeHT"}, "_strokeHardness": {"@": "strokeHardnessHT"}, "_doSmoothing": {"#": "doSmoothing"}, @@ -74,24 +75,24 @@ } } } - + -
-
- -
- -
- -
- - -
- -
+
+
+
+
 
+ +
+ +
+ +
+ + +
diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.js b/js/components/tools-properties/brush-properties.reel/brush-properties.js index 677cd2d9..7a0d21f1 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.js +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.js @@ -8,7 +8,46 @@ var Montage = require("montage/core/core").Montage; var Component = require("montage/ui/component").Component; var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; -exports.BrushProperties = Montage.create(ToolProperties, { +var BrushProperties = exports.BrushProperties = Montage.create(ToolProperties, { + addedColorChips: { value: false }, + + _fill: { + enumerable: false, + value: { colorMode: 'rgb', color: { r: 0, g: 0, b: 0, a: 1, css: 'rgb(0,0,0)', mode: 'rgb', wasSetByCode: true, type: 'change' }, webGlColor: [0, 0, 0, 1] } + }, + + fill: { + enumerable: true, + get: function () { + return this._fill; + }, + set: function (value) { + if (value !== this._fill) { + this._fill = value; + } + } + }, + + draw: { + enumerable: false, + value: function () { + Object.getPrototypeOf(BrushProperties).draw.call(this); + + if (this.addedColorChips === false && this.application.ninja.colorController.colorPanelDrawn) { + this._fillColorCtrl.props = { side: 'top', align: 'center', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: -80 }; + this.application.ninja.colorController.addButton("chip", this._fillColorCtrl); + + this._fillColorCtrl.addEventListener("change", this.handleFillColorChange.bind(this), false); + + this.addedColorChips = true; + } + + if (this.addedColorChips) { + this._fillColorCtrl.color(this._fill.colorMode, this._fill.color); + } + } + }, + _subPrepare: { value: function() { this.handleChange(null); @@ -37,6 +76,13 @@ exports.BrushProperties = Montage.create(ToolProperties, { } }, + handleFillColorChange: { + value: function (e) { + this.fill = e._event; + this.fill.webGlColor = this.application.ninja.colorController.colorModel.colorToWebGl(e._event.color); + } + }, + strokeSize: { get: function() { return this._strokeSize; } }, -- cgit v1.2.3 From 1196fcee1c7e5e86edb387cdbc1b08d40926ca15 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Mon, 7 May 2012 17:39:30 -0700 Subject: Fixed missing quote from last merge --- .../tools-properties/brush-properties.reel/brush-properties.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/components/tools-properties/brush-properties.reel') diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.html b/js/components/tools-properties/brush-properties.reel/brush-properties.html index 38b317e2..a820dd04 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.html +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html @@ -91,7 +91,7 @@
- +
-- cgit v1.2.3 From 18370abcf406c6ab36d5c5f2613cb79e756ff6d2 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Wed, 9 May 2012 18:07:32 -0700 Subject: -Consolidated many redundant css classes used in the tool options bars --- .../brush-properties.reel/brush-properties.css | 21 --------------------- .../brush-properties.reel/brush-properties.html | 6 +++--- 2 files changed, 3 insertions(+), 24 deletions(-) (limited to 'js/components/tools-properties/brush-properties.reel') diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.css b/js/components/tools-properties/brush-properties.reel/brush-properties.css index 0912dd7e..102a79db 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.css +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.css @@ -4,25 +4,4 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ - .optionsBrushTool { - padding: 6px; -} - .optionsBrushTool > * { - float:left; -} - - .optionsBrushTool .fillColorCtrl { - width: 20px; - height: 18px; - margin-left: 3px; - margin-right: 8px; - border: 1px black solid; -} - - .optionsBrushTool .colorCtrlIcon { - width: 20px; - height: 20px; - -webkit-transform: scale(0.8); - background-color: rgb(40, 40, 40); -} \ No newline at end of file diff --git a/js/components/tools-properties/brush-properties.reel/brush-properties.html b/js/components/tools-properties/brush-properties.reel/brush-properties.html index a820dd04..7d99a42a 100755 --- a/js/components/tools-properties/brush-properties.reel/brush-properties.html +++ b/js/components/tools-properties/brush-properties.reel/brush-properties.html @@ -80,9 +80,9 @@ -
-
-
+
+
+
 
-- cgit v1.2.3