- Stroke: -

+ Stroke: +

diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.js b/js/components/tools-properties/pen-properties.reel/pen-properties.js index b57f9a6f..cd205e07 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.js +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.js @@ -7,8 +7,87 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage; var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties; -exports.PenProperties = Montage.create(ToolProperties, { +var PenProperties = exports.PenProperties = Montage.create(ToolProperties, { + addedColorChips: { value: false }, + + _fill: { + enumerable: false, + value: { colorMode: 'rgb', color: { r: 255, g: 255, b: 255, a: 1, css: 'rgb(255,255,255)', mode: 'rgb', wasSetByCode: true, type: 'change' }, webGlColor: [1, 1, 1, 1] } + }, + + _stroke: { + 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] } + }, + + stroke: { + enumerable: true, + get: function () { + return this._stroke; + }, + set: function (value) { + if (value !== this._stroke) { + this._stroke = value; + } + } + }, + + fill: { + enumerable: true, + get: function () { + return this._fill; + }, + set: function (value) { + if (value !== this._fill) { + this._fill = value; + } + } + }, + strokeSize: { - get: function() { return this._strokeSize; } + get: function () { + return this._strokeSize; + } + }, + + draw: { + enumerable: false, + value: function () { + Object.getPrototypeOf(PenProperties).draw.call(this); + + if (this.addedColorChips === false && this.application.ninja.colorController.colorPanelDrawn) { + // setup fill color + 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); + + // setup stroke color + this._strokeColorCtrl.props = { side: 'top', align: 'center', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: -80 }; + this.application.ninja.colorController.addButton("chip", this._strokeColorCtrl); + + this._fillColorCtrl.addEventListener("change", this.handleFillColorChange.bind(this), false); + this._strokeColorCtrl.addEventListener("change", this.handleStrokeColorChange.bind(this), false); + + this.addedColorChips = true; + } + + if (this.addedColorChips) { + this._fillColorCtrl.color(this._fill.colorMode, this._fill.color); + this._strokeColorCtrl.color(this._stroke.colorMode, this._stroke.color); + } + } + }, + + handleFillColorChange: { + value: function (e) { + this.fill = e._event; + this.fill.webGlColor = this.application.ninja.colorController.colorModel.colorToWebGl(e._event.color); + } + }, + + handleStrokeColorChange: { + value: function (e) { + this.stroke = e._event; + this.stroke.webGlColor = this.application.ninja.colorController.colorModel.colorToWebGl(e._event.color); + } } }); \ No newline at end of file -- 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 --- .../tools-properties/pen-properties.reel/pen-properties.css | 8 +++++--- .../tools-properties/pen-properties.reel/pen-properties.html | 5 +++-- 2 files changed, 8 insertions(+), 5 deletions(-) (limited to 'js/components/tools-properties/pen-properties.reel') diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.css b/js/components/tools-properties/pen-properties.reel/pen-properties.css index 01a0ca1f..d08d0abd 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.css +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.css @@ -4,7 +4,6 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ - .optionsPenTool { padding: 6px; } @@ -16,11 +15,14 @@ .optionsPenTool .fillColorCtrl, .optionsPenTool .strokeColorCtrl { width: 20px; height: 18px; - margin: 2px 6px; + margin-left: 3px; + margin-right: 8px; + border: 1px black solid; } .optionsPenTool .colorCtrlIcon { width: 20px; height: 20px; - background-color: rgb(54, 54, 54); + -webkit-transform: scale(0.8); + background-color: rgb(40, 40, 40); } \ No newline at end of file diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.html b/js/components/tools-properties/pen-properties.reel/pen-properties.html index 176663df..9bae188e 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.html +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.html @@ -40,10 +40,11 @@

Stroke:

-- 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 --- .../pen-properties.reel/pen-properties.css | 16 ---------------- .../pen-properties.reel/pen-properties.html | 8 ++++---- 2 files changed, 4 insertions(+), 20 deletions(-) (limited to 'js/components/tools-properties/pen-properties.reel') diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.css b/js/components/tools-properties/pen-properties.reel/pen-properties.css index d08d0abd..c6e68195 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.css +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.css @@ -5,24 +5,8 @@ */ .optionsPenTool { - padding: 6px; } .optionsPenTool > * { float:left; } - - .optionsPenTool .fillColorCtrl, .optionsPenTool .strokeColorCtrl { - width: 20px; - height: 18px; - margin-left: 3px; - margin-right: 8px; - border: 1px black solid; -} - - .optionsPenTool .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/pen-properties.reel/pen-properties.html b/js/components/tools-properties/pen-properties.reel/pen-properties.html index 446b0a02..324d1070 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.html +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.html @@ -40,10 +40,10 @@

Stroke:

-- cgit v1.2.3 From 035c851a955952d0a1c89a7c8a646b674ab3f4f2 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Tue, 15 May 2012 10:42:41 -0700 Subject: -fixed spacing problem in the tag tool -implemented the new mode radio buttons for the pen tool --- .../pen-properties.reel/pen-properties.css | 6 ------ .../pen-properties.reel/pen-properties.html | 14 ++++++++++++-- 2 files changed, 12 insertions(+), 8 deletions(-) (limited to 'js/components/tools-properties/pen-properties.reel') diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.css b/js/components/tools-properties/pen-properties.reel/pen-properties.css index c6e68195..7f1b0f7f 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.css +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.css @@ -4,9 +4,3 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ - .optionsPenTool { -} - - .optionsPenTool > * { - float:left; -} diff --git a/js/components/tools-properties/pen-properties.reel/pen-properties.html b/js/components/tools-properties/pen-properties.reel/pen-properties.html index 324d1070..e720eb84 100755 --- a/js/components/tools-properties/pen-properties.reel/pen-properties.html +++ b/js/components/tools-properties/pen-properties.reel/pen-properties.html @@ -28,18 +28,28 @@ "prototype": "js/components/tools-properties/pen-properties.reel", "properties": { "element": {"#": "penProperties"}, + + "_penToolRadio": {"#": "penTool"}, + "_penPlusRadio": {"#": "penPlus"}, + "_penMinusRadio": {"#": "penMinus"}, + "_fillColorCtrl": {"#": "fillColorCtrl"}, "_strokeColorCtrl": {"#": "strokeColorCtrl"}, "_strokeSize": {"@": "strokeSizeHT"} } } } - + -

+ + + +

-- cgit v1.2.3