aboutsummaryrefslogtreecommitdiff
path: root/js/panels/color/colorpopup-manager.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/color/colorpopup-manager.js')
-rwxr-xr-xjs/panels/color/colorpopup-manager.js529
1 files changed, 529 insertions, 0 deletions
diff --git a/js/panels/color/colorpopup-manager.js b/js/panels/color/colorpopup-manager.js
new file mode 100755
index 00000000..d6d94807
--- /dev/null
+++ b/js/panels/color/colorpopup-manager.js
@@ -0,0 +1,529 @@
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 ColorChipPopup = require("js/panels/Color/colorchippopup.reel").ColorChipPopup,
12 ColorPanelPopup = require("js/panels/Color/colorpanelpopup.reel").ColorPanelPopup;
13////////////////////////////////////////////////////////////////////////
14//Exporting as ColorPopupManager
15exports.ColorPopupManager = Montage.create(Component, {
16 ////////////////////////////////////////////////////////////////////
17 //
18 hasTemplate: {
19 value: false
20 },
21 ////////////////////////////////////////////////////////////////////
22 //
23 _hasInit: {
24 value: false
25 },
26 ////////////////////////////////////////////////////////////////////
27 //
28 init: {
29 enumerable: false,
30 value: function () {
31 ////////////////////////////////////////////////////////////
32 //TODO: Improve logic on handling closing the popup
33 ////////////////////////////////////////////////////////////
34 //Hiding popup on any panel(s) actions
35 this.eventManager.addEventListener("panelOrderChanged", function (e) {
36 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
37 }.bind(this));
38 //
39 this.eventManager.addEventListener("panelClose", function (e) {
40 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
41 }.bind(this));
42 //
43 this.eventManager.addEventListener("panelCollapsed", function (e) {
44 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
45 }.bind(this));
46 //
47 this.eventManager.addEventListener("panelSelected", function (e) {
48 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
49 }.bind(this));
50 //
51 this.eventManager.addEventListener("togglePanel", function (e) {
52 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
53 }.bind(this));
54 //
55 this.eventManager.addEventListener("panelResizing", function (e) {
56 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
57 }.bind(this));
58 //
59 this.eventManager.addEventListener("panelResizedStart", function (e) {
60 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
61 }.bind(this));
62 //
63 this.eventManager.addEventListener("panelResizedEnd", function (e) {
64 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
65 }.bind(this));
66 //
67 window.addEventListener('resize', function (e) {
68 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
69 }.bind(this));
70 //
71 document.addEventListener('mousedown', function (e) {
72 //
73 if (e._event.srcElement.id === 'stageCanvas' || e._event.srcElement.id === 'mainContainer' || e._event.srcElement.id === 'drawingCanvas') {
74 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
75 }
76 }.bind(this));
77 ////////////////////////////////////////////////////////////
78 }
79 },
80 ////////////////////////////////////////////////////////////////////
81 //
82 _popupPanel: {
83 enumerable: false,
84 value: {}
85 },
86 ////////////////////////////////////////////////////////////////////
87 //
88 _popupChip: {
89 enumerable: false,
90 value: {}
91 },
92 ////////////////////////////////////////////////////////////////////
93 //
94 _popupBase: {
95 enumerable: false,
96 value: null
97 },
98 ////////////////////////////////////////////////////////////////////
99 //
100 _popupChipBase: {
101 enumerable: false,
102 value: null
103 },
104 ////////////////////////////////////////////////////////////////////
105 //Storing color manager
106 _colorManager: {
107 enumerable: false,
108 value: null
109 },
110 ////////////////////////////////////////////////////////////////////
111 //
112 colorManager: {
113 enumerable: true,
114 get: function() {
115 return this._colorManager;
116 },
117 set: function(value) {
118 this._colorManager = value;
119 }
120 },
121
122
123
124 //TODO: Remove, figure out offset bug
125 _hackOffset: {
126 enumerable: true,
127 value: false
128 },
129
130
131 _colorPopupDrawing: {
132 enumerable: true,
133 value: false
134 },
135 _colorChipPopupDrawing: {
136 enumerable: true,
137 value: false
138 },
139
140
141
142 ////////////////////////////////////////////////////////////////////
143 //TODO: Remove and use montage's built in component
144 showColorPopup: {
145 enumerable: true,
146 value: function (x, y, side, align) {
147 if (this._colorPopupDrawing) {
148 return;
149 }
150 if (this._popupPanel.opened) {
151 //Toogles if called and opened
152 this.hideColorPopup();
153 } else {
154 this._colorPopupDrawing = true;
155 ////////////////////////////////////////////////////
156 //Initializing events
157 if (!this._hasinit) {
158 this.init();
159 this._hasinit = true;
160 }
161 ////////////////////////////////////////////////////
162 //Creating popup from m-js component
163 var popup = document.createElement('div');
164 document.body.appendChild(popup);
165 //
166 this._popupBase = ColorPanelPopup.create();
167 this._popupBase.element = popup;
168 this._popupBase.props = {x: x, y: y, side: side, align: align};
169 this._popupBase.colorManager = this.colorManager;
170 //TODO: Remove
171 if (this._hackOffset) {
172 this._popupBase.hack = {x: 53, y: 235};
173 } else {
174 this._hackOffset = true;
175 this._popupBase.hack = {x: 0, y: 0};
176 }
177 //
178 this._popupBase.addEventListener('change', this, false);
179 this._popupBase.addEventListener('changing', this, false);
180 //
181 this._popupBase.needsDraw = true;
182 this._popupBase.addEventListener('firstDraw', this, false);
183 }
184 }
185 },
186 ////////////////////////////////////////////////////////////////////
187 //
188 hideColorPopup: {
189 enumerable: true,
190 value: function () {
191 if (this._popupPanel.opened) {
192 //
193 this._popupPanel.popup.removeEventListener('didDraw', this, false);
194 //
195 this.hideColorChipPopup();
196 //Making sure to return color manager to either stroke or fill (might be a Hack for now)
197 if (this.colorManager.input !== 'stroke' && this.colorManager.input !== 'fill' && this.application.ninja.colorController.colorView.previousInput) {
198 this.colorManager.input = this.application.ninja.colorController.colorView.previousInput;
199 }
200 //
201 this.application.ninja.popupManager.removePopup(this._popupPanel.popup.element);
202 this._popupPanel.opened = false;
203 //TODO: Fix HACK of removing popup
204 this._popupPanel.popup.base.destroy();
205 this._popupPanel.popup = null;
206 } else if (this._popupChip.opened) {
207 this.hideColorChipPopup();
208 //Making sure to return color manager to either stroke or fill (might be a Hack for now)
209 if (this.colorManager.input !== 'stroke' && this.colorManager.input !== 'fill' && this.application.ninja.colorController.colorView.previousInput) {
210 this.colorManager.input = this.application.ninja.colorController.colorView.previousInput;
211 }
212 }
213 }
214 },
215 ////////////////////////////////////////////////////////////////////
216 //
217 colorChipChange: {
218 enumerable: true,
219 value: function (e) {
220 //e._event.srcElement.style.backgroundColor = '#'+e._event.hex;
221 //this.colorManager.removeEventListener('change', this, false);
222 //
223 var ctx, cvs = this.application.ninja.colorController.colorView.currentChip.getElementsByTagName('canvas')[0];
224 //if (cvs && color) {
225 if (cvs) {
226 ctx = cvs.getContext('2d');
227