aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rwxr-xr-xjs/controllers/document-controller.js2
-rwxr-xr-xjs/controllers/elements/body-controller.js11
-rwxr-xr-xjs/document/templates/montage-web/default_html.css9
-rwxr-xr-xjs/document/templates/montage-web/index.html12
-rwxr-xr-xjs/stage/layout.js2
-rwxr-xr-xjs/stage/stage.reel/stage.js73
-rwxr-xr-xjs/tools/SelectionTool.js6
7 files changed, 71 insertions, 44 deletions
diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js
index 4be0767a..7795a74d 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -483,6 +483,8 @@ var DocumentController = exports.DocumentController = Montage.create(Component,
483 483
484 if(!this.webTemplate) { 484 if(!this.webTemplate) {
485 this._showCurrentDocument(); 485 this._showCurrentDocument();
486 } else {
487 this.application.ninja.stage.stageView.showRulers();
486 } 488 }
487 489
488 this.webTemplate = false; 490 this.webTemplate = false;
diff --git a/js/controllers/elements/body-controller.js b/js/controllers/elements/body-controller.js
index fbbb7c6e..839d0787 100755
--- a/js/controllers/elements/body-controller.js
+++ b/js/controllers/elements/body-controller.js
@@ -12,6 +12,17 @@ exports.BodyController = Montage.create(ElementController, {
12 // TODO - perspective distance needs to be passed in as "dist" and matrix3d needs to be passed in as "mat" 12 // TODO - perspective distance needs to be passed in as "dist" and matrix3d needs to be passed in as "mat"
13 set3DProperties: { 13 set3DProperties: {
14 value: function(el, props, update3DModel) { 14 value: function(el, props, update3DModel) {
15 var dist = props["dist"], mat = props["mat"];
16 this.application.ninja.stylesController.setElementStyle(el, "-webkit-transform", "perspective(" + dist + ") " + "matrix3d(" + MathUtils.scientificToDecimal(mat, 5) + ")", true);
17
18 el.elementModel.props3D.matrix3d = mat;
19 el.elementModel.props3D.perspectiveDist = dist;
20
21 this.application.ninja.stage.updatedStage = true;
22
23 if(update3DModel) {
24 this._update3DProperties(el, mat, dist);
25 }
15 } 26 }
16 }, 27 },
17 28
diff --git a/js/document/templates/montage-web/default_html.css b/js/document/templates/montage-web/default_html.css
index 08e39f22..e62a20a9 100755
--- a/js/document/templates/montage-web/default_html.css
+++ b/js/document/templates/montage-web/default_html.css
@@ -10,6 +10,15 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
10 -webkit-animation-name: none !important; 10 -webkit-animation-name: none !important;
11} 11}
12 12
13body {
14 margin: 0;
15 padding: 0;
16
17 position: absolute;
18 -webkit-transform-style: preserve-3d;
19 -webkit-perspective: 1400px;
20}
21
13.active-element-outline { 22.active-element-outline {
14 outline: #adff2f solid 2px; 23 outline: #adff2f solid 2px;
15} 24}
diff --git a/js/document/templates/montage-web/index.html b/js/document/templates/montage-web/index.html
index 630794a4..caebc8d0 100755
--- a/js/document/templates/montage-web/index.html
+++ b/js/document/templates/montage-web/index.html
@@ -29,20 +29,10 @@
29 } 29 }
30 </script> 30 </script>
31 31
32 <style>
33 div {
34 width: 4000px;
35 height: 300px;
36 background: red;
37 }
38 </style>
39
40 </head> 32 </head>
41 33
42 <body> 34 <body>
43 35 <style></style>
44 <!--<div>IPSUM</div>-->
45
46 </body> 36 </body>
47 37
48</html> \ No newline at end of file 38</html> \ No newline at end of file
diff --git a/js/stage/layout.js b/js/stage/layout.js
index a096848e..0a76dbe5 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -174,7 +174,7 @@ exports.Layout = Montage.create(Component, {
174 var tmpMat = viewUtils.getLocalToGlobalMatrix( item ); 174 var tmpMat = viewUtils.getLocalToGlobalMatrix( item );
175 175
176 var zoomFactor = 1; 176 var zoomFactor = 1;
177 if (this.stage._viewport.style && this.stage._viewport.style.zoom) { 177 if (this.stage._viewport && this.stage._viewport.style && this.stage._viewport.style.zoom) {
178 zoomFactor = Number(this.stage._viewport.style.zoom); 178 zoomFactor = Number(this.stage._viewport.style.zoom);
179 } 179 }
180 180
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 1ea14d64..515165bf 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -231,33 +231,43 @@ exports.Stage = Montage.create(Component, {
231 this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11; 231 this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11;
232 232
233 this._documentRoot = this.application.ninja.currentDocument.documentRoot; 233 this._documentRoot = this.application.ninja.currentDocument.documentRoot;
234 this._viewport = this.application.ninja.currentDocument.documentRoot.parentNode;
235
236 this.documentOffsetLeft = this._viewport.offsetLeft;
237 this.documentOffsetTop = this._viewport.offsetTop;
238
239 // Center the stage
240 this.centerStage();
241
242 this._scrollLeft = this._iframeContainer.scrollLeft;
243 this._scrollTop = this._iframeContainer.scrollTop;
244 this.application.ninja.currentDocument.savedLeftScroll = this._iframeContainer.scrollLeft;
245 this.application.ninja.currentDocument.savedTopScroll = this._iframeContainer.scrollTop;
246 234
247 // Hardcode this value so that it does not fail for the new stage architecture 235 // Hardcode this value so that it does not fail for the new stage architecture
248 // TODO: Remove marker for old template: NINJA-STAGE-REWORK 236 // TODO: Remove marker for old template: NINJA-STAGE-REWORK
249 if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { 237 if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") {
250 this.userContentBorder = 1; //parseInt(this._documentRoot.elementModel.controller.getProperty(this._documentRoot, "border")); 238 this._viewport = this.application.ninja.currentDocument.documentRoot.parentNode;
239
240 this.documentOffsetLeft = this._viewport.offsetLeft;
241 this.documentOffsetTop = this._viewport.offsetTop;
242
243 // Center the stage
244 this.centerStage();
245
246 this._scrollLeft = this._iframeContainer.scrollLeft;
247 this._scrollTop = this._iframeContainer.scrollTop;
248 this.application.ninja.currentDocument.savedLeftScroll = this._iframeContainer.scrollLeft;
249 this.application.ninja.currentDocument.savedTopScroll = this._iframeContainer.scrollTop;
250
251 this.userContentBorder = parseInt(this._documentRoot.elementModel.controller.getProperty(this._documentRoot, "border"));
252
253 this._userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder;
254 this._userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder;
255
256 this._iframeContainer.addEventListener("scroll", this, false);
257
258 this.application.ninja.currentDocument.iframe.style.opacity = 1.0;
251 } else { 259 } else {
252 this.userContentBorder = 0; 260 this.userContentBorder = 0;
253 }
254 261
255 this._userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder; 262 this._scrollLeft = 0;
256 this._userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder; 263 this._scrollTop = 0;
264 this._userContentLeft = 0;
265 this._userContentTop = 0;
266
267 this.application.ninja.currentDocument._window.addEventListener("scroll", this, false);
268 }
257 269
258 this.application.ninja.currentDocument.iframe.style.opacity = 1.0;
259 270
260 this._iframeContainer.addEventListener("scroll", this, false);
261 271
262 // TODO - We will need to modify this once we support switching between multiple documents 272 // TODO - We will need to modify this once we support switching between multiple documents
263 this.application.ninja.toolsData.selectedToolInstance._configure(true); 273 this.application.ninja.toolsData.selectedToolInstance._configure(true);
@@ -415,13 +425,10 @@ exports.Stage = Montage.create(Component, {
415 handleSelectionChange: { 425 handleSelectionChange: {
416 value: function(event) { 426 value: function(event) {
417 // TODO - this is a hack for now because some tools depend on selectionDrawn event for some logic 427 // TODO - this is a hack for now because some tools depend on selectionDrawn event for some logic
418 if(this.drawNow) 428 if(this.drawNow) {
419 {
420 this.draw(); 429 this.draw();
421 this.drawNow = false; 430 this.drawNow = false;
422 } 431 } else {
423 else
424 {
425 this.needsDraw = true; 432 this.needsDraw = true;
426 } 433 }
427 } 434 }
@@ -444,11 +451,20 @@ exports.Stage = Montage.create(Component, {
444 */ 451 */
445 handleScroll: { 452 handleScroll: {
446 value: function() { 453 value: function() {
447 this._scrollLeft = this._iframeContainer.scrollLeft; 454 // TODO: Remove marker for old template: NINJA-STAGE-REWORK
448 this._scrollTop = this._iframeContainer.scrollTop; 455 if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") {
456 this._scrollLeft = this._iframeContainer.scrollLeft;
457 this._scrollTop = this._iframeContainer.scrollTop;
449 458
450 this.userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder; 459 this.userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder;
451 this.userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder; 460 this.userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder;
461 } else {
462 this._scrollLeft = this.application.ninja.currentDocument.documentRoot.scrollLeft;
463 this._scrollTop = this.application.ninja.currentDocument.documentRoot.scrollTop;
464
465 this.userContentLeft = -this._scrollLeft;
466 this.userContentTop = -this._scrollTop;
467 }
452 468
453 // Need to clear the snap cache and set up the drag plane 469 // Need to clear the snap cache and set up the drag plane
454 //snapManager.setupDragPlaneFromPlane( workingPlane ); 470 //snapManager.setupDragPlaneFromPlane( workingPlane );
@@ -457,7 +473,6 @@ exports.Stage = Montage.create(Component, {
457 this.needsDraw = true; 473 this.needsDraw = true;
458 this.layout.draw(); 474 this.layout.draw();
459 //this._toolsList.action("DrawHandles"); 475 //this.