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