From 22cbc9644b79df60b3f6336f9563debd47fb3ea1 Mon Sep 17 00:00:00 2001 From: hwc487 Date: Thu, 28 Jun 2012 11:44:15 -0700 Subject: Added capability to split a mesh into multiiple parts to avoid buffer overflow situations. --- js/lib/rdge/materials/bump-metal-material.js | 14 ++++++- js/lib/rdge/materials/deform-material.js | 10 +++++ js/lib/rdge/materials/flag-material.js | 12 ++++++ js/lib/rdge/materials/fly-material.js | 10 +++++ js/lib/rdge/materials/julia-material.js | 9 ++++ js/lib/rdge/materials/keleidoscope-material.js | 10 +++++ js/lib/rdge/materials/linear-gradient-material.js | 19 +++++++++ js/lib/rdge/materials/mandel-material.js | 9 ++++ js/lib/rdge/materials/material.js | 14 ++++--- js/lib/rdge/materials/plasma-material.js | 12 ++++++ js/lib/rdge/materials/pulse-material.js | 12 ++++++ js/lib/rdge/materials/radial-blur-material.js | 10 +++++ js/lib/rdge/materials/radial-gradient-material.js | 50 ++++++++++++++++++++++- js/lib/rdge/materials/relief-tunnel-material.js | 10 +++++ js/lib/rdge/materials/square-tunnel-material.js | 10 +++++ js/lib/rdge/materials/star-material.js | 10 +++++ js/lib/rdge/materials/taper-material.js | 29 +++++++++++-- js/lib/rdge/materials/tunnel-material.js | 10 +++++ js/lib/rdge/materials/twist-material.js | 10 +++++ js/lib/rdge/materials/twist-vert-material.js | 14 +++++++ js/lib/rdge/materials/uber-material.js | 17 ++++++++ js/lib/rdge/materials/water-material.js | 13 ++++++ js/lib/rdge/materials/z-invert-material.js | 10 +++++ 23 files changed, 312 insertions(+), 12 deletions(-) (limited to 'js/lib/rdge') diff --git a/js/lib/rdge/materials/bump-metal-material.js b/js/lib/rdge/materials/bump-metal-material.js index 99a80da2..ea3322cf 100755 --- a/js/lib/rdge/materials/bump-metal-material.js +++ b/js/lib/rdge/materials/bump-metal-material.js @@ -20,6 +20,7 @@ var BumpMetalMaterial = function BumpMetalMaterial() { this._shaderName = "bumpMetal"; + this._defaultLightDiff = [0.3, 0.3, 0.3, 1.0]; this._defaultDiffuseTexture = "assets/images/metal.png"; this._defaultSpecularTexture = "assets/images/silver.png"; this._defaultNormalTexture = "assets/images/normalMap.png"; @@ -43,7 +44,7 @@ var BumpMetalMaterial = function BumpMetalMaterial() { this._propTypes = ["color", "file", "file", "file" ]; this._propValues = []; - this._propValues[ this._propNames[0] ] = [0.3, 0.3, 0.3, 1.0]; + this._propValues[ this._propNames[0] ] = this._defaultLightDiff; this._propValues[ this._propNames[1] ] = this._defaultDiffuseTexture.slice(0); this._propValues[ this._propNames[2] ] = this._defaultNormalTexture.slice(0); this._propValues[ this._propNames[3] ] = this._defaultSpecularTexture.slice(0); @@ -72,8 +73,19 @@ var BumpMetalMaterial = function BumpMetalMaterial() { this.setShaderValues(); this.update(0); }; + + this.resetToDefault = function() + { + this._propValues[ this._propNames[0] ] = this._defaultLightDiff; + this._propValues[ this._propNames[1] ] = this._defaultDiffuseTexture.slice(0); + this._propValues[ this._propNames[2] ] = this._defaultNormalTexture.slice(0); + this._propValues[ this._propNames[3] ] = this._defaultSpecularTexture.slice(0); + for (var i=0; i<4; i++) + this.setProperty( this._propNames[i], this._propValues[this._propNames[i]] ); + }; }; + /////////////////////////////////////////////////////////////////////////////////////// // RDGE shader diff --git a/js/lib/rdge/materials/deform-material.js b/js/lib/rdge/materials/deform-material.js index 4354408d..c2275b24 100644 --- a/js/lib/rdge/materials/deform-material.js +++ b/js/lib/rdge/materials/deform-material.js @@ -74,6 +74,16 @@ var DeformMaterial = function DeformMaterial() { this.setResolution([world.getViewportWidth(), world.getViewportHeight()]); this.update(0); }; + + this.resetToDefault = function() + { + this._propValues[this._propNames[0]] = this._defaultTexMap.slice(0); + this._propValues[this._propNames[1]] = 1.0; + + var nProps = this._propNames.length; + for (var i=0; i bounds[3]) bounds[3] = b2[3]; + if (b2[4] > bounds[4]) bounds[4] = b2[4]; + if (b2[5] > bounds[5]) bounds[5] = b2[5]; + } + + this.fitToBounds( bounds ); + }; + + this.fitToPrimitive = function( prim ) + { + var bounds = ShapePrimitive.getBounds( prim ); + this.fitToBounds( bounds ); }; this.customExport = function( jObj ) diff --git a/js/lib/rdge/materials/relief-tunnel-material.js b/js/lib/rdge/materials/relief-tunnel-material.js index ab6b142e..a97fdb6d 100644 --- a/js/lib/rdge/materials/relief-tunnel-material.js +++ b/js/lib/rdge/materials/relief-tunnel-material.js @@ -67,6 +67,16 @@ var ReliefTunnelMaterial = function ReliefTunnelMaterial() this.setResolution([world.getViewportWidth(), world.getViewportHeight()]); this.update(0); }; + + this.resetToDefault = function() + { + this._propValues[this._propNames[u_tex0_index]] = this._defaultTexMap.slice(0); + this._propValues[this._propNames[u_speed_index]] = 1.0; + + var nProps = this._propNames.length; + for (var i=0; i */ -var MaterialParser = require("js/lib/rdge/materials/material-parser").MaterialParser; -var Material = require("js/lib/rdge/materials/material").Material; -var GLWorld = require("js/lib/drawing/world").World; -var Texture = require("js/lib/rdge/texture").Texture; -var ElementMediator = require("js/mediators/element-mediator").ElementMediator; -var TagTool = require("js/tools/TagTool").TagTool; +var MaterialParser = require("js/lib/rdge/materials/material-parser").MaterialParser; +var Material = require("js/lib/rdge/materials/material").Material; +var GLWorld = require("js/lib/drawing/world").World; +var Texture = require("js/lib/rdge/texture").Texture; +var ElementMediator = require("js/mediators/element-mediator").ElementMediator; +var TagTool = require("js/tools/TagTool").TagTool; /////////////////////////////////////////////////////////////////////// // Class GLMaterial @@ -47,33 +47,33 @@ var CloudMaterial = function CloudMaterial() this._name = "Cloud"; this._shaderName = "cloud"; - this._texMap = 'assets/images/cloud10.png'; + this._texMap = 'assets/images/cloud10.png'; this._texMap = 'assets/images/cloud2.jpg'; - //this._texMap = 'assets/images/CL13.png'; - //this._texMap = 'assets/images/material_paint.png'; - //this._texMap = 'assets/images/us_flag.png'; - //this._texMap = 'assets/images/cubelight.png'; + //this._texMap = 'assets/images/CL13.png'; + //this._texMap = 'assets/images/material_paint.png'; + //this._texMap = 'assets/images/us_flag.png'; + //this._texMap = 'assets/images/cubelight.png'; this._diffuseColor = [0.5, 0.5, 0.5, 0.5]; - // base size of cloud polygons. Random adjustments made to each quad - this._cloudSize = 40; + // base size of cloud polygons. Random adjustments made to each quad + this._cloudSize = 40; this._time = 0.0; this._dTime = 0.01; - // parameter initial values - this._time = 0.0; - this._surfaceAlpha = 0.5; -// this._zmin = 2.0; -// this._zmax = 5.0; - this._zmin = 5.0; - this._zmax = 10.0; + // parameter initial values + this._time = 0.0; + this._surfaceAlpha = 0.5; +// this._zmin = 2.0; +// this._zmax = 5.0; + this._zmin = 5.0; + this._zmax = 10.0; - // the adjusted zMin and zMax values are - // what get sent to the shader. They are initialized - // in buildGeometry - this._adjustedZMin = this._zmin; - this._adjustedZMax = this._zmax; + // the adjusted zMin and zMax values are + // what get sent to the shader. They are initialized + // in buildGeometry + this._adjustedZMin = this._zmin; + this._adjustedZMax = this._zmax; @@ -132,68 +132,68 @@ var CloudMaterial = function CloudMaterial() /**************************************************************/ this.init = function (world) { - var GLWorld = require("js/lib/drawing/world").World, - NJUtils = require("js/lib/NJUtils").NJUtils; - - // save the world - if (world) this.setWorld( world ); - var dstWorld = world; - - // create a canvas to render into - var dstCanvas = this.getWorld().getCanvas(); - var doc = this.getWorld().getCanvas().ownerDocument; - var canvasID = "__canvas__"; - //this._srcCanvas = doc.createElement(canvasID); - this._srcCanvas = NJUtils.makeNJElement("canvas", canvasID, "shape", {"data-RDGE-id": NJUtils.generateRandom()}, true); - srcCanvas = this._srcCanvas; - srcCanvas.width = dstCanvas.width; - srcCanvas.height = dstCanvas.height; - - ////////////////////////////////////////////////////////////////////////////////// - // IS THIS NECESSARY?? + var GLWorld = require("js/lib/drawing/world").World, + NJUtils = require("js/lib/NJUtils").NJUtils; + + // save the world + if (world) this.setWorld( world ); + var dstWorld = world; + + // create a canvas to render into + var dstCanvas = this.getWorld().getCanvas(); + var doc = this.getWorld().getCanvas().ownerDocument; + var canvasID = "__canvas__"; + //this._srcCanvas = doc.createElement(canvasID); + this._srcCanvas = NJUtils.makeNJElement("canvas", canvasID, "shape", {"data-RDGE-id": NJUtils.generateRandom()}, true); + srcCanvas = this._srcCanvas; + srcCanvas.width = dstCanvas.width; + srcCanvas.height = dstCanvas.height; + + ////////////////////////////////////////////////////////////////////////////////// + // IS THIS NECESSARY?? // var elementModel = TagTool.makeElement(~~srcCanvas.width, ~~srcCanvas.height, // Matrix.I(4), [0,0,0], srcCanvas); // ElementMediator.addElement(srcCanvas, elementModel.data, true); - ////////////////////////////////////////////////////////////////////////////////// + ////////////////////////////////////////////////////////////////////////////////// - // build the source. - // the source being the world/canvas/geometry of the clouds. - // the source is used to create a texture map that is then used by - // the destimation. - this.buildSource(); + // build the source. + // the source being the world/canvas/geometry of the clouds. + // the source is used to create a texture map that is then used by + // the destimation. + this.buildSource(); - // set up the shader - this._shader = new RDGE.jshader(); - this._shader.def = cloudMapMaterialDef; - this._shader.init(); + // set up the shader + this._shader = new RDGE.jshader(); + this._shader.def = cloudMapMaterialDef; + this._shader.init(); - // set up the material node - this._materialNode = RDGE.createMaterialNode("cloudMapMaterial" + "_" + world.generateUniqueNodeID()); - this._materialNode.setShader(this._shader); + // set up the material node + this._materialNode = RDGE.createMaterialNode("cloudMapMaterial" + "_" + world.generateUniqueNodeID()); + this._materialNode.setShader(this._shader); - // initialize the time - this._time = 0; + // initialize the time + this._time = 0; - // create the texture to map the source cloud generation world/canvas to the destination - var wrap = 'REPEAT', mips = true; - this._glTex = new Texture( world, this._srcCanvas, wrap, mips ); + // create the texture to map the source cloud generation world/canvas to the destination + var wrap = 'REPEAT', mips = true; + this._glTex = new Texture( world, this._srcCanvas, wrap, mips ); - // set the shader values in the shader - this.updateTexture(); - this.update( 0 ); + // set the shader values in the shader + this.updateTexture(); + this.update( 0 ); }; - /**************************************************************/ + /**************************************************************/ this.updateTexture = function () - { + { var material = this._materialNode; if (material) - { + { var technique = material.shaderProgram['default']; var saveContext = RDGE.globals.engine.getContext(); - var renderer = RDGE.globals.engine.getContext().renderer; + var renderer = RDGE.globals.engine.getContext().renderer; if (renderer && technique) - { + { var texMapName = this._propValues[this._propNames[0]]; var wrap = 'REPEAT', mips = true; if (this._glTex) @@ -201,236 +201,236 @@ var CloudMaterial = function CloudMaterial() this._glTex.render(); var tex = this._glTex.getTexture(); - if (tex) - technique.u_tex0.set( tex ); + if (tex) + technique.u_tex0.set( tex ); + } + } + + // restore the context + RDGE.globals.engine.setContext( saveContext.id ); + } + }; + + this.updateColor = function() + { + } + + this.update = function( time ) + { + if (this._srcWorld) + { + //this._srcWorld.update(); + this._srcWorld.draw(); + RDGE.globals.engine.setContext( this.getWorld()._canvas.rdgeid ); + } + + var technique, renderer, tex; + + // update the cloud map material + var material = this._materialNode; + if (material) + { + technique = material.shaderProgram['default']; + renderer = RDGE.globals.engine.getContext().renderer; + if (renderer && technique) + { + if (this._glTex) + { + this._glTex.render(); + tex = this._glTex.getTexture(); + technique.u_tex0.set( tex ); } } + } - // restore the context - RDGE.globals.engine.setContext( saveContext.id ); + // update the source material + material = this._srcMaterialNode; + if (material) + { + technique = material.shaderProgram['default']; + renderer = RDGE.globals.engine.getContext().renderer; + if (renderer && technique) + { + technique.u_time.set( [this._time] ); + this._time += this._dTime; + } } }; - this.updateColor = function() - { - } - - this.update = function( time ) - { - if (this._srcWorld) - { - //this._srcWorld.update(); - this._srcWorld.draw(); - RDGE.globals.engine.setContext( this.getWorld()._canvas.rdgeid ); - } - - var technique, renderer, tex; - - // update the cloud map material - var material = this._materialNode; - if (material) - { - technique = material.shaderProgram['default']; - renderer = RDGE.globals.engine.getContext().renderer; - if (renderer && technique) - { - if (this._glTex) - { - this._glTex.render(); - tex = this._glTex.getTexture(); - technique.u_tex0.set( tex ); - } - } - } - - // update the source material - material = this._srcMaterialNode; - if (material) - { - technique = material.shaderProgram['default']; - renderer = RDGE.globals.engine.getContext().renderer; - if (renderer && technique) - { - technique.u_time.set( [this._time] ); - this._time += this._dTime; - } - } - }; - - this.buildSource = function() - { - // save the current RDGE context so we can reset it later - var saveContext = RDGE.globals.engine.getContext(); - this.getWorld().stop(); - - // build a world to do the rendering - if (!GLWorld) GLWorld = require("js/lib/drawing/world").World; - this._srcWorld = new GLWorld( this._srcCanvas, true, true ); - var srcWorld = this._srcWorld; - if (!this._srcCanvas) throw new Error( "No source canvas in Cloud material" ); - this._srcCanvas.__GLWorld = srcWorld; - - // build the geometry - var prim = this.buildGeometry( srcWorld, srcCanvas.width, srcCanvas.height ); - - // set up the shader - var shader = new RDGE.jshader(); - shader.def = cloudMaterialDef; - shader.init(); - this._srcShader = shader; - - // set up the material node - var materialNode = RDGE.createMaterialNode("cloudMaterial" + "_" + srcWorld.generateUniqueNodeID()); - materialNode.setShader(shader); - this._srcMaterialNode = materialNode; - - // add the nodes to the tree - var trNode = RDGE.createTransformNode("objRootNode_" + srcWorld._nodeCounter++); - srcWorld._rootNode.insertAsChild( trNode ); - trNode.attachMeshNode(srcWorld.renderer.id + "_prim_" + srcWorld._nodeCounter++, prim); + this.buildSource = function() + { + // save the current RDGE context so we can reset it later + var saveContext = RDGE.globals.engine.getContext(); + this.getWorld().stop(); + + // build a world to do the rendering + if (!GLWorld) GLWorld = require("js/lib/drawing/world").World; + this._srcWorld = new GLWorld( this._srcCanvas, true, true ); + var srcWorld = this._srcWorld; + if (!this._srcCanvas) throw new Error( "No source canvas in Cloud material" ); + this._srcCanvas.__GLWorld = srcWorld; + + // build the geometry + var prim = this.buildGeometry( srcWorld, srcCanvas.width, srcCanvas.height ); + + // set up the shader + var shader = new RDGE.jshader(); + shader.def = cloudMaterialDef; + shader.init(); + this._srcShader = shader; + + // set up the material node + var materialNode = RDGE.createMaterialNode("cloudMaterial" + "_" + srcWorld.generateUniqueNodeID()); + materialNode.setShader(shader); + this._srcMaterialNode = materialNode; + + // add the nodes to the tree + var trNode = RDGE.createTransformNode("objRootNode_" + srcWorld._nodeCounter++); + srcWorld._rootNode.insertAsChild( trNode ); + trNode.attachMeshNode(srcWorld.renderer.id + "_prim_" + srcWorld._nodeCounter++, prim); trNode.attachMaterial( materialNode ); - // initialize the shader uniforms - this._time = 0; - if (shader['default']) { - var t = shader['default']; - if (t) - { - t.u_time.set( [this._time] ); - t.u_surfaceAlpha.set( [this._surfaceAlpha] ); - t.u_zmin.set( [this._adjustedZMin] ); - t.u_zmax.set( [this._adjustedZMax] ); - - var wrap = 'REPEAT', mips = true; - var texMapName = this._propValues[this._propNames[0]]; - var tex = srcWorld.renderer.getTextureByName(texMapName, wrap, mips ); - if (tex) - { - srcWorld.textureToLoad( tex ); - t.u_tex0.set( tex ); - } + // initialize the shader uniforms + this._time = 0; + if (shader['default']) { + var t = shader['default']; + if (t) + { + t.u_time.set( [this._time] ); + t.u_surfaceAlpha.set( [this._surfaceAlpha] ); + t.u_zmin.set( [this._adjustedZMin] ); + t.u_zmax.set( [this._adjustedZMax] ); + + var wrap = 'REPEAT', mips = true; + var texMapName = this._propValues[this._propNames[0]]; + var tex = srcWorld.renderer.getTextureByName(texMapName, wrap, mips ); + if (tex) + { + srcWorld.textureToLoad( tex ); + t.u_tex0.set( tex ); + } } } - // start the render loop on the source canvas - srcWorld.restartRenderLoop(); - - // restore the original context - RDGE.globals.engine.setContext( saveContext.id ); - this.getWorld().start(); - }; - - this.buildGeometry = function(world, canvasWidth, canvasHeight) - { - var RectangleGeometry = require("js/lib/geom/rectangle").RectangleGeometry; - RectangleGeometry.init(); - - // get the normalized device coordinates (NDC) for - // all position and dimensions. - var vpw = world.getViewportWidth(), vph = world.getViewportHeight(); - var xNDC = 0.0/vpw, yNDC = 0.0/vph, - xFillNDC = canvasWidth/vpw, yFillNDC = canvasHeight/vph; - - var aspect = world.getAspect(); - var zn = world.getZNear(), zf = world.getZFar(); - var t = zn * Math.tan(world.getFOV() * Math.PI / 360.0), - b = -t, - r = aspect*t, - l = -r; - - // calculate the object coordinates from their NDC coordinates - var z = -world.getViewDistance(); - - // get the position of the origin - var x = -z*(r-l)/(2.0*zn)*xNDC, - y = -z*(t-b)/(2.0*zn)*yNDC; - - // get the x and y fill - var hWidth = -z*(r-l)/(2.0*zn)*xFillNDC, - hHeight = -z*(t-b)/(2.0*zn)*yFillNDC; - - - //this.createFill([x,y], 2*xFill, 2*yFill, tlRadius, blRadius, brRadius, trRadius, fillMaterial); - var ctr = [x,y], width = 2*hWidth, height = 2*hHeight; - var cloudSize = width > height ? 0.25*width : 0.25*height; - var left = x - hHeight, - top = y - hHeight; - - // get the GL projection matrix so wecan calculate the z values from the user input z values - var zNear = world.getZNear(), zFar = world.getZFar(); - var viewDist = world.getViewDistance(); - var projMat = Matrix.makePerspective( world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); - var camMat = world.getCameraMat(); - var camMatInv = glmat4.inverse( camMat, [] ); - var glCompleteMat = glmat4.multiply( projMat, camMatInv, [] ); - var zw1_c = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -zNear + viewDist], glCompleteMat )[2], - zw2_c = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -zFar + viewDist], glCompleteMat )[2]; - var glCompleteMatInv = glmat4.inverse( glCompleteMat, [] ); - var zMin = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -this._zmin + viewDist], glCompleteMat )[2], - zMax = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -this._zmax + viewDist], glCompleteMat )[2]; - - zMax = -this._zmin + viewDist; - zMin = -this._zmax + viewDist; - dz = zMax - zMin; - - // the adjusted values are what get sent to the shader - this._adjustedZMin = zMin; - this._adjustedZMax = zMax; - - - // build the polygons - var verts = [], - normals = [ [0,0,1], [0,0,1], [0,0,1], [0,0,1] ], - uvs = [ [0,0], [1,0], [1,1], [0,1] ]; - - for ( i = 0; i < 20; i++ ) - { -// var x = hWidth*2*(Math.random() - 0.5), -// y = hHeight*2.0*(Math.random() - 0.5), - var x = left + Math.random()*width, - y = top + Math.random()*height, - z = zMin + Math.random()*dz; - zRot = (Math.random() - 0.5) * Math.PI, - sz = cloudSize * Math.random(); - - //x = 0.0; y = 0.0; z = 0.0; - //zRot = 0.0; - //z = 0; - - verts[0] = [-sz, -sz, 0]; - verts[1] = [-sz, sz, 0]; - verts[2] = [ sz, sz, 0]; - verts[3] = [ sz, -sz, 0]; - - var rotMat = Matrix.RotationZ( zRot ); - var transMat = Matrix.Translation( [x,y,z] ); - var mat = glmat4.multiply( transMat, rotMat, [] ); - - glmat4.multiplyVec3( mat, verts[0] ); - glmat4.multiplyVec3( mat, verts[1] ); - glmat4.multiplyVec3( mat, verts[2] ); - glmat4.multiplyVec3( mat, verts[3] ); - - var tmp0 = MathUtils.transformAndDivideHomogeneousPoint( verts[0], glCompleteMat ), - tmp1 = MathUtils.transformAndDivideHomogeneousPoint( verts[1], glCompleteMat ), - tmp2 = MathUtils.transformAndDivideHomogeneousPoint( verts[2], glCompleteMat ), - tmp3 = MathUtils.transformAndDivideHomogeneousPoint( verts[3], glCompleteMat ); - - RectangleGeometry.addQuad( verts, normals, uvs ); - } - - return RectangleGeometry.buildPrimitive(); + // start the render loop on the source canvas + srcWorld.restartRenderLoop(); + + // restore the original context + RDGE.globals.engine.setContext( saveContext.id ); + this.getWorld().start(); + }; + + this.buildGeometry = function(world, canvasWidth, canvasHeight) + { + var RectangleGeometry = require("js/lib/geom/rectangle").RectangleGeometry; + RectangleGeometry.init(); + + // get the normalized device coordinates (NDC) for + // all position and dimensions. + var vpw = world.getViewportWidth(), vph = world.getViewportHeight(); + var xNDC = 0.0/vpw, yNDC = 0.0/vph, + xFillNDC = canvasWidth/vpw, yFillNDC = canvasHeight/vph; + + var aspect = world.getAspect(); + var zn = world.getZNear(), zf = world.getZFar(); + var t = zn * Math.tan(world.getFOV() * Math.PI / 360.0), + b = -t, + r = aspect*t, + l = -r; + + // calculate the object coordinates from their NDC coordinates + var z = -world.getViewDistance(); + + // get the position of the origin + var x = -z*(r-l)/(2.0*zn)*xNDC, + y = -z*(t-b)/(2.0*zn)*yNDC; + + // get the x and y fill + var hWidth = -z*(r-l)/(2.0*zn)*xFillNDC, + hHeight = -z*(t-b)/(2.0*zn)*yFillNDC; + + + //this.createFill([x,y], 2*xFill, 2*yFill, tlRadius, blRadius, brRadius, trRadius, fillMaterial); + var ctr = [x,y], width = 2*hWidth, height = 2*hHeight; + var cloudSize = width > height ? 0.25*width : 0.25*height; + var left = x - hHeight, + top = y - hHeight; + + // get the GL projection matrix so wecan calculate the z values from the user input z values + var zNear = world.getZNear(), zFar = world.getZFar(); + var viewDist = world.getViewDistance(); + var projMat = Matrix.makePerspective( world.getFOV(), world.getAspect(), world.getZNear(), world.getZFar()); + var camMat = world.getCameraMat(); + var camMatInv = glmat4.inverse( camMat, [] ); + var glCompleteMat = glmat4.multiply( projMat, camMatInv, [] ); + var zw1_c = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -zNear + viewDist], glCompleteMat )[2], + zw2_c = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -zFar + viewDist], glCompleteMat )[2]; + var glCompleteMatInv = glmat4.inverse( glCompleteMat, [] ); + var zMin = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -this._zmin + viewDist], glCompleteMat )[2], + zMax = MathUtils.transformAndDivideHomogeneousPoint( [0,0, -this._zmax + viewDist], glCompleteMat )[2]; + + zMax = -this._zmin + viewDist; + zMin = -this._zmax + viewDist; + dz = zMax - zMin; + + // the adjusted values are what get sent to the shader + this._adjustedZMin = zMin; + this._adjustedZMax = zMax; + + + // build the polygons + var verts = [], + normals = [ [0,0,1], [0,0,1], [0,0,1], [0,0,1] ], + uvs = [ [0,0], [1,0], [1,1], [0,1] ]; + + for ( i = 0; i < 20; i++ ) + { +// var x = hWidth*2*(Math.random() - 0.5), +// y = hHeight*2.0*(Math.random() - 0.5), + var x = left + Math.random()*width, + y = top + Math.random()*height, + z = zMin + Math.random()*dz; + zRot = (Math.random() - 0.5) * Math.PI, + sz = cloudSize * Math.random(); + + //x = 0.0; y = 0.0; z = 0.0; + //zRot = 0.0; + //z = 0; + + verts[0] = [-sz, -sz, 0]; + verts[1] = [-sz, sz, 0]; + verts[2] = [ sz, sz, 0]; + verts[3] = [ sz, -sz, 0]; + + var rotMat = Matrix.RotationZ( zRot ); + var transMat = Matrix.Translation( [x,y,z] ); + var mat = glmat4.multiply( transMat, rotMat, [] ); + + glmat4.multiplyVec3( mat, verts[0] ); + glmat4.multiplyVec3( mat, verts[1] ); + glmat4.multiplyVec3( mat, verts[2] ); + glmat4.multiplyVec3( mat, verts[3] ); + + var tmp0 = MathUtils.transformAndDivideHomogeneousPoint( verts[0], glCompleteMat ), + tmp1 = MathUtils.transformAndDivideHomogeneousPoint( verts[1], glCompleteMat ), + tmp2 = MathUtils.transformAndDivideHomogeneousPoint( verts[2], glCompleteMat ), + tmp3 = MathUtils.transformAndDivideHomogeneousPoint( verts[3], glCompleteMat ); + + RectangleGeometry.addQuad( verts, normals, uvs ); + } + + return RectangleGeometry.buildPrimitive(); }; // JSON export this.exportJSON = function () { var jObj = - { - 'material': this.getShaderName(), - 'name': this.getName(), - 'texture': this._propValues[this._propNames[0]] - }; + { + 'material': this.getShaderName(), + 'name': this.getName(), + 'texture': this._propValues[this._propNames[0]] + }; return jObj; }; @@ -458,82 +458,82 @@ var CloudMaterial = function CloudMaterial() // local world created by the cloud material. var cloudMaterialDef = { 'shaders': - { - 'defaultVShader': "assets/shaders/Cloud.vert.glsl", - 'defaultFShader': "assets/shaders/Cloud.frag.glsl" - }, + { + 'defaultVShader': "assets/shaders/Cloud.vert.glsl", + 'defaultFShader': "assets/shaders/Cloud.frag.glsl" + }, 'techniques': - { - 'default': - [ - { - 'vshader': 'defaultVShader', - 'fshader': 'defaultFShader', - // attributes - 'attributes': - { - 'vert': { 'type': 'vec3' }, - 'normal': { 'type': 'vec3' }, - 'texcoord': { 'type': 'vec2' } - }, - // parameters - 'params': - { - 'u_tex0' : { 'type' : 'tex2d' }, - 'u_time' : { 'type' : 'float' }, - 'u_surfaceAlpha' : { 'type' : 'float' }, - 'u_zmin' : { 'type' : 'float' }, - 'u_zmax' : { 'type' : 'float' } - }, - - // render states - 'states': - { - 'depthEnable': true, - 'offset': [1.0, 0.1] - } - } - ] - } + { + 'default': + [ + { + 'vshader': 'defaultVShader', + 'fshader': 'defaultFShader', + // attributes + 'attributes': + { + 'vert': { 'type': 'vec3' }, + 'normal': { 'type': 'vec3' }, + 'texcoord': { 'type': 'vec2' } + }, + // parameters + 'params': + { + 'u_tex0' : { 'type' : 'tex2d' }, + 'u_time' : { 'type' : 'float' }, + 'u_surfaceAlpha' : { 'type' : 'float' }, + 'u_zmin' : { 'type' : 'float' }, + 'u_zmax' : { 'type' : 'float' } + }, + + // render states + 'states': + { + 'depthEnable': true, + 'offset': [1.0, 0.1] + } + } + ] + } }; // the cloud map material def is used to map the cloud image onto // the destination geometry var cloudMapMaterialDef = {'shaders': - { - 'defaultVShader':"assets/shaders/Basic.vert.glsl", - 'defaultFShader':"ass