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 --- .../tools-properties/fill-properties.reel/fill-properties.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/components/tools-properties/fill-properties.reel') diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.html b/js/components/tools-properties/fill-properties.reel/fill-properties.html index b81b09ba..6532907e 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.html +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.html @@ -35,7 +35,7 @@
- +
-- cgit v1.2.3 From 33bb9b7e97e9ec3bd664b3e1c3e7297ba8d07ede Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Mon, 7 May 2012 15:44:18 -0700 Subject: more work on making subtool styling/layout consistent --- .../tools-properties/fill-properties.reel/fill-properties.css | 7 +++++++ .../tools-properties/fill-properties.reel/fill-properties.html | 5 ++--- 2 files changed, 9 insertions(+), 3 deletions(-) (limited to 'js/components/tools-properties/fill-properties.reel') diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.css b/js/components/tools-properties/fill-properties.reel/fill-properties.css index 7f1b0f7f..58b1c1e8 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.css +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.css @@ -4,3 +4,10 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ +.optionsFillTool { + padding: 6px; +} + + .optionsFillTool > * { + float:left; +} \ No newline at end of file diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.html b/js/components/tools-properties/fill-properties.reel/fill-properties.html index 6532907e..abc2e843 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.html +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.html @@ -34,9 +34,8 @@ -
- - +
+
-- cgit v1.2.3 From 9f0754eb0c619e9e33df707f24eed1dd6ae95096 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Tue, 8 May 2012 14:48:28 -0700 Subject: implemented proper styling for shape, inkbottle and fill tools make all icons for fill and stroke use the proper classes/images --- .../fill-properties.reel/fill-properties.css | 26 ++++++++++++++++++++-- .../fill-properties.reel/fill-properties.html | 9 ++++---- 2 files changed, 29 insertions(+), 6 deletions(-) (limited to 'js/components/tools-properties/fill-properties.reel') diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.css b/js/components/tools-properties/fill-properties.reel/fill-properties.css index 58b1c1e8..fa2e75e6 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.css +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.css @@ -7,7 +7,29 @@ .optionsFillTool { padding: 6px; } - - .optionsFillTool > * { +.optionsFillTool > * { + float:left; +} +.optionsFillTool > * > *{ float:left; +} + +.optionsFillTool label { + margin-right: 8px; +} +.optionsFillTool .colorCtrlIcon { + width: 20px; + height: 20px; + margin-top: 0px; + margin-left: 10px; + -webkit-transform: scale(0.8); + background-color: rgb(40, 40, 40); +} + +.materialsContainerOptions select { + margin-top: 2px; +} + +.materialsContainerOptions label { + margin-right: 0px; } \ No newline at end of file diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.html b/js/components/tools-properties/fill-properties.reel/fill-properties.html index fb59e2a8..9fb84a1b 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.html +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.html @@ -35,10 +35,11 @@
- -
- -
+ + +
+ +
-- 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 --- .../fill-properties.reel/fill-properties.css | 23 +--------------------- .../fill-properties.reel/fill-properties.html | 6 +++--- 2 files changed, 4 insertions(+), 25 deletions(-) (limited to 'js/components/tools-properties/fill-properties.reel') diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.css b/js/components/tools-properties/fill-properties.reel/fill-properties.css index fa2e75e6..606e73b3 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.css +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.css @@ -4,32 +4,11 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ -.optionsFillTool { - padding: 6px; -} -.optionsFillTool > * { - float:left; -} -.optionsFillTool > * > *{ - float:left; -} - -.optionsFillTool label { - margin-right: 8px; -} -.optionsFillTool .colorCtrlIcon { - width: 20px; - height: 20px; - margin-top: 0px; - margin-left: 10px; - -webkit-transform: scale(0.8); - background-color: rgb(40, 40, 40); -} .materialsContainerOptions select { margin-top: 2px; } .materialsContainerOptions label { - margin-right: 0px; + margin-right: 3px; } \ No newline at end of file diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.html b/js/components/tools-properties/fill-properties.reel/fill-properties.html index 9fb84a1b..975b4e6f 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.html +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.html @@ -34,12 +34,12 @@ -
+
-
+
-
+
-- cgit v1.2.3 From ba64dfa1d64969e290f15459a826171468fe3550 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Thu, 10 May 2012 15:10:58 -0700 Subject: put color chips in the inkbottle and fill tool --- .../fill-properties.reel/fill-properties.html | 9 +++- .../fill-properties.reel/fill-properties.js | 51 ++++++++++++++++++++-- 2 files changed, 56 insertions(+), 4 deletions(-) (limited to 'js/components/tools-properties/fill-properties.reel') diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.html b/js/components/tools-properties/fill-properties.reel/fill-properties.html index 975b4e6f..734966dc 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.html +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.html @@ -23,18 +23,25 @@ "prototype": "js/components/tools-properties/fill-properties.reel", "properties": { "element": {"#": "fillProperties"}, + + "_fillColorCtrl": {"#": "fillColorCtrl"}, + "_useWebGL": {"#": "useWebGLCH"}, "_materialsContainer": {"#": "materialsContainer"}, "_fillMaterial": {"@": "_fillMaterialCB"} } } } - +
+
+
+
 
+
diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.js b/js/components/tools-properties/fill-properties.reel/fill-properties.js index 61b667d7..ae136956 100755 --- a/js/components/tools-properties/fill-properties.reel/fill-properties.js +++ b/js/components/tools-properties/fill-properties.reel/fill-properties.js @@ -8,10 +8,55 @@ var Montage = require("montage/core/core").Montage, ShapesController = require("js/controllers/elements/shapes-controller").ShapesController, ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; -exports.FillProperties = Montage.create(ToolProperties, { +var FillProperties = exports.FillProperties = Montage.create(ToolProperties, { + + _use3D: { value: false }, + 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(FillProperties).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); + } + } + }, + + handleFillColorChange: { + value: function (e) { + this.fill = e._event; + this.fill.webGlColor = this.application.ninja.colorController.colorModel.colorToWebGl(e._event.color); + } + }, - _use3D: { value: false }, - _subPrepare: { value: function() { Object.defineBinding(this._fillMaterial, "items", { -- cgit v1.2.3