aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Color/colorpopup-manager.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Color/colorpopup-manager.js')
-rw-r--r--js/panels/Color/colorpopup-manager.js543
1 files changed, 543 insertions, 0 deletions
diff --git a/js/panels/Color/colorpopup-manager.js b/js/panels/Color/colorpopup-manager.js
new file mode 100644
index 00000000..943ec7e7
--- /dev/null
+++ b/js/panels/Color/colorpopup-manager.js
@@ -0,0 +1,543 @@
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('click', 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 //
165 this._popupBase = ColorPanelPopup.create();
166 this._popupBase.content = document.createElement('div');
167 this._popupBase.props = {x: x, y: y, side: side, align: align};
168
169 if (this._hackOffset) {
170 this._popupBase.hack = {x: 53, y: 235};
171 } else {
172 this._hackOffset = true;
173 this._popupBase.hack = {x: 0, y: 0};
174 }
175 //
176 document.body.appendChild(popup);
177 document.body.appendChild(this._popupBase.content);
178 //Setting color panel for reference when drawing
179 //this._popupBase.colorPanel = this;
180 this._popupBase.colorManager = this.colorManager;
181 //Setting up events
182 this._popupBase.addEventListener('change', this, false);
183 this._popupBase.addEventListener('changing', this, false);
184 //TODO: Use m-js popup or check m-js fix of nested drawing components
185 this._popupBase.element = popup;
186 this._popupBase.needsDraw = true;
187 //Adding drawn element to container
188 this._popupBase.content.appendChild(this._popupBase.element);
189 //Waiting for content to drawn before loading popup
190 this._popupBase.addEventListener('firstDraw', this, false);
191 }
192 }
193 },
194 ////////////////////////////////////////////////////////////////////
195 //
196 hideColorPopup: {
197 enumerable: true,
198 value: function () {
199 if (this._popupPanel.opened) {
200 //
201 this._popupPanel.popup.removeEventListener('didDraw', this, false);
202 //
203 this.hideColorChipPopup();
204 //Making sure to return color manager to either stroke or fill (might be a Hack for now)
205 if (this.colorManager.input !== 'stroke' && this.colorManager.input !== 'fill' && this.application.ninja.colorController.colorView.previousInput) {
206 this.colorManager.input = this.application.ninja.colorController.colorView.previousInput;
207 }
208 //
209 this.application.ninja.popupManager.removePopup(this._popupPanel.popup.element);
210 this._popupPanel.opened = false;
211 //TODO: Fix HACK of removing popup
212 this._popupPanel.popup.base.destroy();
213 this._popupPanel.popup = null;
214 } else if (this._popupChip.opened) {
215 this.hideColorChipPopup();
216 //Making sure to return color manager to either stroke or fill (might be a Hack for now)
217 if (this.colorManager.input !== 'stroke' && this.colorManager.input !== 'fill' && this.application.ninja.colorController.colorView.previousInput) {
218 this.colorManager.input = this.application.ninja.colorController.colorView.previousInput;
219 }
220 }
221 }
222 },
223 ////////////////////////////////////////////////////////////////////
224 //
225 colorChipChange: {
226 enumerable: true,