diff options
Diffstat (limited to 'js/panels')
9 files changed, 108 insertions, 77 deletions
diff --git a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js index ae7e5c14..0c950ffd 100644 --- a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js +++ b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js | |||
@@ -8,7 +8,7 @@ var cssPropertyNameList = require("js/panels/CSSPanel/css-property-name-lis | |||
8 | cssCompletionMap = require("js/panels/CSSPanel/css-value-completion-map").cssValueCompletionMap, | 8 | cssCompletionMap = require("js/panels/CSSPanel/css-value-completion-map").cssValueCompletionMap, |
9 | CSS_SHORTHAND_MAP = require("js/panels/CSSPanel/css-shorthand-map").CSS_SHORTHAND_MAP, | 9 | CSS_SHORTHAND_MAP = require("js/panels/CSSPanel/css-shorthand-map").CSS_SHORTHAND_MAP, |
10 | keyboardModule = require("js/mediators/keyboard-mediator").Keyboard, | 10 | keyboardModule = require("js/mediators/keyboard-mediator").Keyboard, |
11 | nj = require("js/lib/NJUtils.js").NJUtils; | 11 | nj = require("js/lib/NJUtils").NJUtils; |
12 | 12 | ||
13 | 13 | ||
14 | 14 | ||
diff --git a/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.js b/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.js index 0e1cf206..bb6f9de6 100644 --- a/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.js +++ b/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.js | |||
@@ -6,7 +6,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage, | 7 | var Montage = require("montage/core/core").Montage, |
8 | Component = require("montage/ui/component").Component, | 8 | Component = require("montage/ui/component").Component, |
9 | nj = require("js/lib/NJUtils.js").NJUtils; | 9 | nj = require("js/lib/NJUtils").NJUtils; |
10 | 10 | ||
11 | 11 | ||
12 | exports.ComputedStyleSubPanel = Montage.create(Component, { | 12 | exports.ComputedStyleSubPanel = Montage.create(Component, { |
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 { |