- -

Border:

@@ -181,25 +180,22 @@

Stroke:

- - - Use WebGL - +

+ + Use WebGL -

Materials: -

- +

-- 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 --- .../ink-bottle-properties.css | 24 ++-------------------- .../ink-bottle-properties.html | 4 +++- 2 files changed, 5 insertions(+), 23 deletions(-) (limited to 'js/components/tools-properties/ink-bottle-properties.reel') diff --git a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.css b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.css index 4136339c..3dba17b6 100755 --- a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.css +++ b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.css @@ -4,21 +4,9 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ -.toolOptionsFloatChildren > * { - float:left; -} - -.inkBottleOptions { - padding: 6px; -} -.inkBottleOptions .nj-divider { - margin-left: 16px; - margin-right: 16px; -} - -.toolOptionsFloatChildren select.nj-skinned { - margin-top: 2px; +.inkBottleOptions select.nj-skinned { + margin-top: 2px; } .inkBottleOptions label.disabled { @@ -35,11 +23,3 @@ background-color: transparent; cursor:default; } - -.inkBottleOptions .colorCtrlIcon { - width: 20px; - height: 20px; - margin-top: 2px; - -webkit-transform: scale(0.8); - background-color: rgb(40, 40, 40); -} \ No newline at end of file diff --git a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html index 148c71e3..f5b1851f 100755 --- a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html +++ b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html @@ -180,7 +180,9 @@

@@ -194,7 +196,7 @@

Materials: -

-- 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 --- .../ink-bottle-properties.html | 8 +++- .../ink-bottle-properties.js | 48 +++++++++++++++++++++- 2 files changed, 54 insertions(+), 2 deletions(-) (limited to 'js/components/tools-properties/ink-bottle-properties.reel') diff --git a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html index f5b1851f..3ac0b261 100755 --- a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html +++ b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html @@ -136,6 +136,8 @@ "properties": { "element": {"#": "inkBottleProperties"}, + "_strokeColorCtrl": {"#": "strokeColorCtrl"}, + "useBorderWidth": {"@": "borderWidthCh"}, "borderWidthLabel": {"@": "borderWidthLabel"}, "_borderWidth": {"@": "borderWidthHT"}, @@ -154,13 +156,17 @@ } } } - +

+ Border:

diff --git a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js index 6d5c46f6..945df857 100755 --- a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js +++ b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js @@ -8,7 +8,53 @@ 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.InkBottleProperties = Montage.create(ToolProperties, { +var InkBottleProperties = exports.InkBottleProperties = Montage.create(ToolProperties, { + addedColorChips: { value: false }, + + _stroke: { + 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: true, + get: function () { + return this._stroke; + }, + set: function (value) { + if (value !== this._stroke) { + this._stroke = value; + } + } + }, + + draw: { + enumerable: false, + value: function () { + Object.getPrototypeOf(InkBottleProperties).draw.call(this); + + if (this.addedColorChips === false && this.application.ninja.colorController.colorPanelDrawn) { + // 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._strokeColorCtrl.addEventListener("change", this.handleStrokeColorChange.bind(this), false); + + this.addedColorChips = true; + } + + if (this.addedColorChips) { + this._strokeColorCtrl.color(this._stroke.colorMode, this._stroke.color); + } + } + }, + + handleStrokeColorChange: { + value: function (e) { + this.stroke = e._event; + this.stroke.webGlColor = this.application.ninja.colorController.colorModel.colorToWebGl(e._event.color); + } + }, _subPrepare: { value: function() { -- cgit v1.2.3