From abeb9f1e23679200bb2f4a3ccbcebfb37645975c Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Thu, 9 Feb 2012 10:45:50 -0800 Subject: first phase of simple resampling to prevent tiny segments --- js/helper-classes/RDGE/GLBrushStroke.js | 54 +++++++++- js/tools/BrushTool.js | 170 ++++++++++++++++---------------- 2 files changed, 138 insertions(+), 86 deletions(-) diff --git a/js/helper-classes/RDGE/GLBrushStroke.js b/js/helper-classes/RDGE/GLBrushStroke.js index fdf1595c..59017a0c 100644 --- a/js/helper-classes/RDGE/GLBrushStroke.js +++ b/js/helper-classes/RDGE/GLBrushStroke.js @@ -67,7 +67,23 @@ function GLBrushStroke() { this.getNumPoints = function () { return this._Points.length; } this.getPoint = function (index) { return this._Points[index]; } - this.addPoint = function (anchorPt) { this._Points.push(anchorPt); this._dirty=true; } + this.addPoint = function (pt) + { + //add the point if it is some epsilon away from the previous point + var doAddPoint=true; + var numPoints = this._Points.length; + if (numPoints>0) { + var prevPt = this._Points[numPoints-1]; + var diffPt = [prevPt[0]-pt[0], prevPt[1]-pt[1]]; + var diffPtMag = diffPt[0]*diffPt[0] + diffPt[1]*diffPt[1]; + if (diffPtMag<4) + doAddPoint=false; + } + if (doAddPoint) { + this._Points.push(pt); + this._dirty=true; + } + } this.insertPoint = function(pt, index){ this._Points.splice(index, 0, pt); this._dirty=true;} this.isDirty = function(){return this._dirty;} this.makeDirty = function(){this._dirty=true;} @@ -167,7 +183,9 @@ function GLBrushStroke() { var bboxWidth = bboxMax[0] - bboxMin[0]; var bboxHeight = bboxMax[1] - bboxMin[1]; ctx.clearRect(0, 0, bboxWidth, bboxHeight); -/* + + + /* ctx.lineWidth = this._strokeWidth; ctx.strokeStyle = "black"; if (this._strokeColor) @@ -185,7 +203,35 @@ function GLBrushStroke() { ctx.lineTo(pt[0]-bboxMin[0], pt[1]-bboxMin[1]); } ctx.stroke(); - */ + */ + + var firstPt = this._Points[0]; + var prevX = firstPt[0]-bboxMin[0]; + var prevY = firstPt[1]-bboxMin[1]; + for (var i = 1; i < numPoints; i++) { + var pt = this._Points[i]; + ctx.globalCompositeOperation = 'source-over'; + var x = pt[0]-bboxMin[0]; + var y = pt[1]-bboxMin[1]; + var r = ctx.createLinearGradient(prevX, prevY, x, y); + r.addColorStop(1, 'rgba(0,0,0,0.01)'); + r.addColorStop(0.5,'rgba(255,0,0,1.0)'); + r.addColorStop(0, 'rgba(0,0,0,0.01)'); + + ctx.fillStyle = r; + //ctx.fillStyle = "rgba(0,128,0,0.15)"; + var w2 = this._strokeWidth*0.5; + ctx.moveTo(prevX-w2, prevY); + ctx.lineTo(prevX+w2, prevY); + ctx.lineTo(x+w2, y); + ctx.lineTo(x-w2, y); + ctx.fill(); + + prevX = x; + prevY = y; + } + + /* var R2 = this._strokeWidth; var R = R2*0.5; var hardness = 0.25; //for a pencil, this is always 1 //TODO get hardness parameter from user interface @@ -209,6 +255,8 @@ function GLBrushStroke() { //ctx.globalCompositeOperation = 'source-in'; //ctx.rect(x-R, y-R, R2, R2); } + */ + ctx.restore(); } //render() diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index ce8ffbb9..97df84a0 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -65,12 +65,30 @@ exports.BrushTool = Montage.create(ShapeTool, { if (this._selectedBrushStroke === null){ this._selectedBrushStroke = new GLBrushStroke(); } - console.log("BrushTool Start"); NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); } //value: function (event) { }, //HandleLeftButtonDown + _getUnsnappedPosition: { + value: function(x,y){ + var elemSnap = snapManager.elementSnapEnabled(); + var gridSnap = snapManager.gridSnapEnabled(); + var alignSnap = snapManager.snapAlignEnabled(); + snapManager.enableElementSnap(false); + snapManager.enableGridSnap(false); + snapManager.enableSnapAlign(false); + + var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(x,y)); + var unsnappedpos = DrawingToolBase.getHitRecPos(snapManager.snap(point.x, point.y, false)); + + snapManager.enableElementSnap(elemSnap); + snapManager.enableGridSnap(gridSnap); + snapManager.enableSnapAlign(alignSnap); + + return unsnappedpos; + } + }, //need to override this function because the ShapeTool's definition contains a clearDrawingCanvas call - Pushkar // might not need to override once we draw using OpenGL instead of SVG // Also took out all the snapping code for now...need to add that back @@ -84,20 +102,10 @@ exports.BrushTool = Montage.create(ShapeTool, { } if (this._isDrawing) { - snapManager.enableElementSnap(false); - snapManager.enableGridSnap(false); - snapManager.enableSnapAlign(false); - //this.doDraw(event); - //var currMousePos = this.getMouseUpPos(); - //instead of doDraw call own DrawingTool - var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)); - var hitRecSnapPoint = DrawingToolBase.getUpdatedSnapPointNoAppLevelEnabling(point.x, point.y, true, this.mouseDownHitRec); - var currMousePos = DrawingToolBase.getHitRecPos(hitRecSnapPoint); - + var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY); if (this._selectedBrushStroke){ this._selectedBrushStroke.addPoint(currMousePos); } - this.ShowCurrentBrushStrokeOnStage(); } //if (this._isDrawing) { @@ -123,7 +131,6 @@ exports.BrushTool = Montage.create(ShapeTool, { this._isDrawing = false; this._hasDraw = false; - console.log("BrushTool Stop"); //TODO get these values from the options if (this._selectedBrushStroke){ @@ -192,92 +199,89 @@ exports.BrushTool = Montage.create(ShapeTool, { RenderShape: { - value: function (w, h, planeMat, midPt, canvas) { - if ((Math.floor(w) === 0) || (Math.floor(h) === 0)) { - return; - } + value: function (w, h, planeMat, midPt, canvas) { + if ((Math.floor(w) === 0) || (Math.floor(h) === 0)) { + return; + } - var left = Math.round(midPt[0] - 0.5 * w); - var top = Math.round(midPt[1] - 0.5 * h); + var left = Math.round(midPt[0] - 0.5 * w); + var top = Math.round(midPt[1] - 0.5 * h); - if (!canvas) { - var newCanvas = NJUtils.makeNJElement("canvas", "Brushstroke", "shape", null, true); - var elementModel = TagTool.makeElement(w, h, planeMat, midPt, newCanvas); - ElementMediator.addElement(newCanvas, elementModel.data, true); + if (!canvas) { + var newCanvas = NJUtils.makeNJElement("canvas", "Brushstroke", "shape", null, true); + var elementModel = TagTool.makeElement(w, h, planeMat, midPt, newCanvas); + ElementMediator.addElement(newCanvas, elementModel.data, true); - // create all the GL stuff - var world = this.getGLWorld(newCanvas, this._useWebGL); - //store a reference to this newly created canvas - this._brushStrokeCanvas = newCanvas; + // create all the GL stuff + var world = this.getGLWorld(newCanvas, this._useWebGL); + //store a reference to this newly created canvas + this._brushStrokeCanvas = newCanvas; - var brushStroke = this._selectedBrushStroke; - if (brushStroke){ - brushStroke.setWorld(world); + var brushStroke = this._selectedBrushStroke; + if (brushStroke){ + brushStroke.setWorld(world); - brushStroke.setPlaneMatrix(planeMat); - var planeMatInv = glmat4.inverse( planeMat, [] ); - brushStroke.setPlaneMatrixInverse(planeMatInv); - brushStroke.setPlaneCenter(midPt); + brushStroke.setPlaneMatrix(planeMat); + var planeMatInv = glmat4.inverse( planeMat, [] ); + brushStroke.setPlaneMatrixInverse(planeMatInv); + brushStroke.setPlaneCenter(midPt); - world.addObject(brushStroke); - world.render(); - //TODO this will not work if there are multiple shapes in the same canvas - newCanvas.elementModel.shapeModel.GLGeomObj = brushStroke; - } - } //if (!canvas) { - else { - - var world = null; - if (canvas.elementModel.shapeModel && canvas.elementModel.shapeModel.GLWorld) { - world = canvas.elementModel.shapeModel.GLWorld; - } else { - world = this.getGLWorld(canvas, this._useWebGL);//this.options.use3D);//this.CreateGLWorld(planeMat, midPt, canvas, this._useWebGL);//fillMaterial, strokeMaterial); - } + world.addObject(brushStroke); + world.render(); + //TODO this will not work if there are multiple shapes in the same canvas + newCanvas.elementModel.shapeModel.GLGeomObj = brushStroke; + } + } //if (!canvas) { + else { + var world = null; + if (canvas.elementModel.shapeModel && canvas.elementModel.shapeModel.GLWorld) { + world = canvas.elementModel.shapeModel.GLWorld; + } else { + world = this.getGLWorld(canvas, this._useWebGL); + } - if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ - //update the left and top of the canvas element - var canvasArray=[canvas]; - ElementMediator.setProperty(canvasArray, "left", [parseInt(left)+"px"],"Changing", "brushTool"); - ElementMediator.setProperty(canvasArray, "top", [parseInt(top) + "px"],"Changing", "brushTool"); - canvas.width = w; - canvas.height = h; - //update the viewport and projection to reflect the new canvas width and height - world.setViewportFromCanvas(canvas); - if (this._useWebGL){ - var cam = world.renderer.cameraManager().getActiveCamera(); - cam.setPerspective(world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); + + if (this._entryEditMode !== this.ENTRY_SELECT_CANVAS){ + //update the left and top of the canvas element + var canvasArray=[canvas]; + ElementMediator.setProperty(canvasArray, "left", [parseInt(left)+"px"],"Changing", "brushTool"); + ElementMediator.setProperty(canvasArray, "top", [parseInt(top) + "px"],"Changing", "brushTool"); + canvas.width = w; + canvas.height = h; + //update the viewport and projection to reflect the new canvas width and height + world.setViewportFromCanvas(canvas); + if (this._useWebGL){ + var cam = world.renderer.cameraManager().getActiveCamera(); + cam.setPerspective(world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); + } } - } - var brushStroke = this._selectedBrushStroke; + var brushStroke = this._selectedBrushStroke; - if (brushStroke){ - brushStroke.setDrawingTool(this); + if (brushStroke){ + brushStroke.setDrawingTool(this); - brushStroke.setPlaneMatrix(planeMat); - var planeMatInv = glmat4.inverse( planeMat, [] ); - brushStroke.setPlaneMatrixInverse(planeMatInv); - brushStroke.setPlaneCenter(midPt); + brushStroke.setPlaneMatrix(planeMat); + var planeMatInv = glmat4.inverse( planeMat, [] ); + brushStroke.setPlaneMatrixInverse(planeMatInv); + brushStroke.setPlaneCenter(midPt); - brushStroke.setWorld(world); - world.addIfNewObject(brushStroke); - //world.addObject(subpath); - world.render(); - //TODO this will not work if there are multiple shapes in the same canvas - canvas.elementModel.shapeModel.GLGeomObj = brushStroke; - } - } //else of if (!canvas) { - } //value: function (w, h, planeMat, midPt, canvas) { - }, //RenderShape: { + brushStroke.setWorld(world); + world.addIfNewObject(brushStroke); + //world.addObject(subpath); + world.render(); + //TODO this will not work if there are multiple shapes in the same canvas + canvas.elementModel.shapeModel.GLGeomObj = brushStroke; + } + } //else of if (!canvas) { + } //value: function (w, h, planeMat, midPt, canvas) { + }, //RenderShape: { + Configure: { value: function (wasSelected) { if (wasSelected) { - console.log("Picked BrushTool"); - //todo these calls have no effect because the drawing-tool-base (in getInitialSnapPoint) overrides them with what's set at the application level - snapManager.enableElementSnap(false); - snapManager.enableGridSnap(false); - snapManager.enableSnapAlign(false); + console.log("Entered BrushTool"); } else { console.log("Left BrushTool"); -- cgit v1.2.3 From fcb12cc09eb3cd3b42bd215877ba18f449275b75 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Fri, 10 Feb 2012 14:16:56 -0800 Subject: render the brush stroke as a sequence of rectangles, with each rectangle having its own linear gradient --- js/helper-classes/RDGE/GLBrushStroke.js | 78 ++++++++++++++++++++++++++++----- 1 file changed, 66 insertions(+), 12 deletions(-) diff --git a/js/helper-classes/RDGE/GLBrushStroke.js b/js/helper-classes/RDGE/GLBrushStroke.js index 59017a0c..8fb6ab25 100644 --- a/js/helper-classes/RDGE/GLBrushStroke.js +++ b/js/helper-classes/RDGE/GLBrushStroke.js @@ -76,7 +76,7 @@ function GLBrushStroke() { var prevPt = this._Points[numPoints-1]; var diffPt = [prevPt[0]-pt[0], prevPt[1]-pt[1]]; var diffPtMag = diffPt[0]*diffPt[0] + diffPt[1]*diffPt[1]; - if (diffPtMag<4) + if (diffPtMag<16)//TODO hook this up to the variable that measures flow/wetness of the paint brush...a smaller number-> more samples doAddPoint=false; } if (doAddPoint) { @@ -184,7 +184,6 @@ function GLBrushStroke() { var bboxHeight = bboxMax[1] - bboxMin[1]; ctx.clearRect(0, 0, bboxWidth, bboxHeight); - /* ctx.lineWidth = this._strokeWidth; ctx.strokeStyle = "black"; @@ -205,31 +204,87 @@ function GLBrushStroke() { ctx.stroke(); */ - var firstPt = this._Points[0]; - var prevX = firstPt[0]-bboxMin[0]; - var prevY = firstPt[1]-bboxMin[1]; + var isDebug = false; + var prevPt = this._Points[0]; + var prevX = prevPt[0]-bboxMin[0]; + var prevY = prevPt[1]-bboxMin[1]; + prevPt = [prevX,prevY]; for (var i = 1; i < numPoints; i++) { var pt = this._Points[i]; ctx.globalCompositeOperation = 'source-over'; var x = pt[0]-bboxMin[0]; var y = pt[1]-bboxMin[1]; - var r = ctx.createLinearGradient(prevX, prevY, x, y); - r.addColorStop(1, 'rgba(0,0,0,0.01)'); - r.addColorStop(0.5,'rgba(255,0,0,1.0)'); - r.addColorStop(0, 'rgba(0,0,0,0.01)'); + pt = [x,y]; - ctx.fillStyle = r; - //ctx.fillStyle = "rgba(0,128,0,0.15)"; + //vector from prev to current pt + var seg = VecUtils.vecSubtract(2, pt, prevPt); + var segDir = VecUtils.vecNormalize(2, seg, 1.0); + + var segMidPt = VecUtils.vecInterpolate(2, pt, prevPt, 0.5); var w2 = this._strokeWidth*0.5; + var segDirOrtho = [w2*segDir[1], -w2*segDir[0]]; + + //add half the strokewidth to the segMidPt + var lgStart = VecUtils.vecAdd(2, segMidPt, segDirOrtho); + var lgEnd = VecUtils.vecSubtract(2, segMidPt, segDirOrtho); + + ctx.save(); + ctx.beginPath(); + + if (isDebug) { + ctx.strokeStyle="black"; + ctx.lineWidth = 1; + + ctx.moveTo(lgStart[0], lgStart[1]); + ctx.lineTo(lgEnd[0], lgEnd[1]); + ctx.stroke(); + } + + var lg = ctx.createLinearGradient(lgStart[0], lgStart[1], lgEnd[0], lgEnd[1]); + lg.addColorStop(1, 'rgba(0,0,0,0.0)'); + lg.addColorStop(0.5,'rgba(255,0,0,1.0)'); + lg.addColorStop(0, 'rgba(0,0,0,0.0)'); + ctx.fillStyle = lg; + + if (isDebug){ + ctx.strokeStyle="blue"; + ctx.lineWidth=0.5; + } ctx.moveTo(prevX-w2, prevY); ctx.lineTo(prevX+w2, prevY); ctx.lineTo(x+w2, y); ctx.lineTo(x-w2, y); + ctx.lineTo(prevX-w2, prevY); ctx.fill(); + ctx.closePath(); + ctx.restore(); + + prevPt = pt; prevX = x; prevY = y; } + + + if (isDebug) + ctx.stroke(); + + if (isDebug){ + //draw the skeleton of this stroke + ctx.lineWidth = 1; + ctx.strokeStyle = "black"; + var pt = this._Points[0]; + ctx.beginPath(); + ctx.moveTo(pt[0]-bboxMin[0],pt[1]-bboxMin[1]); + for (var i = 1; i < numPoints; i++) { + pt = this._Points[i]; + var x = pt[0]-bboxMin[0]; + var y = pt[1]-bboxMin[1]; + ctx.lineTo(x,y); + } + ctx.stroke(); + } + /* var R2 = this._strokeWidth; @@ -256,7 +311,6 @@ function GLBrushStroke() { //ctx.rect(x-R, y-R, R2, R2); } */ - ctx.restore(); } //render() -- cgit v1.2.3 From d0661d6c587aced68a68e36a5ec4e81f8a2096e8 Mon Sep 17 00:00:00 2001 From: hwc487 Date: Thu, 23 Feb 2012 16:57:55 -0800 Subject: bug fixes for canvas 2d shape drawing. --- js/helper-classes/RDGE/GLCircle.js | 136 +++++++++++++++++----------------- js/helper-classes/RDGE/GLLine.js | 57 +++++++------- js/helper-classes/RDGE/GLRectangle.js | 61 ++++++++------- js/tools/LineTool.js | 5 +- 4 files changed, 128 insertions(+), 131 deletions(-) diff --git a/js/helper-classes/RDGE/GLCircle.js b/js/helper-classes/RDGE/GLCircle.js index 712544c0..656657f6 100755 --- a/js/helper-classes/RDGE/GLCircle.js +++ b/js/helper-classes/RDGE/GLCircle.js @@ -398,59 +398,58 @@ function GLCircle() // set up the fill style ctx.beginPath(); ctx.lineWidth = 0; - ctx.fillStyle = "#990000"; if (this._fillColor) { var c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")"; ctx.fillStyle = c; - } - // draw the fill - ctx.beginPath(); - var p = MathUtils.transformPoint( bezPts[0], mat ); - ctx.moveTo( p[0], p[1] ); - var index = 1; - while (index < n) - { - p0 = MathUtils.transformPoint( bezPts[index], mat ); - p1 = MathUtils.transformPoint( bezPts[index+1], mat ); + // draw the fill + ctx.beginPath(); + var p = MathUtils.transformPoint( bezPts[0], mat ); + ctx.moveTo( p[0], p[1] ); + var index = 1; + while (index < n) + { + p0 = MathUtils.transformPoint( bezPts[index], mat ); + p1 = MathUtils.transformPoint( bezPts[index+1], mat ); - x0 = p0[0]; y0 = p0[1]; - x1 = p1[0]; y1 = p1[1]; - ctx.quadraticCurveTo( x0, y0, x1, y1 ); - index += 2; - } + x0 = p0[0]; y0 = p0[1]; + x1 = p1[0]; y1 = p1[1]; + ctx.quadraticCurveTo( x0, y0, x1, y1 ); + index += 2; + } - if ( MathUtils.fpSign(innerRad) > 0) - { - xScale = 0.5*innerRad*this._width; - yScale = 0.5*innerRad*this._height; - mat[0] = xScale; - mat[5] = yScale; - - // get the bezier points - var bezPts = MathUtils.circularArcToBezier( Vector.create([0,0,0]), Vector.create([1,0,0]), -2.0*Math.PI ); - if (bezPts) + if ( MathUtils.fpSign(innerRad) > 0) { - var n = bezPts.length; - p = MathUtils.transformPoint( bezPts[0], mat ); - ctx.moveTo( p[0], p[1] ); - index = 1; - while (index < n) + xScale = 0.5*innerRad*this._width; + yScale = 0.5*innerRad*this._height; + mat[0] = xScale; + mat[5] = yScale; + + // get the bezier points + var bezPts = MathUtils.circularArcToBezier( Vector.create([0,0,0]), Vector.create([1,0,0]), -2.0*Math.PI ); + if (bezPts) { - p0 = MathUtils.transformPoint( bezPts[index], mat ); - p1 = MathUtils.transformPoint( bezPts[index+1], mat ); - - var x0 = p0[0], y0 = p0[1], - x1 = p1[0], y1 = p1[1]; - ctx.quadraticCurveTo( x0, y0, x1, y1 ); - index += 2; + var n = bezPts.length; + p = MathUtils.transformPoint( bezPts[0], mat ); + ctx.moveTo( p[0], p[1] ); + index = 1; + while (index < n) + { + p0 = MathUtils.transformPoint( bezPts[index], mat ); + p1 = MathUtils.transformPoint( bezPts[index+1], mat ); + + var x0 = p0[0], y0 = p0[1], + x1 = p1[0], y1 = p1[1]; + ctx.quadraticCurveTo( x0, y0, x1, y1 ); + index += 2; + } } } - } - // fill the path - ctx.fill(); + // fill the path + ctx.fill(); + } // calculate the stroke matrix xScale = 0.5*this._width - 0.5*lineWidth; @@ -461,35 +460,10 @@ function GLCircle() // set up the stroke style ctx.beginPath(); ctx.lineWidth = lineWidth; - ctx.strokeStyle = "#0000ff"; if (this._strokeColor) { var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; ctx.strokeStyle = c; - } - - // draw the stroke - p = MathUtils.transformPoint( bezPts[0], mat ); - ctx.moveTo( p[0], p[1] ); - index = 1; - while (index < n) - { - var p0 = MathUtils.transformPoint( bezPts[index], mat ); - var p1 = MathUtils.transformPoint( bezPts[index+1], mat ); - - var x0 = p0[0], y0 = p0[1], - x1 = p1[0], y1 = p1[1]; - ctx.quadraticCurveTo( x0, y0, x1, y1 ); - index += 2; - } - - if (MathUtils.fpSign(innerRad) > 0) - { - // calculate the stroke matrix - xScale = 0.5*innerRad*this._width - 0.5*lineWidth; - yScale = 0.5*innerRad*this._height - 0.5*lineWidth; - mat[0] = xScale; - mat[5] = yScale; // draw the stroke p = MathUtils.transformPoint( bezPts[0], mat ); @@ -505,10 +479,34 @@ function GLCircle() ctx.quadraticCurveTo( x0, y0, x1, y1 ); index += 2; } - } - // render the stroke - ctx.stroke(); + if (MathUtils.fpSign(innerRad) > 0) + { + // calculate the stroke matrix + xScale = 0.5*innerRad*this._width - 0.5*lineWidth; + yScale = 0.5*innerRad*this._height - 0.5*lineWidth; + mat[0] = xScale; + mat[5] = yScale; + + // draw the stroke + p = MathUtils.transformPoint( bezPts[0], mat ); + ctx.moveTo( p[0], p[1] ); + index = 1; + while (index < n) + { + var p0 = MathUtils.transformPoint( bezPts[index], mat ); + var p1 = MathUtils.transformPoint( bezPts[index+1], mat ); + + var x0 = p0[0], y0 = p0[1], + x1 = p1[0], y1 = p1[1]; + ctx.quadraticCurveTo( x0, y0, x1, y1 ); + index += 2; + } + } + + // render the stroke + ctx.stroke(); + } } } diff --git a/js/helper-classes/RDGE/GLLine.js b/js/helper-classes/RDGE/GLLine.js index f715a43c..5228ac09 100755 --- a/js/helper-classes/RDGE/GLLine.js +++ b/js/helper-classes/RDGE/GLLine.js @@ -364,41 +364,40 @@ function GLLine( world, xOffset, yOffset, width, height, slope, strokeSize, stro var lineWidth = this._strokeWidth; ctx.beginPath(); ctx.lineWidth = lineWidth; - ctx.strokeStyle = "#0000ff"; if (this._strokeColor) { var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; ctx.strokeStyle = c; - } - // get the points - var p0, p1; - var w = this._width, h = this._height; - if(this._slope === "vertical") - { - p0 = [0.5*w, 0]; - p1 = [0.5*w, h]; - } - else if(this._slope === "horizontal") - { - p0 = [0, 0.5*h]; - p1 = [w, 0.5*h]; - } - else if(this._slope > 0) - { - p0 = [this._xAdj, this._yAdj]; - p1 = [w - this._xAdj, h - this._yAdj]; - } - else - { - p0 = [this._xAdj, h - this._yAdj]; - p1 = [w - this._xAdj, this._yAdj]; - } + // get the points + var p0, p1; + var w = this._width, h = this._height; + if(this._slope === "vertical") + { + p0 = [0.5*w, 0]; + p1 = [0.5*w, h]; + } + else if(this._slope === "horizontal") + { + p0 = [0, 0.5*h]; + p1 = [w, 0.5*h]; + } + else if(this._slope > 0) + { + p0 = [this._xAdj, this._yAdj]; + p1 = [w - this._xAdj, h - this._yAdj]; + } + else + { + p0 = [this._xAdj, h - this._yAdj]; + p1 = [w - this._xAdj, this._yAdj]; + } - // draw the line - ctx.moveTo( p0[0], p0[1] ); - ctx.lineTo( p1[0], p1[1] ); - ctx.stroke(); + // draw the line + ctx.moveTo( p0[0], p0[1] ); + ctx.lineTo( p1[0], p1[1] ); + ctx.stroke(); + } } diff --git a/js/helper-classes/RDGE/GLRectangle.js b/js/helper-classes/RDGE/GLRectangle.js index 3c1cb7dc..cf9c123e 100755 --- a/js/helper-classes/RDGE/GLRectangle.js +++ b/js/helper-classes/RDGE/GLRectangle.js @@ -402,7 +402,6 @@ function GLRectangle() // set the fill ctx.beginPath(); - ctx.fillStyle = "#990000"; if (this._fillColor) { var c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")"; @@ -410,7 +409,6 @@ function GLRectangle() } // set the stroke - ctx.strokeStyle = "#0000ff"; if (this._strokeColor) { var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; @@ -420,8 +418,8 @@ function GLRectangle() ctx.lineWidth = lw; var inset = Math.ceil( 0.5*lw ) + 0.5; this.renderPath( inset, ctx ); - ctx.fill(); - ctx.stroke(); + if (this._fillColor) ctx.fill(); + if (this._strokeColor) ctx.stroke(); ctx.closePath(); } @@ -777,15 +775,15 @@ RectangleFill.create = function( rectCtr, width, height, tlRad, blRad, brRad, } //refine the mesh for vertex deformations - if (material) - { - if (material.hasVertexDeformation()) - { - var paramRange = material.getVertexDeformationRange(); - var tolerance = material.getVertexDeformationTolerance(); - nVertices = ShapePrimitive.refineMesh( this.vertices, this.normals, this.uvs, this.indices, nVertices, paramRange, tolerance ); - } - } +// if (material) +// { +// if (material.hasVertexDeformation()) +// { +// var paramRange = material.getVertexDeformationRange(); +// var tolerance = material.getVertexDeformationTolerance(); +// nVertices = ShapePrimitive.refineMesh( this.vertices, this.normals, this.uvs, this.indices, nVertices, paramRange, tolerance ); +// } +// } // create the RDGE primitive var prim = ShapePrimitive.create(this.vertices, this.normals, this.uvs, this.indices, g_Engine.getContext().renderer.TRIANGLES, nVertices); @@ -1051,15 +1049,15 @@ RectangleStroke.create = function( rectCtr, width, height, strokeWidth, tlRad, } //refine the mesh for vertex deformations - if (material) - { - if (material.hasVertexDeformation()) - { - var paramRange = material.getVertexDeformationRange(); - var tolerance = material.getVertexDeformationTolerance(); - //nVertices = ShapePrimitive.refineMesh( this.vertices, this.normals, this.uvs, this.indices, nVertices, paramRange, tolerance ); - } - } +// if (material) +// { +// if (material.hasVertexDeformation()) +// { +// var paramRange = material.getVertexDeformationRange(); +// var tolerance = material.getVertexDeformationTolerance(); +// nVertices = ShapePrimitive.refineMesh( this.vertices, this.normals, this.uvs, this.indices, nVertices, paramRange, tolerance ); +// } +// } // create the RDGE primitive var prim = ShapePrimitive.create(this.vertices, this.normals, this.uvs, this.indices, g_Engine.getContext().renderer.TRIANGLES, nVertices); @@ -1144,19 +1142,18 @@ RectangleGeometry.create = function( ctr, width, height, material ) RectangleGeometry.pushIndices( 0, 3, 2 ); //refine the mesh for vertex deformations - if (material) - { - if (material.hasVertexDeformation()) - { - var paramRange = material.getVertexDeformationRange(); - var tolerance = material.getVertexDeformationTolerance(); - //nVertices = ShapePrimitive.refineMesh( this.vertices, this.normals, this.uvs, this.indices, nVertices, paramRange, tolerance ); - } - } +// if (material) +// { +// if (material.hasVertexDeformation()) +// { +// var paramRange = material.getVertexDeformationRange(); +// var tolerance = material.getVertexDeformationTolerance(); +// nVertices = ShapePrimitive.refineMesh( this.vertices, this.normals, this.uvs, this.indices, nVertices, paramRange, tolerance ); +// } +// } // create the RDGE primitive var prim = ShapePrimitive.create(this.vertices, this.normals, this.uvs, this.indices, g_Engine.getContext().renderer.TRIANGLES, nVertices); - //var prim = ShapePrimitive.create(this.vertices, this.normals, this.uvs, this.indices, g_Engine.getContext().renderer.LINES, nVertices); return prim; } diff --git a/js/tools/LineTool.js b/js/tools/LineTool.js index 233316a5..0a7c0534 100755 --- a/js/tools/LineTool.js +++ b/js/tools/LineTool.js @@ -42,7 +42,10 @@ exports.LineTool = Montage.create(ShapeTool, { } this._strokeSize = ShapesController.GetValueInPixels(this.options.strokeSize.value, this.options.strokeSize.units, null); - this._strokeColor = this.application.ninja.colorController.colorToolbar.stroke.color.css; + if (this.application.ninja.colorController.colorToolbar.stroke.color) + this._strokeColor = this.application.ninja.colorController.colorToolbar.stroke.color.css; + else + this._strokeColor = [0,0,0,1]; this.startDraw(event); } }, -- cgit v1.2.3 From a5ba66ecefa9c9c17e0f5e1725e2141f7a3540a2 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Fri, 24 Feb 2012 12:01:03 -0800 Subject: adding unpacked to the manifest file (to differentiate from the ninjateam (main) chrome app) --- manifest.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/manifest.json b/manifest.json index 3d156d2b..e9abd76f 100644 --- a/manifest.json +++ b/manifest.json @@ -1,5 +1,5 @@ { - "name": "Motorola Ninja", + "name": "Motorola Ninja Unpacked", "description": "Motorola Ninja HTML5 Authoring Tool Pre-Alpha", "version": "0.5.0.1", "app": { -- cgit v1.2.3 From 544dec04fd379b10eff254bbdd105bfaf828f8a5 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Sun, 26 Feb 2012 12:12:22 -0800 Subject: Cleaning up and adding TODOs --- js/mediators/io-mediator.js | 22 +++++++++++++--------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js index 30180155..f3f58956 100644 --- a/js/mediators/io-mediator.js +++ b/js/mediators/io-mediator.js @@ -146,22 +146,27 @@ exports.IoMediator = Montage.create(Component, { //Copy webGL library if needed if (file.webgl.length > 0) { for (var i in this.application.ninja.coreIoApi.ninjaLibrary.libs) { - //if (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name === 'Assets' || this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name === 'RDGE') { + //Checking for RDGE library to be available if (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name === 'RDGE') { this.application.ninja.coreIoApi.ninjaLibrary.copyLibToCloud(file.document.root, (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name+this.application.ninja.coreIoApi.ninjaLibrary.libs[i].version).toLowerCase()); + } else { + //TODO: Error handle no available library to copy } } } - // + + //TODO: Add check for Monatage library to copy + + //Getting content from function to properly handle saving assets (as in external if flagged) contents = this.parseNinjaTemplateToHtml(file); break; default: contents = file.content; break; } - // + //Making call to save file save = this.fio.saveFile({uri: file.document.uri, contents: contents}); - // + //Checking for callback if (callback) callback(save); } }, @@ -170,7 +175,7 @@ exports.IoMediator = Montage.create(Component, { fileSaveAs: { enumerable: false, value: function (copyTo, copyFrom, callback) { - // + //TODO: Implement Save As functionality } }, //////////////////////////////////////////////////////////////////// @@ -178,7 +183,7 @@ exports.IoMediator = Montage.create(Component, { fileDelete: { enumerable: false, value: function (file, callback) { - // + //TODO: Implement Delete functionality } }, //////////////////////////////////////////////////////////////////// @@ -364,12 +369,11 @@ exports.IoMediator = Montage.create(Component, { */ getPretyHtml: { enumerable: false, - value: function style_html(a,b){function h(){this.pos=0;this.token="";this.current_mode="CONTENT";this.tags={parent:"parent1",parentcount:1,parent1:""};this.tag_type="";this.token_text=this.last_token=this.last_text=this.token_type="";this.Utils={whitespace:"\n\r\t ".split(""),single_token:"br,input,link,meta,!doctype,basefont,base,area,hr,wbr,param,img,isindex,?xml,embed".split(","),extra_liners:"head,body,/html".split(","),in_array:function(a,b){for(var c=0;c=this.input.length){return b.length?b.join(""):["","TK_EOF"]}a=this.input.charAt(this.pos);this.pos++;this.line_char_count++;if(this.Utils.in_array(a,this.Utils.whitespace)){if(b.length){c=true}this.line_char_count--;continue}else if(c){if(this.line_char_count>=this.max_char){b.push("\n");for(var d=0;d","igm");d.lastIndex=this.pos;var e=d.exec(this.input);var f=e?e.index:this.input.length;if(this.pos=this.input.length){return b.length?b.join(""):["","TK_EOF"]}a=this.input.charAt(this.pos);this.pos++;this.line_char_count++;if(this.Utils.in_array(a,this.Utils.whitespace)){c=true;this.line_char_count--;continue}if(a==="'"||a==='"'){if(!b[1]||b[1]!=="!"){a+=this.get_unformatted(a);c=true}}if(a==="="){c=false}if(b.length&&b[b.length-1]!=="="&&a!==">"&&c){if(this.line_char_count>=this.max_char){this.print_newline(false,b);this.line_char_count=0}else{b.push(" ");this.line_char_count++}c=false}b.push(a)}while(a!==">");var d=b.join("");var e;if(d.indexOf(" ")!=-1){e=d.indexOf(" ")}else{e=d.indexOf(">")}var f=d.substring(1,e).toLowerCase();if(d.charAt(d.length-2)==="/"||this.Utils.in_array(f,this.Utils.single_token)){this.tag_type="SINGLE"}else if(f==="script"){this.record_tag(f);this.tag_type="SCRIPT"}else if(f==="style"){this.record_tag(f);this.tag_type="STYLE"}else if(this.Utils.in_array(f,unformatted)){var g=this.get_unformatted("",d);b.push(g);this.tag_type="SINGLE"}else if(f.charAt(0)==="!"){if(f.indexOf("[if")!=-1){if(d.indexOf("!IE")!=-1){var g=this.get_unformatted("-->",d);b.push(g)}this.tag_type="START"}else if(f.indexOf("[endif")!=-1){this.tag_type="END";this.unindent()}else if(f.indexOf("[cdata[")!=-1){var g=this.get_unformatted("]]>",d);b.push(g);this.tag_type="SINGLE"}else{var g=this.get_unformatted("-->",d);b.push(g);this.tag_type="SINGLE"}}else{if(f.charAt(0)==="/"){this.retrieve_tag(f.substring(1));this.tag_type="END"}else{this.record_tag(f);this.tag_type="START"}if(this.Utils.in_array(f,this.Utils.extra_liners)){this.print_newline(true,this.output)}}return b.join("")};this.get_unformatted=function(a,b){if(b&&b.indexOf(a)!=-1){return""}var c="";var d="";var e=true;do{if(this.pos>=this.input.length){return d}c=this.input.charAt(this.pos);this.pos++;if(this.Utils.in_array(c,this.Utils.whitespace)){if(!e){this.line_char_count--;continue}if(c==="\n"||c==="\r"){d+="\n";this.line_char_count=0;continue}}d+=c;this.line_char_count++;e=true}while(d.indexOf(a)==-1);return d};this.get_token=function(){var a;if(this.last_token==="TK_TAG_SCRIPT"||this.last_token==="TK_TAG_STYLE"){var b=this.last_token.substr(7);a=this.get_contents_to(b);if(typeof a!=="string"){return a}return[a,"TK_"+b]}if(this.current_mode==="CONTENT"){a=this.get_content();if(typeof a!=="string"){return a}else{return[a,"TK_CONTENT"]}}if(this.current_mode==="TAG"){a=this.get_tag();if(typeof a!=="string"){return a}else{var c="TK_TAG_"+this.tag_type;return[a,c]}}};this.get_full_indent=function(a){a=this.indent_level+a||0;if(a<1)return"";return Array(a+1).join(this.indent_string)};this.printer=function(a,b,c,d,e){this.input=a||"";this.output=[];this.indent_character=b;this.indent_string="";this.indent_size=c;this.brace_style=e;this.indent_level=0;this.max_char=d;this.line_char_count=0;for(var f=0;f0){this.indent_level--}}};return this}var c,d,e,f,g;b=b||{};d=b.indent_size||4;e=b.indent_char||" ";g=b.brace_style||"collapse";f=b.max_char||"70";unformatted=b.unformatted||["a"];c=new h;c.printer(a,e,d,f,g);while(true){var i=c.get_token();c.token_text=i[0];c.token_type=i[1];if(c.token_type==="TK_EOF"){break}switch(c.token_type){case"TK_TAG_START":c.print_newline(false,c.output);c.print_token(c.token_text);c.indent();c.current_mode="CONTENT";break;case"TK_TAG_STYLE":case"TK_TAG_SCRIPT":c.print_newline(false,c.output);c.print_token(c.token_text);c.current_mode="CONTENT";break;case"TK_TAG_END":if(c.last_token==="TK_CONTENT"&&c.last_text===""){var j=c.token_text.match(/\w+/)[0];var k=c.output[c.output.length-1].match(/<\s*(\w+)/);if(k===null||k[1]!==j)c.print_newline(true,c.output)}c.print_token(c.token_text);c.current_mode="CONTENT";break;case"TK_TAG_SINGLE":c.print_newline(false,c.output);c.print_token(c.token_text);c.current_mode="CONTENT";break;case"TK_CONTENT":if(c.token_text!==""){c.print_token(c.token_text)}c.current_mode="TAG";break;case"TK_STYLE":case"TK_SCRIPT":if(c.token_text!==""){c.output.push("\n");var l=c.token_text;if(c.token_type=="TK_SCRIPT"){var m=typeof js_beautify=="function"&&js_beautify}else if(c.token_type=="TK_STYLE"){var m=typeof css_beautify=="function"&&css_beautify}if(b.indent_scripts=="keep"){var n=0}else if(b.indent_scripts=="separate"){var n=-c.indent_level}else{var n=1}var o=c.get_full_indent(n);if(m){l=m(l.replace(/^\s*/,o),b)}else{var p=l.match(/^\s*/)[0];var q=p.match(/[^\n\r]*$/)[0].split(c.indent_string).length-1;var r=c.get_full_indent(n-q);l=l.replace(/^\s*/,o).replace(/\r\n|\r|\n/g,"\n"+r).replace(/\s*$/,"")}if(l){c.print_token(l);c.print_newline(true,c.output)}}c.current_mode="TAG";break}c.last_token=c.token_type;c.last_text=c.token_text}return c.output.join("")} + value: function (a,b){function h(){this.pos=0;this.token="";this.current_mode="CONTENT";this.tags={parent:"parent1",parentcount:1,parent1:""};this.tag_type="";this.token_text=this.last_token=this.last_text=this.token_type="";this.Utils={whitespace:"\n\r\t ".split(""),single_token:"br,input,link,meta,!doctype,basefont,base,area,hr,wbr,param,img,isindex,?xml,embed".split(","),extra_liners:"head,body,/html".split(","),in_array:function(a,b){for(var c=0;c=this.input.length){return b.length?b.join(""):["","TK_EOF"]}a=this.input.charAt(this.pos);this.pos++;this.line_char_count++;if(this.Utils.in_array(a,this.Utils.whitespace)){if(b.length){c=true}this.line_char_count--;continue}else if(c){if(this.line_char_count>=this.max_char){b.push("\n");for(var d=0;d","igm");d.lastIndex=this.pos;var e=d.exec(this.input);var f=e?e.index:this.input.length;if(this.pos=this.input.length){return b.length?b.join(""):["","TK_EOF"]}a=this.input.charAt(this.pos);this.pos++;this.line_char_count++;if(this.Utils.in_array(a,this.Utils.whitespace)){c=true;this.line_char_count--;continue}if(a==="'"||a==='"'){if(!b[1]||b[1]!=="!"){a+=this.get_unformatted(a);c=true}}if(a==="="){c=false}if(b.length&&b[b.length-1]!=="="&&a!==">"&&c){if(this.line_char_count>=this.max_char){this.print_newline(false,b);this.line_char_count=0}else{b.push(" ");this.line_char_count++}c=false}b.push(a)}while(a!==">");var d=b.join("");var e;if(d.indexOf(" ")!=-1){e=d.indexOf(" ")}else{e=d.indexOf(">")}var f=d.substring(1,e).toLowerCase();if(d.charAt(d.length-2)==="/"||this.Utils.in_array(f,this.Utils.single_token)){this.tag_type="SINGLE"}else if(f==="script"){this.record_tag(f);this.tag_type="SCRIPT"}else if(f==="style"){this.record_tag(f);this.tag_type="STYLE"}else if(this.Utils.in_array(f,unformatted)){var g=this.get_unformatted("",d);b.push(g);this.tag_type="SINGLE"}else if(f.charAt(0)==="!"){if(f.indexOf("[if")!=-1){if(d.indexOf("!IE")!=-1){var g=this.get_unformatted("-->",d);b.push(g)}this.tag_type="START"}else if(f.indexOf("[endif")!=-1){this.tag_type="END";this.unindent()}else if(f.indexOf("[cdata[")!=-1){var g=this.get_unformatted("]]>",d);b.push(g);this.tag_type="SINGLE"}else{var g=this.get_unformatted("-->",d);b.push(g);this.tag_type="SINGLE"}}else{if(f.charAt(0)==="/"){this.retrieve_tag(f.substring(1));this.tag_type="END"}else{this.record_tag(f);this.tag_type="START"}if(this.Utils.in_array(f,this.Utils.extra_liners)){this.print_newline(true,this.output)}}return b.join("")};this.get_unformatted=function(a,b){if(b&&b.indexOf(a)!=-1){return""}var c="";var d="";var e=true;do{if(this.pos>=this.input.length){return d}c=this.input.charAt(this.pos);this.pos++;if(this.Utils.in_array(c,this.Utils.whitespace)){if(!e){this.line_char_count--;continue}if(c==="\n"||c==="\r"){d+="\n";this.line_char_count=0;continue}}d+=c;this.line_char_count++;e=true}while(d.indexOf(a)==-1);return d};this.get_token=function(){var a;if(this.last_token==="TK_TAG_SCRIPT"||this.last_token==="TK_TAG_STYLE"){var b=this.last_token.substr(7);a=this.get_contents_to(b);if(typeof a!=="string"){return a}return[a,"TK_"+b]}if(this.current_mode==="CONTENT"){a=this.get_content();if(typeof a!=="string"){return a}else{return[a,"TK_CONTENT"]}}if(this.current_mode==="TAG"){a=this.get_tag();if(typeof a!=="string"){return a}else{var c="TK_TAG_"+this.tag_type;return[a,c]}}};this.get_full_indent=function(a){a=this.indent_level+a||0;if(a<1)return"";return Array(a+1).join(this.indent_string)};this.printer=function(a,b,c,d,e){this.input=a||"";this.output=[];this.indent_character=b;this.indent_string="";this.indent_size=c;this.brace_style=e;this.indent_level=0;this.max_char=d;this.line_char_count=0;for(var f=0;f0){this.indent_level--}}};return this}var c,d,e,f,g;b=b||{};d=b.indent_size||4;e=b.indent_char||" ";g=b.brace_style||"collapse";f=b.max_char||"70";unformatted=b.unformatted||["a"];c=new h;c.printer(a,e,d,f,g);while(true){var i=c.get_token();c.token_text=i[0];c.token_type=i[1];if(c.token_type==="TK_EOF"){break}switch(c.token_type){case"TK_TAG_START":c.print_newline(false,c.output);c.print_token(c.token_text);c.indent();c.current_mode="CONTENT";break;case"TK_TAG_STYLE":case"TK_TAG_SCRIPT":c.print_newline(false,c.output);c.print_token(c.token_text);c.current_mode="CONTENT";break;case"TK_TAG_END":if(c.last_token==="TK_CONTENT"&&c.last_text===""){var j=c.token_text.match(/\w+/)[0];var k=c.output[c.output.length-1].match(/<\s*(\w+)/);if(k===null||k[1]!==j)c.print_newline(true,c.output)}c.print_token(c.token_text);c.current_mode="CONTENT";break;case"TK_TAG_SINGLE":c.print_newline(false,c.output);c.print_token(c.token_text);c.current_mode="CONTENT";break;case"TK_CONTENT":if(c.token_text!==""){c.print_token(c.token_text)}c.current_mode="TAG";break;case"TK_STYLE":case"TK_SCRIPT":if(c.token_text!==""){c.output.push("\n");var l=c.token_text;if(c.token_type=="TK_SCRIPT"){var m=typeof js_beautify=="function"&&js_beautify}else if(c.token_type=="TK_STYLE"){var m=typeof this.getPretyCss=="function"&&this.getPretyCss}if(b.indent_scripts=="keep"){var n=0}else if(b.indent_scripts=="separate"){var n=-c.indent_level}else{var n=1}var o=c.get_full_indent(n);if(m){l=m(l.replace(/^\s*/,o),b)}else{var p=l.match(/^\s*/)[0];var q=p.match(/[^\n\r]*$/)[0].split(c.indent_string).length-1;var r=c.get_full_indent(n-q);l=l.replace(/^\s*/,o).replace(/\r\n|\r|\n/g,"\n"+r).replace(/\s*$/,"")}if(l){c.print_token(l);c.print_newline(true,c.output)}}c.current_mode="TAG";break}c.last_token=c.token_type;c.last_text=c.token_text}return c.output.join("")} }, - // getPretyCss: { enumerable: false, - value: function css_beautify(a,b){function t(){r--;p=p.slice(0,-c)}function s(){r++;p+=q}function o(a,b){return u.slice(-a.length+(b||0),b).join("").toLowerCase()==a}function n(){var b=g;i();while(i()){if(h=="*"&&j()=="/"){g++;break}}return a.substring(b,g+1)}function m(){var a=g;do{}while(e.test(i()));return g!=a+1}function l(){var a=g;while(e.test(j()))g++;return g!=a}function k(b){var c=g;while(i()){if(h=="\\"){i();i()}else if(h==b){break}else if(h=="\n"){break}}return a.substring(c,g+1)}function j(){return a.charAt(g+1)}function i(){return h=a.charAt(++g)}b=b||{};var c=b.indent_size||4;var d=b.indent_char||" ";if(typeof c=="string")c=parseInt(c);var e=/^\s+$/;var f=/[\w$\-_]/;var g=-1,h;var p=a.match(/^[\r\n]*[\t ]*/)[0];var q=Array(c+1).join(d);var r=0;print={};print["{"]=function(a){print.singleSpace();u.push(a);print.newLine()};print["}"]=function(a){print.newLine();u.push(a);print.newLine()};print.newLine=function(a){if(!a)while(e.test(u[u.length-1]))u.pop();if(u.length)u.push("\n");if(p)u.push(p)};print.singleSpace=function(){if(u.length&&!e.test(u[u.length-1]))u.push(" ")};var u=[];if(p)u.push(p);while(true){var v=m();if(!h)break;if(h=="{"){s();print["{"](h)}else if(h=="}"){t();print["}"](h)}else if(h=='"'||h=="'"){u.push(k(h))}else if(h==";"){u.push(h,"\n",p)}else if(h=="/"&&j()=="*"){print.newLine();u.push(n(),"\n",p)}else if(h=="("){u.push(h);l();if(o("url",-1)&&i()){if(h!=")"&&h!='"'&&h!="'")u.push(k(")"));else g--}}else if(h==")"){u.push(h)}else if(h==","){l();u.push(h);print.singleSpace()}else if(h=="]"){u.push(h)}else if(h=="["||h=="="){l();u.push(h)}else{if(v)print.singleSpace();u.push(h)}}var w=u.join("").replace(/[\n ]+$/,"");return w} + value: function (a,b){function t(){r--;p=p.slice(0,-c)}function s(){r++;p+=q}function o(a,b){return u.slice(-a.length+(b||0),b).join("").toLowerCase()==a}function n(){var b=g;i();while(i()){if(h=="*"&&j()=="/"){g++;break}}return a.substring(b,g+1)}function m(){var a=g;do{}while(e.test(i()));return g!=a+1}function l(){var a=g;while(e.test(j()))g++;return g!=a}function k(b){var c=g;while(i()){if(h=="\\"){i();i()}else if(h==b){break}else if(h=="\n"){break}}return a.substring(c,g+1)}function j(){return a.charAt(g+1)}function i(){return h=a.charAt(++g)}b=b||{};var c=b.indent_size||4;var d=b.indent_char||" ";if(typeof c=="string")c=parseInt(c);var e=/^\s+$/;var f=/[\w$\-_]/;var g=-1,h;var p=a.match(/^[\r\n]*[\t ]*/)[0];var q=Array(c+1).join(d);var r=0;print={};print["{"]=function(a){print.singleSpace();u.push(a);print.newLine()};print["}"]=function(a){print.newLine();u.push(a);print.newLine()};print.newLine=function(a){if(!a)while(e.test(u[u.length-1]))u.pop();if(u.length)u.push("\n");if(p)u.push(p)};print.singleSpace=function(){if(u.length&&!e.test(u[u.length-1]))u.push(" ")};var u=[];if(p)u.push(p);while(true){var v=m();if(!h)break;if(h=="{"){s();print["{"](h)}else if(h=="}"){t();print["}"](h)}else if(h=='"'||h=="'"){u.push(k(h))}else if(h==";"){u.push(h,"\n",p)}else if(h=="/"&&j()=="*"){print.newLine();u.push(n(),"\n",p)}else if(h=="("){u.push(h);l();if(o("url",-1)&&i()){if(h!=")"&&h!='"'&&h!="'")u.push(k(")"));else g--}}else if(h==")"){u.push(h)}else if(h==","){l();u.push(h);print.singleSpace()}else if(h=="]"){u.push(h)}else if(h=="["||h=="="){l();u.push(h)}else{if(v)print.singleSpace();u.push(h)}}var w=u.join("").replace(/[\n ]+$/,"");return w} } //////////////////////////////////////////////////////////////////// }); -- cgit v1.2.3 From 8578322c60adaaf65f37ba96f2a0f7ed9de8e1dc Mon Sep 17 00:00:00 2001 From: hwc487 Date: Mon, 27 Feb 2012 10:28:03 -0800 Subject: Fixed various rendering bugs. --- js/helper-classes/RDGE/GLCircle.js | 4 ++-- js/helper-classes/RDGE/GLGeomObj.js | 4 ++-- js/helper-classes/RDGE/GLLine.js | 2 +- js/helper-classes/RDGE/GLRectangle.js | 24 +++++++++++++++--------- js/helper-classes/RDGE/GLWorld.js | 2 +- 5 files changed, 21 insertions(+), 15 deletions(-) diff --git a/js/helper-classes/RDGE/GLCircle.js b/js/helper-classes/RDGE/GLCircle.js index 656657f6..15ed6b6d 100755 --- a/js/helper-classes/RDGE/GLCircle.js +++ b/js/helper-classes/RDGE/GLCircle.js @@ -47,8 +47,8 @@ function GLCircle() this._strokeWidth = strokeSize; this._innerRadius = innerRadius; - this._strokeColor = strokeColor; - this._fillColor = fillColor; + if (strokeColor) this._strokeColor = strokeColor; + if (fillColor) this._fillColor = fillColor; this._strokeStyle = strokeStyle; } diff --git a/js/helper-classes/RDGE/GLGeomObj.js b/js/helper-classes/RDGE/GLGeomObj.js index 5d7497ad..c1ee01ba 100755 --- a/js/helper-classes/RDGE/GLGeomObj.js +++ b/js/helper-classes/RDGE/GLGeomObj.js @@ -38,8 +38,8 @@ function GLGeomObj() this.m_world = null; // stroke and fill colors - this._strokeColor; - this._fillColor; + this._strokeColor = [0,0,0,0]; + this._fillColor = [0,0,0,0]; // stroke and fill materials this._fillMaterial; diff --git a/js/helper-classes/RDGE/GLLine.js b/js/helper-classes/RDGE/GLLine.js index 5228ac09..5b966896 100755 --- a/js/helper-classes/RDGE/GLLine.js +++ b/js/helper-classes/RDGE/GLLine.js @@ -43,7 +43,7 @@ function GLLine( world, xOffset, yOffset, width, height, slope, strokeSize, stro this._slope = slope; this._strokeWidth = strokeSize; - this._strokeColor = strokeColor; + if (strokeCOlor)this._strokeColor = strokeColor; this._strokeStyle = strokeStyle; this._scaleX = (world.getViewportWidth())/(world.getViewportHeight()); diff --git a/js/helper-classes/RDGE/GLRectangle.js b/js/helper-classes/RDGE/GLRectangle.js index cf9c123e..a801d3c4 100755 --- a/js/helper-classes/RDGE/GLRectangle.js +++ b/js/helper-classes/RDGE/GLRectangle.js @@ -400,27 +400,33 @@ function GLRectangle() var w = world.getViewportWidth(), h = world.getViewportHeight(); - // set the fill + // render the fill ctx.beginPath(); if (this._fillColor) { var c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")"; ctx.fillStyle = c; + + ctx.lineWidth = lw; + var inset = Math.ceil( lw ) + 0.5; + this.renderPath( inset, ctx ); + ctx.fill(); + ctx.closePath(); } - // set the stroke + // render the stroke + ctx.beginPath(); if (this._strokeColor) { var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; ctx.strokeStyle = c; - } - ctx.lineWidth = lw; - var inset = Math.ceil( 0.5*lw ) + 0.5; - this.renderPath( inset, ctx ); - if (this._fillColor) ctx.fill(); - if (this._strokeColor) ctx.stroke(); - ctx.closePath(); + ctx.lineWidth = lw; + var inset = Math.ceil( 0.5*lw ) + 0.5; + this.renderPath( inset, ctx ); + ctx.stroke(); + ctx.closePath(); + } } this.createStroke = function(ctr, width, height, strokeWidth, tlRad, blRad, brRad, trRad, material) diff --git a/js/helper-classes/RDGE/GLWorld.js b/js/helper-classes/RDGE/GLWorld.js index 0addcadc..646faa24 100755 --- a/js/helper-classes/RDGE/GLWorld.js +++ b/js/helper-classes/RDGE/GLWorld.js @@ -157,7 +157,7 @@ function GLWorld( canvas, use3D ) // change clear color //this.renderer.setClearFlags(g_Engine.getContext().DEPTH_BUFFER_BIT); - this.renderer.setClearColor([1.0, 1.0, 1.0, 0.0]); + this.renderer.setClearColor([0.0, 0.0, 0.0, 0.0]); //this.renderer.NinjaWorld = this; // create an empty scene graph -- cgit v1.2.3 From bfa895634324a78652f2a7eecf725d9c6030023f Mon Sep 17 00:00:00 2001 From: hwc487 Date: Mon, 27 Feb 2012 11:58:44 -0800 Subject: Changed the hardcoded publish setting for a PI fix. --- js/helper-classes/RDGE/GLWorld.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/helper-classes/RDGE/GLWorld.js b/js/helper-classes/RDGE/GLWorld.js index 646faa24..8017207f 100755 --- a/js/helper-classes/RDGE/GLWorld.js +++ b/js/helper-classes/RDGE/GLWorld.js @@ -824,7 +824,7 @@ GLWorld.prototype.export = function() // we need 2 export modes: One for save/restore, one for publish. // hardcoding for now - var exportForPublish = true; + var exportForPublish = false; exportStr += "publish: " + exportForPublish + "\n"; if (exportForPublish) -- cgit v1.2.3 From 604ace9cfc9fae6b6c121259523a9060c5306161 Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Mon, 27 Feb 2012 11:59:58 -0800 Subject: - save show3DGrid flag per document while switching documents - fix zoom tool keyboard control to listen to Z when ctrl and shift keys are not pressed with it Signed-off-by: Ananya Sen --- js/document/html-document.js | 4 ++++ js/mediators/keyboard-mediator.js | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/js/document/html-document.js b/js/document/html-document.js index 8798b407..c36e61d5 100755 --- a/js/document/html-document.js +++ b/js/document/html-document.js @@ -623,6 +623,8 @@ exports.HTMLDocument = Montage.create(TextDocument, { if(typeof this.application.ninja.selectedElements !== 'undefined'){ this.selectionModel = this.application.ninja.selectedElements; } + + this.draw3DGrid = this.application.ninja.appModel.show3dGrid; } }, @@ -644,6 +646,8 @@ exports.HTMLDocument = Montage.create(TextDocument, { this.application.ninja.stage._scrollLeft = this.savedTopScroll; } this.application.ninja.stage.handleScroll(); + + this.application.ninja.appModel.show3dGrid = this.draw3DGrid; } } //////////////////////////////////////////////////////////////////// diff --git a/js/mediators/keyboard-mediator.js b/js/mediators/keyboard-mediator.js index f05d3382..e5b50b03 100755 --- a/js/mediators/keyboard-mediator.js +++ b/js/mediators/keyboard-mediator.js @@ -170,7 +170,7 @@ exports.KeyboardMediator = Montage.create(Component, { } // Zoom tool - if(evt.keyCode === Keyboard.Z ) { + if((evt.keyCode === Keyboard.Z) && !(evt.ctrlKey || evt.metaKey) && !evt.shiftKey) {//ctrl or shift key not press with Z evt.preventDefault(); this.application.ninja.handleSelectTool({"detail": this.application.ninja.toolsData.defaultToolsData[14]}); return; -- cgit v1.2.3 From ec5f81c6c0ccf865505ab82ebf9240c667f05c91 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Mon, 27 Feb 2012 12:07:30 -0800 Subject: Timeline: further work on clearTimeline method. --- .../Timeline/TimelinePanel.reel/TimelinePanel.html | 5 +++-- js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 18 ++++++++++++++---- 2 files changed, 17 insertions(+), 6 deletions(-) diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html index 9d0b8210..65d2fa7b 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html @@ -32,7 +32,8 @@ "timetext" : {"#": "time_text"}, "timebar" : {"#": "time_bar"}, "container_tracks" : {"#" : "container-tracks"}, - "end_hottext" : {"@" : "endHottext"} + "end_hottext" : {"@" : "endHottext"}, + "getme" : {"#" : "getme"} } }, @@ -284,7 +285,7 @@
-
Master Layer
+
Master Layer
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 2143dafd..9519730e 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -172,6 +172,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { prepareForDraw:{ value:function () { this.eventManager.addEventListener( "onOpenDocument", this, false); + var that = this; + this.getme.addEventListener("click", function() { + that.clearTimelinePanel(); + }, false) } }, @@ -246,11 +250,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { clearTimelinePanel : { value: function() { console.log('clearing timeline...') - this.arrTracks = null; - this.arrLayers = null; + // update playhead position and time text + this.application.ninja.timeline.playhead.style.left = "-2px"; + this.application.ninja.timeline.playheadmarker.style.left = "0px"; + this.application.ninja.timeline.updateTimeText(0.00); + this.timebar.style.width = "0px"; + + this.arrTracks = []; + this.arrLayers = []; this.currentLayerNumber = 0; - this.currentLayerSelected = null; - this.currentTrackSelected = null; + this.currentLayerSelected = false; + this.currentTrackSelected = false; this.selectedKeyframes = []; this.selectedTweens = []; this._captureSelection = false; -- cgit v1.2.3 From a8bd1585ae83d4d304b9f9f41823bb3dcbff9e01 Mon Sep 17 00:00:00 2001 From: hwc487 Date: Mon, 27 Feb 2012 12:14:29 -0800 Subject: Color fix for line shapes. --- js/helper-classes/RDGE/GLLine.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/js/helper-classes/RDGE/GLLine.js b/js/helper-classes/RDGE/GLLine.js index 5b966896..65e6ab1c 100755 --- a/js/helper-classes/RDGE/GLLine.js +++ b/js/helper-classes/RDGE/GLLine.js @@ -11,6 +11,10 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot /////////////////////////////////////////////////////////////////////// function GLLine( world, xOffset, yOffset, width, height, slope, strokeSize, strokeColor, strokeMaterial, strokeStyle, xAdj, yAdj) { + // initialize the inherited members + this.inheritedFrom = GLGeomObj; + this.inheritedFrom(); + /////////////