diff options
-rwxr-xr-x | js/document/document-html.js | 11 | ||||
-rwxr-xr-x | js/document/models/html.js | 17 | ||||
-rwxr-xr-x | js/helper-classes/3D/view-utils.js | 9 | ||||
-rwxr-xr-x | js/stage/stage.reel/stage.js | 69 |
4 files changed, 40 insertions, 66 deletions
diff --git a/js/document/document-html.js b/js/document/document-html.js index 0037c94d..983da966 100755 --- a/js/document/document-html.js +++ b/js/document/document-html.js | |||
@@ -139,7 +139,11 @@ exports.HtmlDocument = Montage.create(Component, { | |||
139 | //this.gridVerticalSpacing = this.application.ninja.stage.drawUtils.gridVerticalSpacing; | 139 | //this.gridVerticalSpacing = this.application.ninja.stage.drawUtils.gridVerticalSpacing; |
140 | 140 | ||
141 | // Serialize the current scroll position | 141 | // Serialize the current scroll position |
142 | // TODO: Implement | 142 | this.model.scrollLeft = this.application.ninja.stage._scrollLeft; |
143 | this.model.scrollTop = this.application.ninja.stage._scrollTop; | ||
144 | this.model.userContentLeft = this.application.ninja.stage._userContentLeft; | ||
145 | this.model.userContentTop = this.application.ninja.stage._userContentTop; | ||
146 | |||
143 | 147 | ||
144 | // Serialize the selection | 148 | // Serialize the selection |
145 | this.model.selection = this.application.ninja.selectedElements.slice(0); | 149 | this.model.selection = this.application.ninja.selectedElements.slice(0); |
@@ -163,7 +167,10 @@ exports.HtmlDocument = Montage.create(Component, { | |||
163 | //this.application.ninja.stage.drawUtils.gridVerticalSpacing = this.gridVerticalSpacing; | 167 | //this.application.ninja.stage.drawUtils.gridVerticalSpacing = this.gridVerticalSpacing; |
164 | 168 | ||
165 | // Deserialize the current scroll position | 169 | // Deserialize the current scroll position |
166 | // TODO: Implement | 170 | this.application.ninja.stage._scrollLeft = this.model.scrollLeft; |
171 | this.application.ninja.stage._scrollTop = this.model.scrollTop; | ||
172 | this.application.ninja.stage._userContentLeft = this.model.userContentLeft; | ||
173 | this.application.ninja.stage._userContentTop = this.model.userContentTop; | ||
167 | 174 | ||
168 | this.application.ninja.selectedElements = this.model.selection.slice(0); | 175 | this.application.ninja.selectedElements = this.model.selection.slice(0); |
169 | 176 | ||
diff --git a/js/document/models/html.js b/js/document/models/html.js index 67457863..a97b4b5a 100755 --- a/js/document/models/html.js +++ b/js/document/models/html.js | |||
@@ -28,6 +28,23 @@ exports.HtmlDocumentModel = Montage.create(BaseDocumentModel, { | |||
28 | value: false | 28 | value: false |
29 | }, | 29 | }, |
30 | //////////////////////////////////////////////////////////////////// | 30 | //////////////////////////////////////////////////////////////////// |
31 | // | ||
32 | scrollLeft: { | ||
33 | value: null | ||
34 | }, | ||
35 | |||
36 | scrollTop: { | ||
37 | value: null | ||
38 | }, | ||
39 | |||
40 | userContentLeft: { | ||
41 | value: null | ||
42 | }, | ||
43 | |||
44 | userContentTop: { | ||
45 | value: null | ||
46 | }, | ||
47 | //////////////////////////////////////////////////////////////////// | ||
31 | // | 48 | // |
32 | baseHref: { | 49 | baseHref: { |
33 | value: null | 50 | value: null |
diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js index 20f61be1..75530af3 100755 --- a/js/helper-classes/3D/view-utils.js +++ b/js/helper-classes/3D/view-utils.js | |||
@@ -1303,15 +1303,6 @@ exports.ViewUtils = Montage.create(Component, { | |||
1303 | // MISCELLANEOUS | 1303 | // MISCELLANEOUS |
1304 | // event.layerX/Y: var pt = viewUtils.getMousePoint(event); | 1304 | // event.layerX/Y: var pt = viewUtils.getMousePoint(event); |
1305 | 1305 | ||
1306 | getStageDimension: { | ||
1307 | value: function() | ||
1308 | { | ||
1309 | var width = parseInt(this.application.ninja.stage.documentRoot.elementModel.stageDimension.style.getProperty("width")); | ||
1310 | var height= parseInt(this.application.ninja.stage.documentRoot.elementModel.stageDimension.style.getProperty("height")); | ||
1311 | return[width,height]; | ||
1312 | } | ||
1313 | }, | ||
1314 | |||
1315 | getStage: { | 1306 | getStage: { |
1316 | value: function() | 1307 | value: function() |
1317 | { | 1308 | { |
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; |