From 51b4e61d6c6df5e88e9a5dfcdfd7944e2a3f64e7 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 30 Jan 2012 13:25:15 -0800 Subject: Syncing stage view when rotating stage. Signed-off-by: Nivesh Rajbhandari --- js/stage/layout.js | 14 +++++++++++--- js/stage/stage.reel/stage.js | 2 +- 2 files changed, 12 insertions(+), 4 deletions(-) (limited to 'js/stage') diff --git a/js/stage/layout.js b/js/stage/layout.js index 625c09ad..89fa44f3 100644 --- a/js/stage/layout.js +++ b/js/stage/layout.js @@ -112,6 +112,7 @@ exports.Layout = Montage.create(Component, { } this.draw(); // Not a reel yet :) + this.draw3DInfo(false); } @@ -128,9 +129,16 @@ exports.Layout = Montage.create(Component, { }, draw3DInfo: { - value: function() { - drawUtils.updatePlanes(); - if(this.stage.appModel.show3dGrid) drawUtils.drawWorkingPlane(); + value: function(updatePlanes) { + if(updatePlanes) + { + drawUtils.updatePlanes(); + } + if(this.stage.appModel.show3dGrid) + { + this.application.ninja.stage.stageDeps.snapManager.updateWorkingPlaneFromView(); + drawUtils.drawWorkingPlane(); + } drawUtils.draw3DCompass(); } }, diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 3e0b852e..31d0f8c2 100644 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -175,7 +175,7 @@ exports.Stage = Montage.create(Component, { } else if(this.updatedStage) { this.layout.draw(); - this.layout.draw3DInfo(); + this.layout.draw3DInfo(true); } } }, -- cgit v1.2.3 From 8b8b9bc1cd033b483f3a5c57acc75dfb56e099a4 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 30 Jan 2012 14:21:59 -0800 Subject: Fixed grid not drawing bug when switching from front to top and side. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage.reel/stage.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'js/stage') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 31d0f8c2..8c4efd58 100644 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -814,8 +814,8 @@ exports.Stage = Montage.create(Component, { setStageView: { value: function(side) { var mat, - workingPlane = null, - currentDoc = this.application.ninja.currentDocument.documentRoot; + currentDoc = this.application.ninja.currentDocument.documentRoot, + isDrawingGrid = this.application.ninja.appModel.show3dGrid; // Stage 3d Props. currentDoc.elementModel.props3D.ResetTranslationValues(); currentDoc.elementModel.props3D.ResetRotationValues(); @@ -826,7 +826,7 @@ exports.Stage = Montage.create(Component, { mat = Matrix.RotationX(Math.PI * 270.0/180.0); drawUtils.drawXY = drawUtils.drawYZ = false; - drawUtils.drawXZ = drawUtils.isDrawingGrid(); + drawUtils.drawXZ = isDrawingGrid; workingPlane = [0,1,0,0]; break; @@ -834,7 +834,7 @@ exports.Stage = Montage.create(Component, { mat = Matrix.RotationY(Math.PI * 270/180); drawUtils.drawXY = drawUtils.drawXZ = false; - drawUtils.drawYZ = drawUtils.isDrawingGrid(); + drawUtils.drawYZ = isDrawingGrid; workingPlane = [1,0,0,0]; break; @@ -842,7 +842,7 @@ exports.Stage = Montage.create(Component, { mat = Matrix.I(4); drawUtils.drawYZ = drawUtils.drawXZ = false; - drawUtils.drawXY = drawUtils.isDrawingGrid(); + drawUtils.drawXY = isDrawingGrid; workingPlane = [0,0,1,0]; break; } -- cgit v1.2.3 From d41dee0c552a30724a146965ae4272a268777fc5 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Thu, 2 Feb 2012 14:53:14 -0800 Subject: Integrating Pan and Zoom tool and snap manager fixes. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage.reel/stage.js | 51 ++++++++++++++++++++++++++++++-------------- 1 file changed, 35 insertions(+), 16 deletions(-) (limited to 'js/stage') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 8c4efd58..9e2df5a2 100644 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -787,14 +787,9 @@ exports.Stage = Montage.create(Component, { var userContent = this.application.ninja.currentDocument.documentRoot; if (userContent) { - var w = userContent.offsetWidth, - h = userContent.offsetHeight; - if(userContent.width) - w = userContent.width; - if(userContent.height) - h = userContent.height; - var localPt = [ w/2, h/2, 0]; - var globalPt = this.stageDeps.viewUtils.localToGlobal( localPt, userContent ); + var w = this._canvas.width, + h = this._canvas.height; + var globalPt = [w/2, h/2, 0]; this.stageDeps.viewUtils.setStageZoom( globalPt, value/100 ); @@ -811,6 +806,36 @@ exports.Stage = Montage.create(Component, { } }, + getPlaneForView: + { + value: function( side ) + { + var plane = [0,0,1,0]; + switch(side) + { + case "top": + plane = [0,1,0,0]; + plane[3] = this.application.ninja.currentDocument.documentRoot.offsetHeight / 2.0; + break; + + case "side": + plane = [1,0,0,0]; + plane[3] = this.application.ninja.currentDocument.documentRoot.offsetWidth / 2.0; + break; + + case "front": + plane = [0,0,1,0]; + break; + + default: + console.log( "unrecognized view in snapManager.getPlaneForView: " + side ); + break; + } + + return plane; + } + }, + setStageView: { value: function(side) { var mat, @@ -821,32 +846,26 @@ exports.Stage = Montage.create(Component, { currentDoc.elementModel.props3D.ResetRotationValues(); - switch(side) { + switch(side){ case "top": mat = Matrix.RotationX(Math.PI * 270.0/180.0); - drawUtils.drawXY = drawUtils.drawYZ = false; drawUtils.drawXZ = isDrawingGrid; - workingPlane = [0,1,0,0]; break; case "side": mat = Matrix.RotationY(Math.PI * 270/180); - drawUtils.drawXY = drawUtils.drawXZ = false; drawUtils.drawYZ = isDrawingGrid; - workingPlane = [1,0,0,0]; break; case "front": mat = Matrix.I(4); - drawUtils.drawYZ = drawUtils.drawXZ = false; drawUtils.drawXY = isDrawingGrid; - workingPlane = [0,0,1,0]; break; } - + workingPlane = this.getPlaneForView( side ); this.stageDeps.viewUtils.setMatrixForElement(currentDoc, mat, false); -- cgit v1.2.3 From 54f9f6ebfb495feed695cf12a0f245f535cd3372 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 2 Feb 2012 15:17:16 -0800 Subject: Switching to alternate dashed line function. Adding code attributions. Signed-off-by: Valerio Virgillito --- js/stage/layout.js | 53 ++++------------------------------------------------- 1 file changed, 4 insertions(+), 49 deletions(-) (limited to 'js/stage') diff --git a/js/stage/layout.js b/js/stage/layout.js index 625c09ad..1e712550 100644 --- a/js/stage/layout.js +++ b/js/stage/layout.js @@ -282,8 +282,9 @@ exports.Layout = Montage.create(Component, { } }, - // Alternate dashed line method. - ___dashedLine: { + // Dashed line function found at http://stackoverflow.com/questions/4576724/dotted-stroke-in-canvas/ + // Portions used with permission of Gavin Kistner (phrogz) + _dashedLine: { value: function(x, y, x2, y2, dashArray) { this.ctx.lineCap = "square"; this.ctx.beginPath(); @@ -303,7 +304,7 @@ exports.Layout = Montage.create(Component, { var step = Math.sqrt(dashLength * dashLength / (1 + slope * slope)); if(xSlope){ if(dx < 0) step = -step; - x += step + x += step; y += slope * step; }else{ if(dy < 0) step = -step; @@ -321,52 +322,6 @@ exports.Layout = Montage.create(Component, { } }, - _dashedLine: { - value: function (fromX, fromY, toX, toY, pattern){ - this.ctx.beginPath(); - // Our growth rate for our line can be one of the following: - // (+,+), (+,-), (-,+), (-,-) - // Because of this, our algorithm needs to understand if the x-coord and - // y-coord should be getting smaller or larger and properly cap the values - // based on (x,y). - var lt = function (a, b) { return a <= b; }; - var gt = function (a, b) { return a >= b; }; - var capmin = function (a, b) { return Math.min(a, b); }; - var capmax = function (a, b) { return Math.max(a, b); }; - - var checkX = { thereYet: gt, cap: capmin }; - var checkY = { thereYet: gt, cap: capmin }; - - if (fromY - toY > 0) { - checkY.thereYet = lt; - checkY.cap = capmax; - } - if (fromX - toX > 0) { - checkX.thereYet = lt; - checkX.cap = capmax; - } - - this.ctx.moveTo(fromX, fromY); - var offsetX = fromX; - var offsetY = fromY; - var idx = 0, dash = true; - while (!(checkX.thereYet(offsetX, toX) && checkY.thereYet(offsetY, toY))) { - var ang = Math.atan2(toY - fromY, toX - fromX); - var len = pattern[idx]; - - offsetX = checkX.cap(toX, offsetX + (Math.cos(ang) * len)); - offsetY = checkY.cap(toY, offsetY + (Math.sin(ang) * len)); - - if (dash) this.ctx.lineTo(offsetX, offsetY); - else this.ctx.moveTo(offsetX, offsetY); - - idx = (idx + 1) % pattern.length; - dash = !dash; - } - this.ctx.stroke(); - } - }, - _elementName: { value: function(item) { return this.application.ninja.elementMediator.getNJProperty(item, "selection"); -- cgit v1.2.3 From 854a6d1be334782c8e232601e6d562a11296e55a Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 3 Feb 2012 14:06:26 -0800 Subject: Update grid and planes when elementChange event signifies the "matrix", "left", "top", "width" or "height" properties have changed. Signed-off-by: Nivesh Rajbhandari --- js/stage/layout.js | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'js/stage') diff --git a/js/stage/layout.js b/js/stage/layout.js index dd5be081..c369fc30 100644 --- a/js/stage/layout.js +++ b/js/stage/layout.js @@ -74,6 +74,9 @@ exports.Layout = Montage.create(Component, { handleElementAdded: { value: function(event) { this.domTree.push(event.detail); + + this.draw(); + this.draw3DInfo(false); } }, @@ -82,6 +85,7 @@ exports.Layout = Montage.create(Component, { this.domTree.splice(this.domTree.indexOf(event.detail), 1); this.draw(); + this.draw3DInfo(false); } }, -- cgit v1.2.3 From d7ad2659d7ef8d0fffbb1cba8218061ebd516dd0 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 3 Feb 2012 15:09:54 -0800 Subject: Handle delete of multiple objects. Also, have deletion go through the mediator so elementDeleted event is fired for SnapManager, DrawUtils, etc. to clean up after deleted element(s). Signed-off-by: Nivesh Rajbhandari --- js/stage/layout.js | 17 +++++------------ 1 file changed, 5 insertions(+), 12 deletions(-) (limited to 'js/stage') diff --git a/js/stage/layout.js b/js/stage/layout.js index c369fc30..1a491210 100644 --- a/js/stage/layout.js +++ b/js/stage/layout.js @@ -58,7 +58,7 @@ exports.Layout = Montage.create(Component, { this.eventManager.addEventListener("selectionChange", this, false); - this.eventManager.addEventListener("deleteSelection", this, true); + this.eventManager.addEventListener("deleteSelection", this, false); // this.addEventListener("change@stage.appModel.layoutView", this.handleLayoutView, false); @@ -83,21 +83,14 @@ exports.Layout = Montage.create(Component, { handleElementDeleted: { value: function(event) { this.domTree.splice(this.domTree.indexOf(event.detail), 1); - - this.draw(); - this.draw3DInfo(false); } }, - captureDeleteSelection: { + // Redraw stage only once after all deletion is completed + handleDeleteSelection: { value: function(event) { - //this.redrawDocument(); - - var len = event.detail.length; - for(var i = 0; i < len ; i++) { - this.domTree.splice(this.domTree.indexOf(event.detail[i]),1); - } - + this.draw(); + this.draw3DInfo(false); } }, -- cgit v1.2.3