diff options
Diffstat (limited to 'js/stage')
-rwxr-xr-x | js/stage/stage.reel/stage.js | 69 |
1 files changed, 14 insertions, 55 deletions
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 8da89fb9..73d3aaf4 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js | |||
@@ -108,7 +108,6 @@ exports.Stage = Montage.create(Component, { | |||
108 | // We will set this to false while moving objects to improve performance | 108 | // We will set this to false while moving objects to improve performance |
109 | showSelectionBounds: { value: true }, | 109 | showSelectionBounds: { value: true }, |
110 | 110 | ||
111 | _documentRoot: { value: null }, | ||
112 | _viewport: { value: null }, | 111 | _viewport: { value: null }, |
113 | _documentOffsetLeft: { value: 0 }, | 112 | _documentOffsetLeft: { value: 0 }, |
114 | _documentOffsetTop: { value: 0 }, | 113 | _documentOffsetTop: { value: 0 }, |
@@ -121,11 +120,6 @@ exports.Stage = Montage.create(Component, { | |||
121 | _maxHorizontalScroll: { value: 0 }, | 120 | _maxHorizontalScroll: { value: 0 }, |
122 | _maxVerticalScroll: { value: 0 }, | 121 | _maxVerticalScroll: { value: 0 }, |
123 | 122 | ||
124 | documentRoot: { | ||
125 | get: function () { return this._documentRoot; }, | ||
126 | set: function(value) { this._documentRoot = value; } | ||
127 | }, | ||
128 | |||
129 | viewport: { | 123 | viewport: { |
130 | get: function () { return this._viewport; }, | 124 | get: function () { return this._viewport; }, |
131 | set: function(value) { this._viewport = value; } | 125 | set: function(value) { this._viewport = value; } |
@@ -195,10 +189,7 @@ exports.Stage = Montage.create(Component, { | |||
195 | set: function(value) { | 189 | set: function(value) { |
196 | this._userPaddingLeft = value; | 190 | this._userPaddingLeft = value; |
197 | this._documentOffsetLeft = -value; | 191 | this._documentOffsetLeft = -value; |
198 | if(!this._documentRoot) { | 192 | this.application.ninja.currentDocument.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-left"] = -value + "px"; |
199 | this._documentRoot = this.application.ninja.currentDocument.documentRoot; | ||
200 | } | ||
201 | this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-left"] = -value + "px"; | ||
202 | this.userContentLeft = this._documentOffsetLeft; | 193 | this.userContentLeft = this._documentOffsetLeft; |
203 | this.updatedStage = true; | 194 | this.updatedStage = true; |
204 | } | 195 | } |
@@ -209,10 +200,7 @@ exports.Stage = Montage.create(Component, { | |||
209 | set: function(value) { | 200 | set: function(value) { |
210 | this._userPaddingTop = value; | 201 | this._userPaddingTop = value; |
211 | this._documentOffsetTop = -value; | 202 | this._documentOffsetTop = -value; |
212 | if(!this._documentRoot) { | 203 | this.application.ninja.currentDocument.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-top"] = -value + "px"; |
213 | this._documentRoot = this.application.ninja.currentDocument.documentRoot; | ||
214 | } | ||
215 | this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-top"] = -value + "px"; | ||
216 | this.userContentTop = this._documentOffsetTop; | 204 | this.userContentTop = this._documentOffsetTop; |
217 | this.updatedStage = true; | 205 | this.updatedStage = true; |
218 | } | 206 | } |
@@ -287,46 +275,17 @@ exports.Stage = Montage.create(Component, { | |||
287 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this.element.offsetWidth - 11 ; | 275 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this.element.offsetWidth - 11 ; |
288 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11; | 276 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11; |
289 | 277 | ||
290 | this._documentRoot = this.application.ninja.currentDocument.documentRoot; | ||
291 | |||
292 | // Hardcode this value so that it does not fail for the new stage architecture | ||
293 | // TODO: Remove marker for old template: NINJA-STAGE-REWORK | ||
294 | if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { | ||
295 | this._viewport = this.application.ninja.currentDocument.documentRoot.parentNode; | ||
296 | |||
297 | this.documentOffsetLeft = this._viewport.offsetLeft; | ||
298 | this.documentOffsetTop = this._viewport.offsetTop; | ||
299 | |||
300 | // Center the stage | ||
301 | this.centerStage(); | ||
302 | |||
303 | this._scrollLeft = this._iframeContainer.scrollLeft; | ||
304 | this._scrollTop = this._iframeContainer.scrollTop; | ||
305 | this.application.ninja.currentDocument.savedLeftScroll = this._iframeContainer.scrollLeft; | ||
306 | this.application.ninja.currentDocument.savedTopScroll = this._iframeContainer.scrollTop; | ||
307 | |||
308 | this.userContentBorder = parseInt(this._documentRoot.elementModel.controller.getProperty(this._documentRoot, "border")); | ||
309 | |||
310 | this._userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder; | ||
311 | this._userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder; | ||
312 | |||
313 | this._iframeContainer.addEventListener("scroll", this, false); | ||
314 | 278 | ||
315 | this.application.ninja.currentDocument.iframe.style.opacity = 1.0; | 279 | this.userContentBorder = 0; |
316 | } else { | ||
317 | this.userContentBorder = 0; | ||
318 | |||
319 | this._scrollLeft = 0; | ||
320 | this._scrollTop = 0; | ||
321 | this._userContentLeft = this._documentOffsetLeft; | ||
322 | this._userContentTop = this._documentOffsetTop; | ||
323 | |||
324 | this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11; | ||
325 | this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11; | ||
326 | this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false); | ||
327 | } | ||
328 | 280 | ||
281 | this._scrollLeft = 0; | ||
282 | this._scrollTop = 0; | ||
283 | this._userContentLeft = this._documentOffsetLeft; | ||
284 | this._userContentTop = this._documentOffsetTop; | ||
329 | 285 | ||
286 | this._maxHorizontalScroll = this.application.ninja.currentDocument.documentRoot.scrollWidth - this._canvas.width - 11; | ||
287 | this._maxVerticalScroll = this.application.ninja.currentDocument.documentRoot.scrollHeight - this._canvas.height - 11; | ||
288 | this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false); | ||
330 | 289 | ||
331 | // TODO - We will need to modify this once we support switching between multiple documents | 290 | // TODO - We will need to modify this once we support switching between multiple documents |
332 | this.application.ninja.toolsData.selectedToolInstance._configure(true); | 291 | this.application.ninja.toolsData.selectedToolInstance._configure(true); |
@@ -526,8 +485,8 @@ exports.Stage = Montage.create(Component, { | |||
526 | // TODO - scroll events are not dependable. We may need to use a timer to simulate | 485 | // TODO - scroll events are not dependable. We may need to use a timer to simulate |
527 | // scrollBegin and scrollEnd. For now, the Pan Tool will keep track of the stage's scroll values | 486 | // scrollBegin and scrollEnd. For now, the Pan Tool will keep track of the stage's scroll values |
528 | // on mouse down. | 487 | // on mouse down. |
529 | // this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11; | 488 | // this._maxHorizontalScroll = this.application.ninja.currentDocument.documentRoot.scrollWidth - this._canvas.width - 11; |
530 | // this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11; | 489 | // this._maxVerticalScroll = this.application.ninja.currentDocument.documentRoot.scrollHeight - this._canvas.height - 11; |
531 | } | 490 | } |
532 | 491 | ||
533 | // Need to clear the snap cache and set up the drag plane | 492 | // Need to clear the snap cache and set up the drag plane |
@@ -566,8 +525,8 @@ exports.Stage = Montage.create(Component, { | |||
566 | centerStage: { | 525 | centerStage: { |
567 | value: function() { | 526 | value: function() { |
568 | if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { | 527 | if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { |
569 | this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this._documentRoot.parentNode.offsetWidth)/2; | 528 | this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this.application.ninja.currentDocument.documentRoot.parentNode.offsetWidth)/2; |
570 | this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this._documentRoot.parentNode.offsetHeight)/2; | 529 | this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this.application.ninja.currentDocument.documentRoot.parentNode.offsetHeight)/2; |
571 | 530 | ||
572 | this._scrollLeft = this._iframeContainer.scrollLeft; | 531 | this._scrollLeft = this._iframeContainer.scrollLeft; |
573 | this._scrollTop = this._iframeContainer.scrollTop; | 532 | this._scrollTop = this._iframeContainer.scrollTop; |