aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Color/colortoolbar.reel/colortoolbar.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Color/colortoolbar.reel/colortoolbar.js')
-rw-r--r--js/panels/Color/colortoolbar.reel/colortoolbar.js176
1 files changed, 176 insertions, 0 deletions
diff --git a/js/panels/Color/colortoolbar.reel/colortoolbar.js b/js/panels/Color/colortoolbar.reel/colortoolbar.js
new file mode 100644
index 00000000..19fe7b85
--- /dev/null
+++ b/js/panels/Color/colortoolbar.reel/colortoolbar.js
@@ -0,0 +1,176 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7////////////////////////////////////////////////////////////////////////
8//
9var Montage = require("montage/core/core").Montage,
10 Component = require("montage/ui/component").Component;
11////////////////////////////////////////////////////////////////////////
12//
13exports.ColorToolbar = Montage.create(Component, {
14 ////////////////////////////////////////////////////////////////////
15 //
16 hasTemplate: {
17 value: true
18 },
19 ////////////////////////////////////////////////////////////////////
20 //Storing stroke (stores color in mode use to select color)
21 _stroke: {
22 enumerable: false,
23 value: {colorMode: 'rgb', color: {r: 0, g: 0, b: 0, a: 1, css: 'rgb(0,0,0)'}, webGlColor: [0, 0, 0, 1]}
24 },
25 ////////////////////////////////////////////////////////////////////
26 //
27 stroke: {
28 enumerable: true,
29 get: function() {
30 return this._stroke;
31 },
32 set: function(value) {
33 if (value !== this._stroke) {
34 this._stroke = value;
35 }
36 }
37 },
38 ////////////////////////////////////////////////////////////////////
39 //Storing fill (stores color in mode use to select color)
40 _fill: {
41 enumerable: false,
42 value: {colorMode: 'rgb', color: {r: 255, g: 255, b: 255, a: 1, css: 'rgb(255,255,255)'}, webGlColor: [1, 1, 1, 1]}
43 },
44 ////////////////////////////////////////////////////////////////////
45 //
46 fill: {
47 enumerable: true,
48 get: function() {
49 return this._fill;
50 },
51 set: function(value) {
52 if (value !== this._fill) {
53 this._fill = value;
54 }
55 }
56 },
57 ////////////////////////////////////////////////////////////////////
58 //
59 prepareForDraw: {
60 enumerable: false,
61 value: function () {
62 //
63 }
64 },
65 ////////////////////////////////////////////////////////////////////
66 //
67 willDraw: {
68 enumerable: false,
69 value: function() {
70 //
71 var buttons = this.element.getElementsByTagName('button');
72 //
73 this.fill_btn = buttons [1];
74 this.stroke_btn = buttons[0];
75 //
76 this.fill_btn.props = {side: 'left', align: 'top', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: 20};
77 this.stroke_btn.props = {side: 'left', align: 'top', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: 20};
78 }
79 },
80 ////////////////////////////////////////////////////////////////////
81 //
82 draw: {
83 enumerable: false,
84 value: function() {
85 //
86 this.application.ninja.colorController.addButton('chip', this.fill_btn);
87 this.application.ninja.colorController.addButton('chip', this.stroke_btn);
88 //
89 this.fill_btn.color('rgb', {wasSetByCode: false, type: 'change', color: {r: 255, g: 255, b: 255}, css: 'rgb(255,255,255)'});
90 this.stroke_btn.color('rgb', {wasSetByCode: false, type: 'change', color: {r: 0, g: 0, b: 0}, css: 'rgb(0,0,0)'});
91 }
92 },
93 ////////////////////////////////////////////////////////////////////
94 //
95 didDraw: {
96 enumerable: false,
97 value: function() {
98 //
99 this.fill_btn.addEventListener('change', function (e) {
100 //
101 var temp;
102 //
103 this.fill = e._event;
104 //
105 if (e._event.color && e._event.color.l) {
106 temp = this.application.ninja.colorController.colorModel.hslToRgb(e._event.color.h/360, e._event.color.s/100, e._event.color.l/100);
107 temp.a = e._event.color.a;
108 } else if (e._event.color && e._event.color.r){
109 temp = e._event.color;
110 temp.a = e._event.color.a;
111 } else {
112 temp = null;
113 }
114 //WebGL uses array
115 if (temp) {
116 this.fill.webGlColor = [temp.r/255, temp.g/255, temp.b/255, temp.a];
117 } else {
118 this.fill.webGlColor = null;
119 }
120 //
121 this.application.ninja.colorController.colorModel.input = 'fill';
122 //
123 var color = e._event.color;
124 if (e._event.colorMode !== 'nocolor' && color) {
125 color.wasSetByCode = false;
126 color.type = 'change';
127 this.application.ninja.colorController.colorModel[e._event.colorMode] = color;
128 } else {
129 this.application.ninja.colorController.colorModel.applyNoColor();
130 }
131 //
132 this.application.ninja.colorController.colorModel.input = 'chip';
133 }.bind(this));
134 //
135 this.stroke_btn.addEventListener('change', function (e) {
136 //
137 var temp;
138 //
139 this.stroke = e._event;
140 //
141 if (e._event.color && e._event.color.l) {
142 temp = this.application.ninja.colorController.colorModel.hslToRgb(e._event.color.h/360, e._event.color.s/100, e._event.color.l/100);
143 temp.a = e._event.color.a;
144 } else if (e._event.color && e._event.color.r){
145 temp = e._event.color;
146 temp.a = e._event.color.a;
147 } else {
148 temp = null;
149 }
150 //WebGL uses array
151 if (temp) {
152 this.stroke.webGlColor = [temp.r/255, temp.g/255, temp.b/255, temp.a];
153 } else {
154 this.stroke.webGlColor = null;
155 }
156 //
157 this.application.ninja.colorController.colorModel.input = 'stroke';
158 //
159 var color = e._event.color;
160 if (e._event.colorMode !== 'nocolor' && color) {
161 color.wasSetByCode = false;
162 color.type = 'change';
163 this.application.ninja.colorController.colorModel[e._event.colorMode] = color;
164 } else {
165 this.application.ninja.colorController.colorModel.applyNoColor();
166 }
167 //
168 this.application.ninja.colorController.colorModel.input = 'chip';
169 }.bind(this));
170 }
171 }
172 ////////////////////////////////////////////////////////////////////
173 ////////////////////////////////////////////////////////////////////
174});
175////////////////////////////////////////////////////////////////////////
176//////////////////////////////////////////////////////////////////////// \ No newline at end of file