diff options
author | Armen Kesablyan | 2012-02-07 16:55:34 -0800 |
---|---|---|
committer | Armen Kesablyan | 2012-02-07 16:55:34 -0800 |
commit | 10f0ad4c15f090b2d0d50d11e4c7aaf291e9eb0e (patch) | |
tree | 12b31910a3c7c7fa2ee0b26d8aaa611710e139a5 /js/panels/Color | |
parent | 7f8730c3add146f1ba107e6fc22d1f5a8348ed8b (diff) | |
parent | 668510892537eaaeb2e11520831d87b44b2489b7 (diff) | |
download | ninja-10f0ad4c15f090b2d0d50d11e4c7aaf291e9eb0e.tar.gz |
Merge branch 'master' of github.com:Motorola-Mobility/ninja-internal into text-tool
Conflicts:
_scss/compass_app_log.txt
css/ninja.css
Diffstat (limited to 'js/panels/Color')
-rw-r--r-- | js/panels/Color/colorchippopup.reel/colorchippopup.js | 2 | ||||
-rw-r--r-- | js/panels/Color/colorpopup-manager.js | 64 | ||||
-rw-r--r-- | js/panels/Color/colortoolbar.reel/colortoolbar.js | 68 |
3 files changed, 41 insertions, 93 deletions
diff --git a/js/panels/Color/colorchippopup.reel/colorchippopup.js b/js/panels/Color/colorchippopup.reel/colorchippopup.js index 03e14b28..05bcb447 100644 --- a/js/panels/Color/colorchippopup.reel/colorchippopup.js +++ b/js/panels/Color/colorchippopup.reel/colorchippopup.js | |||
@@ -109,7 +109,7 @@ exports.ColorChipPopup = Montage.create(Component, { | |||
109 | this.cc_hexinput.labelFunction = this._hexLabel.bind(this); | 109 | this.cc_hexinput.labelFunction = this._hexLabel.bind(this); |
110 | this.cc_hexinput.inputFunction = this._hexInput.bind(this); | 110 | this.cc_hexinput.inputFunction = this._hexInput.bind(this); |
111 | // | 111 | // |
112 | if (this.application.ninja.colorController.colorView.currentChip && this.application.ninja.colorController.colorView.currentChip.colorValue.a) { | 112 | if (this.application.ninja.colorController.colorView.currentChip && this.application.ninja.colorController.colorView.currentChip.colorValue && this.application.ninja.colorController.colorView.currentChip.colorValue.a) { |
113 | this.combo.slider.value = Math.round(this.application.ninja.colorController.colorView.currentChip.colorValue.a*100); | 113 | this.combo.slider.value = Math.round(this.application.ninja.colorController.colorView.currentChip.colorValue.a*100); |
114 | } else { | 114 | } else { |
115 | this.combo.slider.value = 100; | 115 | this.combo.slider.value = 100; |
diff --git a/js/panels/Color/colorpopup-manager.js b/js/panels/Color/colorpopup-manager.js index 943ec7e7..a4c9a8c2 100644 --- a/js/panels/Color/colorpopup-manager.js +++ b/js/panels/Color/colorpopup-manager.js | |||
@@ -161,11 +161,13 @@ exports.ColorPopupManager = Montage.create(Component, { | |||
161 | //////////////////////////////////////////////////// | 161 | //////////////////////////////////////////////////// |
162 | //Creating popup from m-js component | 162 | //Creating popup from m-js component |
163 | var popup = document.createElement('div'); | 163 | var popup = document.createElement('div'); |
164 | document.body.appendChild(popup); | ||
164 | // | 165 | // |
165 | this._popupBase = ColorPanelPopup.create(); | 166 | this._popupBase = ColorPanelPopup.create(); |
166 | this._popupBase.content = document.createElement('div'); | 167 | this._popupBase.element = popup; |
167 | this._popupBase.props = {x: x, y: y, side: side, align: align}; | 168 | this._popupBase.props = {x: x, y: y, side: side, align: align}; |
168 | 169 | this._popupBase.colorManager = this.colorManager; | |
170 | //TODO: Remove | ||
169 | if (this._hackOffset) { | 171 | if (this._hackOffset) { |
170 | this._popupBase.hack = {x: 53, y: 235}; | 172 | this._popupBase.hack = {x: 53, y: 235}; |
171 | } else { | 173 | } else { |
@@ -173,20 +175,10 @@ exports.ColorPopupManager = Montage.create(Component, { | |||
173 | this._popupBase.hack = {x: 0, y: 0}; | 175 | this._popupBase.hack = {x: 0, y: 0}; |
174 | } | 176 | } |
175 | // | 177 | // |
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); | 178 | this._popupBase.addEventListener('change', this, false); |
183 | this._popupBase.addEventListener('changing', this, false); | 179 | this._popupBase.addEventListener('changing', this, false); |
184 | //TODO: Use m-js popup or check m-js fix of nested drawing components | 180 | // |
185 | this._popupBase.element = popup; | 181 | this._popupBase.needsDraw = true; |
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); | 182 | this._popupBase.addEventListener('firstDraw', this, false); |
191 | } | 183 | } |
192 | } | 184 | } |
@@ -286,41 +278,33 @@ exports.ColorPopupManager = Montage.create(Component, { | |||
286 | //////////////////////////////////////////////////// | 278 | //////////////////////////////////////////////////// |
287 | //Creating popup from m-js component | 279 | //Creating popup from m-js component |
288 | var popup = document.createElement('div'); | 280 | var popup = document.createElement('div'); |
281 | document.body.appendChild(popup); | ||
289 | // | 282 | // |
290 | this._popupChipBase = ColorChipPopup.create(); | ||
291 | this._popupChipBase.content = document.createElement('div'); | ||
292 | this._popupChip.event = e._event; | 283 | this._popupChip.event = e._event; |
293 | // | 284 | this._popupChipBase = ColorChipPopup.create(); |
285 | this._popupChipBase.element = popup; | ||
286 | this._popupChipBase.colorManager = this.colorManager; | ||
294 | if (e._event.srcElement.props) { | 287 | if (e._event.srcElement.props) { |
295 | this.colorChipProps = e._event.srcElement.props; | 288 | this.colorChipProps = e._event.srcElement.props; |
296 | } else { | 289 | } else { |
297 | this.colorChipProps = {side: 'top', align: 'center', wheel: true, palette: true, gradient: true, image: true, panel: false}; | 290 | this.colorChipProps = {side: 'top', align: 'center', wheel: true, palette: true, gradient: true, image: true, panel: false}; |
298 | } | 291 | } |
299 | // | 292 | // |
300 | if (!this.colorChipProps.panel) { | 293 | if (!this.colorChipProps.panel) { |
301 | this.hideColorPopup(); | 294 | this.hideColorPopup(); |
302 | } | 295 | } |
303 | // | 296 | // |
304 | document.body.appendChild(popup); | 297 | this._popupChipBase.popupModes = {}; |
305 | document.body.appendChild(this._popupChipBase.content); | ||
306 | //Setting color panel for reference when drawing | ||
307 | //popupBase.colorPanel = this; | ||
308 | this._popupChipBase.colorManager = this.colorManager; | ||
309 | // | ||
310 | this._popupChipBase.popupModes.gradient = this.colorChipProps.gradient; | 298 | this._popupChipBase.popupModes.gradient = this.colorChipProps.gradient; |
311 | this._popupChipBase.popupModes.image = this.colorChipProps.image; | 299 | this._popupChipBase.popupModes.image = this.colorChipProps.image; |
312 | this._popupChipBase.popupModes.wheel = this.colorChipProps.wheel; | 300 | this._popupChipBase.popupModes.wheel = this.colorChipProps.wheel; |
313 | this._popupChipBase.popupModes.palette = this.colorChipProps.palette; | 301 | this._popupChipBase.popupModes.palette = this.colorChipProps.palette; |
314 | this._popupChipBase.popupModes.nocolor = this.colorChipProps.nocolor; | 302 | this._popupChipBase.popupModes.nocolor = this.colorChipProps.nocolor; |
315 | //Setting up events | 303 | // |
316 | this._popupChipBase.addEventListener('change', this, false); | 304 | this._popupChipBase.addEventListener('change', this, false); |
317 | this._popupChipBase.addEventListener('changing', this, false); | 305 | this._popupChipBase.addEventListener('changing', this, false); |
318 | //TODO: Use m-js popup or check m-js fix of nested drawing components | 306 | // |
319 | this._popupChipBase.element = popup; | 307 | this._popupChipBase.needsDraw = true; |
320 | this._popupChipBase.needsDraw = true; | ||
321 | //Adding drawn element to container | ||
322 | this._popupChipBase.content.appendChild(this._popupChipBase.element); | ||
323 | //Waiting for content to drawn before loading popup | ||
324 | this._popupChipBase.addEventListener('firstDraw', this, false); | 308 | this._popupChipBase.addEventListener('firstDraw', this, false); |
325 | } | 309 | } |
326 | } | 310 | } |
@@ -354,14 +338,14 @@ exports.ColorPopupManager = Montage.create(Component, { | |||
354 | if (e._target._element.className === 'cpp_popup') { | 338 | if (e._target._element.className === 'cpp_popup') { |
355 | this._popupBase.removeEventListener('firstDraw', this, false); | 339 | this._popupBase.removeEventListener('firstDraw', this, false); |
356 | //Creating an instance of the popup and sending in created color popup content | 340 | //Creating an instance of the popup and sending in created color popup content |
357 | this._popupPanel.popup = this.application.ninja.popupManager.createPopup(this._popupBase.content, {x: this._popupBase.props.x, y: this._popupBase.props.y}, {side: this._popupBase.props.side, align: this._popupBase.props.align}); | 341 | this._popupPanel.popup = this.application.ninja.popupManager.createPopup(this._popupBase.element, {x: this._popupBase.props.x, y: this._popupBase.props.y}, {side: this._popupBase.props.side, align: this._popupBase.props.align}); |
358 | //Displaying popup once it's drawn | 342 | //Displaying popup once it's drawn |
359 | this._popupPanel.popup.addEventListener('firstDraw', this, false); | 343 | this._popupPanel.popup.addEventListener('firstDraw', this, false); |
360 | //Hiding popup while it draws | 344 | //Hiding popup while it draws |
361 | this._popupPanel.popup.element.style.opacity = 0; | 345 | this._popupPanel.popup.element.style.opacity = 0; |
362 | //Storing popup for use when closing | 346 | //Storing popup for use when closing |
363 | this._popupPanel.popup.base = this._popupBase; | 347 | this._popupPanel.popup.base = this._popupBase; |
364 | } else if (e._target._element.className === 'default_popup' && e._target._content.firstChild.className === 'cpp_popup') { | 348 | } else if (e._target._element.className === 'default_popup' && e._target._content.className === 'cpp_popup') { |
365 | // | 349 | // |
366 | this._colorPopupDrawing = false; | 350 | this._colorPopupDrawing = false; |
367 | // | 351 | // |
@@ -371,11 +355,12 @@ exports.ColorPopupManager = Montage.create(Component, { | |||
371 | //Popup was added, so it's opened | 355 | //Popup was added, so it's opened |
372 | this._popupPanel.opened = true; | 356 | this._popupPanel.opened = true; |
373 | } else if (e._target._element.className === 'cc_popup') { | 357 | } else if (e._target._element.className === 'cc_popup') { |
358 | this._popupChipBase.removeEventListener('firstDraw', this, false); | ||
374 | //Creating an instance of the popup and sending in created color popup content | 359 | //Creating an instance of the popup and sending in created color popup content |
375 | if (this.colorChipProps.offset) { | 360 | if (this.colorChipProps.offset) { |
376 | this._popupChip.popup = this.application.ninja.popupManager.createPopup(this._popupChipBase.content, {x: (this._popupChip.event.clientX - this._popupChip.event.offsetX + this.colorChipProps.offset)+'px', y: (this._popupChip.event.target.clientHeight/2+this._popupChip.event.clientY - this._popupChip.event.offsetY)+'px'}, {side: this.colorChipProps.side, align: this.colorChipProps.align}); | 361 | this._popupChip.popup = this.application.ninja.popupManager.createPopup(this._popupChipBase.element, {x: (this._popupChip.event.clientX - this._popupChip.event.offsetX + this.colorChipProps.offset)+'px', y: (this._popupChip.event.target.clientHeight/2+this._popupChip.event.clientY - this._popupChip.event.offsetY)+'px'}, {side: this.colorChipProps.side, align: this.colorChipProps.align}); |
377 | } else { | 362 | } else { |
378 | this._popupChip.popup = this.application.ninja.popupManager.createPopup(this._popupChipBase.content, {x: (this._popupChip.event.clientX - this._popupChip.event.offsetX)+'px', y: (this._popupChip.event.target.clientHeight/2+this._popupChip.event.clientY - this._popupChip.event.offsetY)+'px'}, {side: this.colorChipProps.side, align: this.colorChipProps.align}); | 363 | this._popupChip.popup = this.application.ninja.popupManager.createPopup(this._popupChipBase.element, {x: (this._popupChip.event.clientX - this._popupChip.event.offsetX)+'px', y: (this._popupChip.event.target.clientHeight/2+this._popupChip.event.clientY - this._popupChip.event.offsetY)+'px'}, {side: this.colorChipProps.side, align: this.colorChipProps.align}); |
379 | } | 364 | } |
380 | // | 365 | // |
381 | if (!this.colorChipProps.panel) { | 366 | if (!this.colorChipProps.panel) { |
@@ -387,7 +372,8 @@ exports.ColorPopupManager = Montage.create(Component, { | |||
387 | this._popupChip.popup.base = this._popupChipBase; | 372 | this._popupChip.popup.base = this._popupChipBase; |
388 | //Displaying popup once it's drawn | 373 | //Displaying popup once it's drawn |
389 | this._popupChip.popup.addEventListener('firstDraw', this, false); | 374 | this._popupChip.popup.addEventListener('firstDraw', this, false); |
390 | } else if (e._target._element.className === 'default_popup' && e._target._content.firstChild.className === 'cc_popup') { | 375 | } else if (e._target._element.className === 'default_popup' && e._target._content.className === 'cc_popup') { |
376 | this._popupChip.popup.removeEventListener('firstDraw', this, false); | ||
391 | // | 377 | // |
392 | this._colorChipPopupDrawing = false; | 378 | this._colorChipPopupDrawing = false; |
393 | // | 379 | // |
diff --git a/js/panels/Color/colortoolbar.reel/colortoolbar.js b/js/panels/Color/colortoolbar.reel/colortoolbar.js index 19fe7b85..6b8e476b 100644 --- a/js/panels/Color/colortoolbar.reel/colortoolbar.js +++ b/js/panels/Color/colortoolbar.reel/colortoolbar.js | |||
@@ -20,7 +20,7 @@ exports.ColorToolbar = Montage.create(Component, { | |||
20 | //Storing stroke (stores color in mode use to select color) | 20 | //Storing stroke (stores color in mode use to select color) |
21 | _stroke: { | 21 | _stroke: { |
22 | enumerable: false, | 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]} | 23 | 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]} |
24 | }, | 24 | }, |
25 | //////////////////////////////////////////////////////////////////// |