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 --- .../tag-properties.reel/tag-properties.css | 16 ++++++++ .../tag-properties.reel/tag-properties.html | 10 ++++- .../tag-properties.reel/tag-properties.js | 47 +++++++++++++++++++++- 3 files changed, 70 insertions(+), 3 deletions(-) (limited to 'js/components/tools-properties/tag-properties.reel') diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.css b/js/components/tools-properties/tag-properties.reel/tag-properties.css index 7f1b0f7f..7969dff9 100755 --- a/js/components/tools-properties/tag-properties.reel/tag-properties.css +++ b/js/components/tools-properties/tag-properties.reel/tag-properties.css @@ -4,3 +4,19 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ + .tagRadioButtons .fillColorCtrl { + width: 18px; + height: 18px; + margin-top: 6px; + margin-left: 3px; + margin-right: 8px; + border: 1px black solid; +} + + .tagRadioButtons .colorCtrlIcon { + width: 20px; + height: 20px; + margin-top: 6px; + -webkit-transform: scale(0.8); + background-color: rgb(40, 40, 40); +} \ No newline at end of file diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.html b/js/components/tools-properties/tag-properties.reel/tag-properties.html index c80ba36e..379c37a0 100755 --- a/js/components/tools-properties/tag-properties.reel/tag-properties.html +++ b/js/components/tools-properties/tag-properties.reel/tag-properties.html @@ -17,7 +17,9 @@ "properties": { "element": {"#": "tagProperties"}, - "divElement": {"#": "divTool"}, + "_fillColorCtrl": {"#": "fillColorCtrl"}, + + "divElement": {"#": "divTool"}, "imageElement": {"#": "imageTool"}, "videoElement": {"#": "videoTool"}, "canvasElement": {"#": "canvasTool"}, @@ -30,13 +32,17 @@ } } } - +

+

+

+

+ diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.js b/js/components/tools-properties/tag-properties.reel/tag-properties.js index 1caabc35..32063d9a 100755 --- a/js/components/tools-properties/tag-properties.reel/tag-properties.js +++ b/js/components/tools-properties/tag-properties.reel/tag-properties.js @@ -8,7 +8,7 @@ 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.TagProperties = Montage.create(ToolProperties, { +var TagProperties = exports.TagProperties = Montage.create(ToolProperties, { divElement: { value: null, enumerable: false }, imageElement: { value: null, enumerable: false }, videoElement: { value: null, enumerable: false }, @@ -17,6 +17,24 @@ exports.TagProperties = Montage.create(ToolProperties, { classField: { value: null, enumerable: false }, customName: { value: null, enumerable: false }, customLabel: { value: null, enumerable: false }, + addedColorChips: { value: false }, + + _fill: { + enumerable: false, + value: { colorMode: 'nocolor', color: null, webGlColor: null } + }, + + fill: { + enumerable: true, + get: function () { + return this._fill; + }, + set: function (value) { + if (value !== this._fill) { + this._fill = value; + } + } + }, _subPrepare: { value: function() { @@ -31,6 +49,33 @@ exports.TagProperties = Montage.create(ToolProperties, { } }, + draw: { + enumerable: false, + value: function () { + Object.getPrototypeOf(TagProperties).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); + } + }, + handleClick: { value: function(event) { this.selectedElement = event._event.target.id; -- cgit v1.2.3 From 7dedf0735eec1d227b21291e1bb43dcdec93cbf3 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Tue, 8 May 2012 09:55:02 -0700 Subject: -Removed id dependence of the tag tool options CSS -Separated the options3d CSS from the tag tool options css -Removed unused translateObjectToolContainer CSS class --- .../tools-properties/tag-properties.reel/tag-properties.html | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'js/components/tools-properties/tag-properties.reel') diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.html b/js/components/tools-properties/tag-properties.reel/tag-properties.html index 9dbef6f6..bd4590ce 100755 --- a/js/components/tools-properties/tag-properties.reel/tag-properties.html +++ b/js/components/tools-properties/tag-properties.reel/tag-properties.html @@ -38,16 +38,16 @@