From c14b8d9fd1acde98ffc427b0bbdba7d1442c39a4 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Thu, 3 May 2012 17:07:40 -0700 Subject: Converting canvas runtime to use prototypes for geom obj, rectangle, oval and line. Signed-off-by: Nivesh Rajbhandari --- assets/canvas-runtime.js | 1336 +++++++++++++++++++++++----------------------- 1 file changed, 672 insertions(+), 664 deletions(-) (limited to 'assets') diff --git a/assets/canvas-runtime.js b/assets/canvas-runtime.js index 104c22cc..17f8cda8 100644 --- a/assets/canvas-runtime.js +++ b/assets/canvas-runtime.js @@ -305,16 +305,19 @@ NinjaCvsRt.GLRuntime = function ( canvas, jObj, assetPath ) { case 1: obj = new NinjaCvsRt.RuntimeRectangle(); + obj._materials = []; obj.importJSON( jObj ); break; case 2: // circle obj = new NinjaCvsRt.RuntimeOval(); + obj._materials = []; obj.importJSON( jObj ); break; case 3: // line obj = new NinjaCvsRt.RuntimeLine(); + obj._materials = []; obj.importJSON( jObj ); break; @@ -481,204 +484,205 @@ NinjaCvsRt.RuntimeGeomObj = function () // array of materials this._materials = []; +}; - /////////////////////////////////////////////////////////////////////// - // Property accessors - /////////////////////////////////////////////////////////////////////// - - this.geomType = function() { return this.GEOM_TYPE_UNDEFINED; }; - - this.setWorld = function(w) { this._world = w; }; - this.getWorld = function() { return this._world; }; +//NinjaCvsRt.RuntimeGeomObj.prototype = Object.create(Object.prototype, {}); +/////////////////////////////////////////////////////////////////////// +// Property accessors +/////////////////////////////////////////////////////////////////////// - /////////////////////////////////////////////////////////////////////// - // Methods - /////////////////////////////////////////////////////////////////////// - this.addChild = function( child ) - { - if (!this._children) this._children = []; - this._children.push( child ); - }; +NinjaCvsRt.RuntimeGeomObj.prototype.geomType = function() { return this.GEOM_TYPE_UNDEFINED; }; - this.importJSON = function() - { - }; +NinjaCvsRt.RuntimeGeomObj.prototype.setWorld = function(w) { this._world = w; }; +NinjaCvsRt.RuntimeGeomObj.prototype.getWorld = function() { return this._world; }; - this.importMaterials = function(jObj) - { - if (!jObj || !jObj.materials) return; - var nMaterials = jObj.nMaterials; - var matArray = jObj.materials; - for (var i=0; i= 0.001) - { - var scale = len/sum; - rtnVec = []; - for (i = 0; i= 0.001) { - var pt = srcPt.slice(0); - var x = this.vecDot(3, pt, [mat[0], mat[4], mat[ 8]] ) + mat[12], - y = this.vecDot(3, pt, [mat[1], mat[5], mat[ 9]] ) + mat[13], - z = this.vecDot(3, pt, [mat[2], mat[6], mat[10]] ) + mat[14]; + var scale = len/sum; + rtnVec = []; + for (i = 0; i minDimen) tlRad = minDimen; - if (blRad > minDimen) blRad = minDimen; - if (brRad > minDimen) brRad = minDimen; - if (trRad > minDimen) trRad = minDimen; - - var world = this.getWorld(); - var vpw = world.getViewportWidth(), vph = world.getViewportHeight(); - var cop = [0.5*vpw, 0.5*vph, 0.0]; - var xCtr = cop[0] + this._xOffset, yCtr = cop[1] - this._yOffset; - var xLeft = xCtr - 0.5*this._width, yTop = yCtr - 0.5*this._height; - var xDist = cop[0] - xLeft, yDist = cop[1] - yTop; - var xOff = 0.5*vpw - xDist, yOff = 0.5*vph - yDist; - - if ((tlRad <= 0) && (blRad <= 0) && (brRad <= 0) && (trRad <= 0)) - { - ctx.rect(pt[0]+xOff, pt[1]+yOff, width - 2*inset, height - 2*inset); - } - else - { - // get the top left point - rad = tlRad - inset; - if (rad < 0) rad = 0; - pt[1] += rad; - if (Math.abs(rad) < 0.001) pt[1] = inset; - ctx.moveTo( pt[0]+xOff, pt[1]+yOff ); - - // get the bottom left point - pt = [inset, height - inset]; - rad = blRad - inset; - if (rad < 0) rad = 0; - pt[1] -= rad; - ctx.lineTo( pt[0]+xOff, pt[1]+yOff ); - - // get the bottom left curve - if (rad > 0.001) - ctx.quadraticCurveTo( inset+xOff, height-inset+yOff, inset+rad+xOff, height-inset+yOff ); - - // do the bottom of the rectangle - pt = [width - inset, height - inset]; - rad = brRad - inset; - if (rad < 0) rad = 0; - pt[0] -= rad; - ctx.lineTo( pt[0]+xOff, pt[1]+yOff ); - - // get the bottom right arc - if (rad > 0.001) - ctx.quadraticCurveTo( width-inset+xOff, height-inset+yOff, width-inset+xOff, height-inset-rad+yOff ); - - // get the right of the rectangle - pt = [width - inset, inset]; - rad = trRad - inset; - if (rad < 0) rad = 0; - pt[1] += rad; - ctx.lineTo( pt[0]+xOff, pt[1]+yOff ); - - // do the top right corner - if (rad > 0.001) - ctx.quadraticCurveTo( width-inset+xOff, inset+yOff, width-inset-rad+xOff, inset+yOff ); - - // do the top of the rectangle - pt = [inset, inset]; - rad = tlRad - inset; - if (rad < 0) rad = 0; - pt[0] += rad; - ctx.lineTo( pt[0]+xOff, pt[1]+yOff); - - // do the top left corner - if (rad > 0.001) - ctx.quadraticCurveTo( inset+xOff, inset+yOff, inset+xOff, inset+rad+yOff ); - else - ctx.lineTo( inset+xOff, 2*inset+yOff ); - } - }; +NinjaCvsRt.RuntimeRectangle.prototype.importJSON = function( jObj ) +{ + this._xOffset = jObj.xoff; + this._yOffset = jObj.yoff; + this._width = jObj.width; + this._height = jObj.height; + this._strokeWidth = jObj.strokeWidth; + this._strokeColor = jObj.strokeColor; + this._fillColor = jObj.fillColor; + this._tlRadius = jObj.tlRadius; + this._trRadius = jObj.trRadius; + this._blRadius = jObj.blRadius; + this._brRadius = jObj.brRadius; + this._innerRadius = jObj.innerRadius; + this._strokeStyle = jObj.strokeStyle; + var strokeMaterialName = jObj.strokeMat; + var fillMaterialName = jObj.fillMat; + this.importMaterials( jObj.materials ); +}; - this.render = function() +NinjaCvsRt.RuntimeRectangle.prototype.renderPath = function( inset, ctx ) +{ + // various declarations + var pt, rad, ctr, startPt, bPts; + var width = Math.round(this._width), + height = Math.round(this._height), + hw = 0.5*width, + hh = 0.5*height; + + pt = [inset, inset]; // top left corner + + var tlRad = this._tlRadius; //top-left radius + var trRad = this._trRadius; + var blRad = this._blRadius; + var brRad = this._brRadius; + // limit the radii to half the rectangle dimension + var minDimen = hw < hh ? hw : hh; + if (tlRad > minDimen) tlRad = minDimen; + if (blRad > minDimen) blRad = minDimen; + if (brRad > minDimen) brRad = minDimen; + if (trRad > minDimen) trRad = minDimen; + + var world = this.getWorld(); + var vpw = world.getViewportWidth(), vph = world.getViewportHeight(); + var cop = [0.5*vpw, 0.5*vph, 0.0]; + var xCtr = cop[0] + this._xOffset, yCtr = cop[1] - this._yOffset; + var xLeft = xCtr - 0.5*this._width, yTop = yCtr - 0.5*this._height; + var xDist = cop[0] - xLeft, yDist = cop[1] - yTop; + var xOff = 0.5*vpw - xDist, yOff = 0.5*vph - yDist; + + if ((tlRad <= 0) && (blRad <= 0) && (brRad <= 0) && (trRad <= 0)) { - // get the world - var world = this.getWorld(); - if (!world) throw( "null world in rectangle render" ); - - // get the context - var ctx = world.get2DContext(); - if (!ctx) return; - - // get some dimensions - var lw = this._strokeWidth; - var w = world.getViewportWidth(), - h = world.getViewportHeight(); - - var c, - inset, - gradient, - colors, - len, - n, - position, - cs; - // render the fill - ctx.beginPath(); - if (this._fillColor) { - inset = Math.ceil( lw ) - 0.5; - - if(this._fillColor.gradientMode) { - if(this._fillColor.gradientMode === "radial") { - gradient = ctx.createRadialGradient(w/2, h/2, 0, w/2, h/2, Math.max(w, h)/2); - } else { - gradient = ctx.createLinearGradient(inset/2, h/2, w-inset, h/2); - } - colors = this._fillColor.color; - - len = colors.length; - - for(n=0; n 0.001) + ctx.quadraticCurveTo( inset+xOff, height-inset+yOff, inset+rad+xOff, height-inset+yOff ); + + // do the bottom of the rectangle + pt = [width - inset, height - inset]; + rad = brRad - inset; + if (rad < 0) rad = 0; + pt[0] -= rad; + ctx.lineTo( pt[0]+xOff, pt[1]+yOff ); + + // get the bottom right arc + if (rad > 0.001) + ctx.quadraticCurveTo( width-inset+xOff, height-inset+yOff, width-inset+xOff, height-inset-rad+yOff ); + + // get the right of the rectangle + pt = [width - inset, inset]; + rad = trRad - inset; + if (rad < 0) rad = 0; + pt[1] += rad; + ctx.lineTo( pt[0]+xOff, pt[1]+yOff ); + + // do the top right corner + if (rad > 0.001) + ctx.quadraticCurveTo( width-inset+xOff, inset+yOff, width-inset-rad+xOff, inset+yOff ); + + // do the top of the rectangle + pt = [inset, inset]; + rad = tlRad - inset; + if (rad < 0) rad = 0; + pt[0] += rad; + ctx.lineTo( pt[0]+xOff, pt[1]+yOff); + + // do the top left corner + if (rad > 0.001) + ctx.quadraticCurveTo( inset+xOff, inset+yOff, inset+xOff, inset+rad+yOff ); + else + ctx.lineTo( inset+xOff, 2*inset+yOff ); + } +}; +NinjaCvsRt.RuntimeRectangle.prototype.render = function() +{ + // get the world + var world = this.getWorld(); + if (!world) throw( "null world in rectangle render" ); + + // get the context + var ctx = world.get2DContext(); + if (!ctx) return; + + // get some dimensions + var lw = this._strokeWidth; + var w = world.getViewportWidth(), + h = world.getViewportHeight(); + + var c, + inset, + gradient, + colors, + len, + n, + position, + cs; + // render the fill + ctx.beginPath(); + if (this._fillColor) { + inset = Math.ceil( lw ) - 0.5; + + if(this._fillColor.gradientMode) { + if(this._fillColor.gradientMode === "radial") { + gradient = ctx.createRadialGradient(w/2, h/2, 0, w/2, h/2, Math.max(w, h)/2); } else { - c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")"; - ctx.fillStyle = c; + gradient = ctx.createLinearGradient(inset/2, h/2, w-inset, h/2); } + colors = this._fillColor.color; - ctx.lineWidth = lw; - this.renderPath( inset, ctx ); - ctx.fill(); - ctx.closePath(); - } + len = colors.length; - // render the stroke - ctx.beginPath(); - if (this._strokeColor) { - inset = Math.ceil( 0.5*lw ) - 0.5; + for(n=0; n 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; - 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(); + } }; /////////////////////////////////////////////////////////////////////// @@ -996,180 +1003,205 @@ NinjaCvsRt.RuntimeLine = function () /////////////////////////////////////////////////////////////////////// NinjaCvsRt.RuntimeOval = function () { +}; // inherit the members of NinjaCvsRt.RuntimeGeomObj - this.inheritedFrom = NinjaCvsRt.RuntimeGeomObj; - this.inheritedFrom(); +// this.inheritedFrom = NinjaCvsRt.RuntimeGeomObj; +// this.inheritedFrom(); +NinjaCvsRt.RuntimeOval.prototype = Object.create(NinjaCvsRt.RuntimeGeomObj.prototype, {}); - this.importJSON = function( jObj ) - { - this._xOffset = jObj.xoff; - this._yOffset = jObj.yoff; - this._width = jObj.width; - this._height = jObj.height; - this._strokeWidth = jObj.strokeWidth; - this._strokeColor = jObj.strokeColor; - this._fillColor = jObj.fillColor; - this._innerRadius = jObj.innerRadius; - this._strokeStyle = jObj.strokeStyle; - var strokeMaterialName = jObj.strokeMat; - var fillMaterialName = jObj.fillMat; - this.importMaterials( jObj.materials ); - }; - - this.render = function() - { - // get the world - var world = this.getWorld(); - if (!world) throw( "null world in buildBuffers" ); - - // get the context - var ctx = world.get2DContext(); - if (!ctx) return; - - // declare some variables - var p0, p1; - var x0, y0, x1, y1; - - // create the matrix - var lineWidth = this._strokeWidth; - var innerRad = this._innerRadius; - var xScale = 0.5*this._width - lineWidth, - yScale = 0.5*this._height - lineWidth; - - // translate - var xCtr = 0.5*world.getViewportWidth() + this._xOffset, - yCtr = 0.5*world.getViewportHeight() + this._yOffset; - var mat = this.MatrixIdentity( 4 ); - mat[0] = xScale; mat[12] = xCtr; - mat[5] = yScale; mat[13] = yCtr; - /* - var mat = [ - [ xScale, 0.0, 0.0, xCtr], - [ 0.0, yScale, 0.0, yCtr], - [ 0.0, 0.0, 1.0, 0.0], - [ 0.0, 0.0, 0.0, 1.0] - ]; - */ - - // get a bezier representation of the circle - var bezPts = this.circularArcToBezier( [0,0,0], [1,0,0], 2.0*Math.PI ); - if (bezPts) - { - var n = bezPts.length; - var gradient, - colors, - len, - j, - position, - cs, - c; - - // set up the fill style - ctx.beginPath(); - ctx.lineWidth = 0; - if (this._fillColor) { - if(this._fillColor.gradientMode) { - if(this._fillColor.gradientMode === "radial") { - gradient = ctx.createRadialGradient(xCtr, yCtr, 0, - xCtr, yCtr, Math.max(this._width, this._height)/2); - } else { - gradient = ctx.createLinearGradient(lineWidth/2, this._height/2, this._width-lineWidth, this._height/2); - } - colors = this._fillColor.color; +NinjaCvsRt.RuntimeOval.prototype.importJSON = function( jObj ) +{ + this._xOffset = jObj.xoff; + this._yOffset = jObj.yoff; + this._width = jObj.width; + this._height = jObj.height; + this._strokeWidth = jObj.strokeWidth; + this._strokeColor = jObj.strokeColor; + this._fillColor = jObj.fillColor; + this._innerRadius = jObj.innerRadius; + this._strokeStyle = jObj.strokeStyle; + var strokeMaterialName = jObj.strokeMat; + var fillMaterialName = jObj.fillMat; + this.importMaterials( jObj.materials ); +}; - len = colors.length; +NinjaCvsRt.RuntimeOval.prototype.render = function() +{ + // get the world + var world = this.getWorld(); + if (!world) throw( "null world in buildBuffers" ); + + // get the context + var ctx = world.get2DContext(); + if (!ctx) return; + + // declare some variables + var p0, p1; + var x0, y0, x1, y1; + + // create the matrix + var lineWidth = this._strokeWidth; + var innerRad = this._innerRadius; + var xScale = 0.5*this._width - lineWidth, + yScale = 0.5*this._height - lineWidth; + + // translate + var xCtr = 0.5*world.getViewportWidth() + this._xOffset, + yCtr = 0.5*world.getViewportHeight() + this._yOffset; + var mat = this.MatrixIdentity( 4 ); + mat[0] = xScale; mat[12] = xCtr; + mat[5] = yScale; mat[13] = yCtr; + /* + var mat = [ + [ xScale, 0.0, 0.0, xCtr], + [ 0.0, yScale, 0.0, yCtr], + [ 0.0, 0.0, 1.0, 0.0], + [ 0.0, 0.0, 0.0, 1.0] + ]; + */ + + // get a bezier representation of the circle + var bezPts = this.circularArcToBezier( [0,0,0], [1,0,0], 2.0*Math.PI ); + if (bezPts) + { + var n = bezPts.length; + var gradient, + colors, + len, + j, + position, + cs, + c; - for(j=0; j 0.001) { + xScale = 0.5*innerRad*this._width; + yScale = 0.5*innerRad*this._height; + mat[0] = xScale; + mat[5] = yScale; + + // get the bezier points + var bezPtsInside = this.circularArcToBezier( [0,0,0], [1,0,0], -2.0*Math.PI ); + if (bezPtsInside) { + n = bezPtsInside.length; + p = this.transformPoint( bezPtsInside[0], mat ); + ctx.moveTo( p[0], p[1] ); + index = 1; + while (index < n) { + p0 = this.transformPoint( bezPtsInside[index], mat ); + p1 = this.transformPoint( bezPtsInside[index+1], mat ); - if (innerRad > 0.001) { - xScale = 0.5*innerRad*this._width; - yScale = 0.5*innerRad*this._height; - mat[0] = xScale; - mat[5] = yScale; - - // get the bezier points - var bezPtsInside = this.circularArcToBezier( [0,0,0], [1,0,0], -2.0*Math.PI ); - if (bezPtsInside) { - n = bezPtsInside.length; - p = this.transformPoint( bezPtsInside[0], mat ); - ctx.moveTo( p[0], p[1] ); - index = 1; - while (index < n) { - p0 = this.transformPoint( bezPtsInside[index], mat ); - p1 = this.transformPoint( bezPtsInside[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; } } - - // fill the path - ctx.fill(); } - // calculate the stroke matrix - xScale = 0.5*this._width - 0.5*lineWidth; - yScale = 0.5*this._height - 0.5*lineWidth; - mat[0] = xScale; - mat[5] = yScale; - - // set up the stroke style - ctx.beginPath(); - ctx.lineWidth = lineWidth; - if (this._strokeColor) { - if(this._strokeColor.gradientMode) { - if(this._strokeColor.gradientMode === "radial") { - gradient = ctx.createRadialGradient(xCtr, yCtr, Math.min(xScale, yScale), - xCtr, yCtr, 0.5*Math.max(this._height, this._width)); - } else { - gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2); - } - colors = this._strokeColor.color; + // fill the path + ctx.fill(); + } - len = colors.length; + // calculate the stroke matrix + xScale = 0.5*this._width - 0.5*lineWidth; + yScale = 0.5*this._height - 0.5*lineWidth; + mat[0] = xScale; + mat[5] = yScale; - for(j=0; j 0.001) { + // 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 = this.transformPoint( bezPts[0], mat ); ctx.moveTo( p[0], p[1] ); @@ -1185,90 +1217,66 @@ NinjaCvsRt.RuntimeOval = function () ctx.quadraticCurveTo( x0, y0, x1, y1 ); index += 2; } - - if (innerRad > 0.001) { - // 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 = this.transformPoint( bezPts[0], mat ); - ctx.moveTo( p[0], p[1] ); - index = 1; - while (index < n) { - p0 = this.transformPoint( bezPts[index], mat ); - p1 = this.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; - } - } - - // render the stroke - ctx.stroke(); } - } - }; - /////////////////////////////////////////////////////////////////////// - // this function returns the quadratic Bezier approximation to the specified - // circular arc. The input can be 2D or 3D, determined by the minimum dimension - // of the center and start point. - // includedAngle is in radians, can be positiveor negative - this.circularArcToBezier= function( ctr_, startPt_, includedAngle ) - { - var dimen = 3; - var ctr = ctr_.slice(); - var startPt = startPt_.slice(); + // render the stroke + ctx.stroke(); + } + } +}; - // make sure the start point is good - var pt = this.vecSubtract(dimen, startPt, ctr); - var rad = this.vecMag(dimen, pt); +/////////////////////////////////////////////////////////////////////// +// this function returns the quadratic Bezier approximation to the specified +// circular arc. The input can be 2D or 3D, determined by the minimum dimension +// of the center and start point. +// includedAngle is in radians, can be positiveor negative +NinjaCvsRt.RuntimeOval.prototype.circularArcToBezier= function( ctr_, startPt_, includedAngle ) +{ + var dimen = 3; + var ctr = ctr_.slice(); + var startPt = startPt_.slice(); - if ((dimen != 3) || (rad <= 0) || (includedAngle === 0)) - { - if (dimen != 3) console.log( "circularArcToBezier works for 3 dimensional points only. Was " + dimen ); - return [ startPt.slice(0), startPt.slice(0), startPt.slice(0) ]; - } + // make sure the start point is good + var pt = this.vecSubtract(dimen, startPt, ctr); + var rad = this.vecMag(dimen, pt); - // determine the number of segments. 45 degree span maximum. - var nSegs = Math.ceil( Math.abs(includedAngle)/(0.25*Math.PI) ); - if (nSegs <= 0) return [ startPt.slice(0), startPt.slice(0), startPt.slice(0) ]; - var dAngle = includedAngle/nSegs; + if ((dimen != 3) || (rad <= 0) || (includedAngle === 0)) + { + if (dimen != 3) console.log( "circularArcToBezier works for 3 dimensional points only. Was " + dimen ); + return [ startPt.slice(0), startPt.slice(0), startPt.slice(0) ]; + } - // determine the length of the center control point from the circle center - var cs = Math.cos( 0.5*Math.abs(dAngle) ), sn = Math.sin( 0.5*Math.abs(dAngle) ); - var c = rad*sn; - var h = c*sn/cs; - var d = rad*cs + h; + // determine the number of segments. 45 degree span maximum. + var nSegs = Math.ceil( Math.abs(includedAngle)/(0.25*Math.PI) ); + if (nSegs <= 0) return [ startPt.slice(0), startPt.slice(0), startPt.slice(0) ]; + var dAngle = includedAngle/nSegs; - var rtnPts = [ this.vecAdd(dimen, pt, ctr) ]; - var rotMat = this.MatrixRotationZ( dAngle ); - for ( var i=0; i --- assets/canvas-runtime.js | 3088 +++++++++++++++++++++++----------------------- 1 file changed, 1558 insertions(+), 1530 deletions(-) (limited to 'assets') diff --git a/assets/canvas-runtime.js b/assets/canvas-runtime.js index 17f8cda8..eeafaab6 100644 --- a/assets/canvas-runtime.js +++ b/assets/canvas-runtime.js @@ -17,7 +17,7 @@ NinjaCvsRt.initWebGl = function (rootElement, directory) { } } //Creating data manager - cvsDataMngr = new NinjaCvsRt.CanvasDataManager(); + cvsDataMngr = Object.create(NinjaCvsRt.CanvasDataManager, {}); //Loading data to canvas(es) cvsDataMngr.loadGLData(rootElement, ninjaWebGlData.data, directory); }; @@ -26,1111 +26,1202 @@ NinjaCvsRt.initWebGl = function (rootElement, directory) { // Class ShapeRuntime // Manages runtime shape display /////////////////////////////////////////////////////////////////////// -NinjaCvsRt.CanvasDataManager = function () -{ - this.loadGLData = function(root, valueArray, assetPath ) - { - if (assetPath) - this._assetPath = assetPath.slice(); - - var value = valueArray; - var nWorlds = value.length; - for (var i=0; i