From 86a801c057fc3b0580d6130be5740c2ee503444f Mon Sep 17 00:00:00 2001 From: hwc487 Date: Fri, 27 Jan 2012 15:52:36 -0800 Subject: updated from old repo --- assets/shaders/Julia.frag.glsl | 25 +++ assets/shaders/Keleidoscope.frag.glsl | 25 +++ assets/shaders/Mandel.frag.glsl | 55 ++++++ assets/shaders/Pulse.frag.glsl | 22 +++ assets/shaders/Tunnel.frag.glsl | 23 +++ assets/shaders/Twist.frag.glsl | 23 +++ assets/shaders/plasma.frag.glsl | 32 ++++ assets/shaders/plasma.vert.glsl | 42 ++++ assets/shaders/radialBlur.frag.glsl | 47 +++++ assets/shaders/radialGradient.frag.glsl | 51 +++++ assets/shaders/radialGradient.vert.glsl | 28 +++ assets/shaders/test_fshader.glsl | 25 ++- js/controllers/elements/canvas-controller.js | 8 - js/helper-classes/RDGE/GLCircle.js | 10 +- js/helper-classes/RDGE/GLGeomObj.js | 3 + js/helper-classes/RDGE/GLMaterial.js | 29 +++ js/helper-classes/RDGE/GLRectangle.js | 17 +- js/helper-classes/RDGE/GLWorld.js | 211 ++++++++++++++++++--- .../RDGE/Materials/BumpMetalMaterial.js | 66 +++++-- js/helper-classes/RDGE/Materials/FlatMaterial.js | 2 + .../RDGE/Materials/IridescentScalesMaterial.js | 5 +- js/helper-classes/RDGE/Materials/JuliaMaterial.js | 3 + .../RDGE/Materials/KeleidoscopeMaterial.js | 3 + .../RDGE/Materials/LinearGradientMaterial.js | 4 + js/helper-classes/RDGE/Materials/MandelMaterial.js | 4 + js/helper-classes/RDGE/Materials/PulseMaterial.js | 15 +- .../RDGE/Materials/RadialBlurMaterial.js | 3 + .../RDGE/Materials/RadialGradientMaterial.js | 188 ++++++++++-------- js/helper-classes/RDGE/Materials/TunnelMaterial.js | 3 + js/helper-classes/RDGE/Materials/TwistMaterial.js | 3 + js/helper-classes/RDGE/Materials/UberMaterial.js | 25 ++- js/helper-classes/RDGE/MaterialsLibrary.js | 40 ++-- js/helper-classes/RDGE/rdge-compiled.js | 102 +++++----- .../RDGE/src/core/script/init_state.js | 7 +- js/helper-classes/RDGE/src/core/script/renderer.js | 14 +- .../RDGE/src/core/script/run_state.js | 10 +- js/helper-classes/RDGE/src/core/script/runtime.js | 2 +- js/panels/Materials/Materials.xml | 10 + js/preloader/Preloader.js | 1 - js/tools/PanTool.js | 29 ++- 40 files changed, 960 insertions(+), 255 deletions(-) create mode 100644 assets/shaders/Julia.frag.glsl create mode 100644 assets/shaders/Keleidoscope.frag.glsl create mode 100644 assets/shaders/Mandel.frag.glsl create mode 100644 assets/shaders/Pulse.frag.glsl create mode 100644 assets/shaders/Tunnel.frag.glsl create mode 100644 assets/shaders/Twist.frag.glsl create mode 100644 assets/shaders/plasma.frag.glsl create mode 100644 assets/shaders/plasma.vert.glsl create mode 100644 assets/shaders/radialBlur.frag.glsl create mode 100644 assets/shaders/radialGradient.frag.glsl create mode 100644 assets/shaders/radialGradient.vert.glsl diff --git a/assets/shaders/Julia.frag.glsl b/assets/shaders/Julia.frag.glsl new file mode 100644 index 00000000..68cda703 --- /dev/null +++ b/assets/shaders/Julia.frag.glsl @@ -0,0 +1,25 @@ +#ifdef GL_ES +precision highp float; +#endif + +uniform vec2 u_resolution; +uniform float u_time; + +void main(void) +{ + vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy; + vec2 cc = vec2( cos(.25*u_time), sin(.25*u_time*1.423) ); + + float dmin = 1000.0; + vec2 z = p*vec2(1.33,1.0); + for( int i=0; i<64; i++ ) + { + z = cc + vec2( z.x*z.x - z.y*z.y, 2.0*z.x*z.y ); + float m2 = dot(z,z); + if( m2>100.0 ) break; + dmin=min(dmin,m2); + } + + float color = sqrt(sqrt(dmin))*0.7; + gl_FragColor = vec4(color,color,color,1.0); +} \ No newline at end of file diff --git a/assets/shaders/Keleidoscope.frag.glsl b/assets/shaders/Keleidoscope.frag.glsl new file mode 100644 index 00000000..7d1bdb17 --- /dev/null +++ b/assets/shaders/Keleidoscope.frag.glsl @@ -0,0 +1,25 @@ +#ifdef GL_ES +precision highp float; +#endif + +uniform vec2 u_resolution; +uniform float u_time; +uniform sampler2D u_tex0; + +void main(void) +{ + vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy; + vec2 uv; + + float a = atan(p.y,p.x); + float r = sqrt(dot(p,p)); + + uv.x = 7.0*a/3.1416; + uv.y = -u_time+ sin(7.0*r+u_time) + .7*cos(u_time+7.0*a); + + float w = .5+.5*(sin(u_time+7.0*r)+ .7*cos(u_time+7.0*a)); + + vec3 col = texture2D(u_tex0,uv*.5).xyz; + + gl_FragColor = vec4(col*w,1.0); +} \ No newline at end of file diff --git a/assets/shaders/Mandel.frag.glsl b/assets/shaders/Mandel.frag.glsl new file mode 100644 index 00000000..6465899d --- /dev/null +++ b/assets/shaders/Mandel.frag.glsl @@ -0,0 +1,55 @@ +#ifdef GL_ES +precision highp float; +#endif + +uniform vec2 u_resolution; +uniform float u_time; + +void main(void) +{ + vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy; + p.x *= u_resolution.x/u_resolution.y; + + float zoo = .62+.38*sin(.1*u_time); + float coa = cos( 0.1*(1.0-zoo)*u_time ); + float sia = sin( 0.1*(1.0-zoo)*u_time ); + zoo = pow( zoo,8.0); + vec2 xy = vec2( p.x*coa-p.y*sia, p.x*sia+p.y*coa); + vec2 cc = vec2(-.745,.186) + xy*zoo; + + vec2 z = vec2(0.0); + vec2 z2 = z*z; + float m2; + float co = 0.0; + + + // chrome/angelproject/nvidia/glslES don't seem to like to "break" a loop... + // so we have to rewrite it in another way +/* + for( int i=0; i<256; i++ ) + { + z = cc + vec2( z.x*z.x - z.y*z.y, 2.0*z.x*z.y ); + m2 = dot(z,z); + if( m2>1024.0 ) break; + co += 1.0; + } +*/ + + for( int i=0; i<256; i++ ) + { + if( m2<1024.0 ) + { + z = cc + vec2( z.x*z.x - z.y*z.y, 2.0*z.x*z.y ); + m2 = dot(z,z); + co += 1.0; + } + } + + co = co + 1.0 - log2(.5*log2(m2)); + + co = sqrt(co/256.0); + gl_FragColor = vec4( .5+.5*cos(6.2831*co+0.0), + .5+.5*cos(6.2831*co+0.4), + .5+.5*cos(6.2831*co+0.7), + 1.0 ); +} \ No newline at end of file diff --git a/assets/shaders/Pulse.frag.glsl b/assets/shaders/Pulse.frag.glsl new file mode 100644 index 00000000..b24c9bef --- /dev/null +++ b/assets/shaders/Pulse.frag.glsl @@ -0,0 +1,22 @@ +#ifdef GL_ES +precision highp float; +#endif + +uniform float u_time; +uniform vec2 u_resolution; +uniform sampler2D u_tex0; + +void main(void) +{ + vec2 halfres = u_resolution.xy/2.0; + vec2 cPos = gl_FragCoord.xy; + + cPos.x -= 0.5*halfres.x*sin(u_time/2.0)+0.3*halfres.x*cos(u_time)+halfres.x; + cPos.y -= 0.4*halfres.y*sin(u_time/5.0)+0.3*halfres.y*cos(u_time)+halfres.y; + float cLength = length(cPos); + + vec2 uv = gl_FragCoord.xy/u_resolution.xy+(cPos/cLength)*sin(cLength/30.0-u_time*10.0)/25.0; + vec3 col = texture2D(u_tex0,uv).xyz*50.0/cLength; + + gl_FragColor = vec4(col,1.0); +} \ No newline at end of file diff --git a/assets/shaders/Tunnel.frag.glsl b/assets/shaders/Tunnel.frag.glsl new file mode 100644 index 00000000..9deb52fb --- /dev/null +++ b/assets/shaders/Tunnel.frag.glsl @@ -0,0 +1,23 @@ +#ifdef GL_ES +precision highp float; +#endif + +uniform vec2 u_resolution; +uniform float u_time; +uniform sampler2D u_tex0; + +void main(void) +{ + vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy; + vec2 uv; + + float a = atan(p.y,p.x); + float r = sqrt(dot(p,p)); + + uv.x = .75*u_time+.1/r; + uv.y = a/3.1416; + + vec3 col = texture2D(u_tex0,uv).xyz; + + gl_FragColor = vec4(col*r,1.0); +} \ No newline at end of file diff --git a/assets/shaders/Twist.frag.glsl b/assets/shaders/Twist.frag.glsl new file mode 100644 index 00000000..b7477747 --- /dev/null +++ b/assets/shaders/Twist.frag.glsl @@ -0,0 +1,23 @@ +#ifdef GL_ES +precision highp float; +#endif + +uniform vec2 u_resolution; +uniform float u_time; +uniform sampler2D u_tex0; + +void main(void) +{ + vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy; + vec2 uv; + + float a = atan(p.y,p.x); + float r = sqrt(dot(p,p)); + + uv.x = r - .25*u_time; + uv.y = cos(a*5.0 + 2.0*sin(u_time+7.0*r)) ; + + vec3 col = (.5+.5*uv.y)*texture2D(u_tex0,uv).xyz; + + gl_FragColor = vec4(col,1.0); +} \ No newline at end of file diff --git a/assets/shaders/plasma.frag.glsl b/assets/shaders/plasma.frag.glsl new file mode 100644 index 00000000..2ab8f49c --- /dev/null +++ b/assets/shaders/plasma.frag.glsl @@ -0,0 +1,32 @@ +// +// Fragment shader for procedural bricks +// +// Authors: Dave Baldwin, Steve Koren, Randi Rost +// based on a shader by Darwyn Peachey +// +// Copyright (c) 2002-2006 3Dlabs Inc. Ltd. +// +// See 3Dlabs-License.txt for license information +// + +#ifdef GL_ES +precision highp float; +#endif + + +varying vec2 v_uv; +uniform float u_time; +uniform vec4 color; + +void main(void) +{ + float x = v_uv.x ; + float y = v_uv.y ; + float time = color.x; + float wave = (cos(time + y / 0.2 + cos(x / 0.3 + cos((y / 0.1))))); + float wave1 = (sin(abs(wave + y/0.6))); + float wave2 = (sin(abs(wave1 + y/0.8))); + float tmp = u_time * 0.1; + gl_FragColor = vec4( abs(vec3(wave2,wave1,wave)),1.0); + //gl_FragColor = color; +} diff --git a/assets/shaders/plasma.vert.glsl b/assets/shaders/plasma.vert.glsl new file mode 100644 index 00000000..f817c143 --- /dev/null +++ b/assets/shaders/plasma.vert.glsl @@ -0,0 +1,42 @@ +// +// Vertex shader for procedural bricks +// +// Authors: Dave Baldwin, Steve Koren, Randi Rost +// based on a shader by Darwyn Peachey +// +// Copyright (c) 2002-2006 3Dlabs Inc. Ltd. +// +// See 3Dlabs-License.txt for license information +// + +//uniform vec3 LightPosition; + +#ifdef GL_ES +precision highp float; +#endif + + +// attributes +attribute vec3 vert; +attribute vec3 normal; +attribute vec2 texcoord; + +uniform mat4 u_shadowLightWorld; +uniform mat4 u_shadowBiasMatrix; +uniform mat4 u_vShadowLight; +uniform vec3 u_lightPos; + +// matrix uniforms +uniform mat4 u_mvMatrix; +uniform vec3 u_eye; +uniform mat4 u_normalMatrix; +uniform mat4 u_projMatrix; +uniform mat4 u_worldMatrix; + +varying vec2 v_uv; + +void main(void) +{ + gl_Position = u_projMatrix * u_mvMatrix * vec4(vert,1.0) ; + v_uv = texcoord; +} \ No newline at end of file diff --git a/assets/shaders/radialBlur.frag.glsl b/assets/shaders/radialBlur.frag.glsl new file mode 100644 index 00000000..673d082a --- /dev/null +++ b/assets/shaders/radialBlur.frag.glsl @@ -0,0 +1,47 @@ + +precision highp float; + +uniform vec2 u_resolution; +uniform float u_time; +uniform vec4 color; +uniform sampler2D u_tex0; + +vec3 deform( in vec2 p ) +{ + vec2 uv; + + //float time = color.x; + float time = u_time; + vec2 q = vec2( sin(1.1*time+p.x),sin(1.2*time+p.y) ); + + float a = atan(q.y,q.x); + float r = sqrt(dot(q,q)); + + uv.x = sin(0.0+1.0*time)+p.x*sqrt(r*r+1.0); + uv.y = sin(0.6+1.1*time)+p.y*sqrt(r*r+1.0); + + return texture2D(u_tex0,uv*.5).xyz; +} + +void main(void) +{ + vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy; + //vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / vec2(500,500).xy; + vec2 s = p; + + vec3 total = vec3(0.0); + vec2 d = (vec2(0.0,0.0)-p)/40.0; + float w = 1.0; + for( int i=0; i<40; i++ ) + { + vec3 res = deform(s); + res = smoothstep(0.1,1.0,res*res); + total += w*res; + w *= .99; + s += d; + } + total /= 40.0; + float r = 1.5/(1.0+dot(p,p)); + + gl_FragColor = vec4( total*r,1.0); +} \ No newline at end of file diff --git a/assets/shaders/radialGradient.frag.glsl b/assets/shaders/radialGradient.frag.glsl new file mode 100644 index 00000000..cd751750 --- /dev/null +++ b/assets/shaders/radialGradient.frag.glsl @@ -0,0 +1,51 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. +
*/ + +#ifdef GL_ES +precision highp float; +#endif + +uniform vec4 u_color1; +uniform vec4 u_color2; +uniform vec4 u_color3; +uniform vec4 u_color4; +uniform float u_colorStop1; +uniform float u_colorStop2; +uniform float u_colorStop3; +uniform float u_colorStop4; +uniform vec2 u_cos_sin_angle; +//uniform int u_colorCount; // currently using all 4 + +varying vec2 v_uv; + +void main(void) +{ + vec2 pt = vec2( v_uv.x - 0.5, v_uv.y - 0.5); + float t = sqrt( dot(pt, pt) ); + + vec4 color; + if (t < u_colorStop1) + color = u_color1; + else if (t < u_colorStop2) + { + float tLocal = (t - u_colorStop1)/(u_colorStop2 - u_colorStop1); + color = mix(u_color1,u_color2,tLocal); + } + else if (t < u_colorStop3) + { + float tLocal = (t - u_colorStop2)/(u_colorStop3 - u_colorStop2); + color = mix(u_color2,u_color3,tLocal); + } + else if (t < u_colorStop4) + { + float tLocal = (t - u_colorStop3)/(u_colorStop4 - u_colorStop3); + color = mix(u_color3,u_color4,tLocal); + } + else + color = u_color4; + + gl_FragColor = color; +} diff --git a/assets/shaders/radialGradient.vert.glsl b/assets/shaders/radialGradient.vert.glsl new file mode 100644 index 00000000..c3e1b50a --- /dev/null +++ b/assets/shaders/radialGradient.vert.glsl @@ -0,0 +1,28 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. +
*/ + + +#ifdef GL_ES +precision highp float; +#endif + + +// attributes +attribute vec3 vert; +attribute vec3 normal; +attribute vec2 texcoord; + +// matrix uniforms +uniform mat4 u_mvMatrix; +uniform mat4 u_projMatrix; + +varying vec2 v_uv; + +void main(void) +{ + gl_Position = u_projMatrix * u_mvMatrix * vec4(vert,1.0) ; + v_uv = texcoord; +} \ No newline at end of file diff --git a/assets/shaders/test_fshader.glsl b/assets/shaders/test_fshader.glsl index 3a0af39f..629d1878 100644 --- a/assets/shaders/test_fshader.glsl +++ b/assets/shaders/test_fshader.glsl @@ -4,7 +4,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ - #ifdef GL_ES precision highp float; #endif @@ -15,18 +14,18 @@ uniform vec4 u_light0Diff; uniform vec4 u_light0Amb; // diffuse map -uniform sampler2D colMap; +uniform sampler2D u_colMap; // environment map uniform sampler2D envMap; // normal map -uniform sampler2D normalMap; +uniform sampler2D u_normalMap; -// glow map -uniform sampler2D glowMap; +// specular map +uniform sampler2D u_glowMap; -// glow map +// depth map uniform sampler2D depthMap; //material uniforms @@ -45,7 +44,7 @@ varying vec4 vShadowCoord; varying vec2 vEnvTexCoord; varying float vDiffuseIntensity; -#ifdef PC +#if defined( PC ) void main() { @@ -57,14 +56,14 @@ void main() vec4 colMapTexel = vec4(0); if (u_renderGlow <= 0.5) { - colMapTexel = vec4(texture2D(colMap, vec2(vNormal.w, vECPos.w)).rgb, 1.0); + colMapTexel = vec4(texture2D(u_colMap, vec2(vNormal.w, vECPos.w)).rgb, 1.0); } else { - colMapTexel = vec4(texture2D(glowMap, vec2(vNormal.w, vECPos.w)).rgb, 1.0); + colMapTexel = vec4(texture2D(u_glowMap, vec2(vNormal.w, vECPos.w)).rgb, 1.0); } // normal mapping vec3 normal = normalize(vNormal.xyz); - vec3 mapNormal = texture2D(normalMap, vec2(vNormal.w, vECPos.w)).xyz * 2.0 - 1.0; + vec3 mapNormal = texture2D(u_normalMap, vec2(vNormal.w, vECPos.w)).xyz * 2.0 - 1.0; mapNormal = normalize(mapNormal.x*vec3(normal.z, 0.0, -normal.x) + vec3(0.0, mapNormal.y, 0.0) + mapNormal.z*normal); // create envmap coordinates @@ -108,15 +107,15 @@ void main() #endif -#ifdef DEVICE +#if defined( DEVICE ) void main() { - vec4 colMapTexel = vec4(texture2D(colMap, vec2(vNormal.w, vECPos.w)).rgb, 1.0); + vec4 colMapTexel = vec4(texture2D(u_colMap, vec2(vNormal.w, vECPos.w)).rgb, 1.0); // // normal mapping vec3 normal = normalize(vNormal.xyz); -// vec3 mapNormal = texture2D(normalMap, vec2(vNormal.w, vECPos.w)).xyz * 2.0 - 1.0; +// vec3 mapNormal = texture2D(u_normalMap, vec2(vNormal.w, vECPos.w)).xyz * 2.0 - 1.0; // mapNormal = normalize(mapNormal.x*vec3(normal.z, 0.0, -normal.x) + vec3(0.0, mapNormal.y, 0.0) + mapNormal.z*normal); // // // create envmap coordinates diff --git a/js/controllers/elements/canvas-controller.js b/js/controllers/elements/canvas-controller.js index 21de9879..7af7e824 100644 --- a/js/controllers/elements/canvas-controller.js +++ b/js/controllers/elements/canvas-controller.js @@ -33,13 +33,5 @@ exports.CanvasController = Montage.create(ElementController, { ElementController.setProperty(el, p, value); } } - }, - - setProperties: { - value: function(el, props, index) { - for(var p in props) { - el.elementModel.controller.setProperty(el, p, props[p][index]); - } - } } }); \ No newline at end of file diff --git a/js/helper-classes/RDGE/GLCircle.js b/js/helper-classes/RDGE/GLCircle.js index fc2e6460..8f7a5d30 100644 --- a/js/helper-classes/RDGE/GLCircle.js +++ b/js/helper-classes/RDGE/GLCircle.js @@ -63,14 +63,16 @@ function GLCircle() this.m_world = world; + if(strokeMaterial) - { this._strokeMaterial = strokeMaterial; - } + else + this._strokeMaterial = new FlatMaterial(); + if(fillMaterial) - { this._fillMaterial = fillMaterial; - } + else + this._fillMaterial = new FlatMaterial(); } /////////////////////////////////////////////////////////////////////// diff --git a/js/helper-classes/RDGE/GLGeomObj.js b/js/helper-classes/RDGE/GLGeomObj.js index 72019703..e04b3283 100644 --- a/js/helper-classes/RDGE/GLGeomObj.js +++ b/js/helper-classes/RDGE/GLGeomObj.js @@ -99,6 +99,9 @@ function GLGeomObj() } } } + + var world = this.getWorld(); + if (world) world.restartRenderLoop(); } this.setFillColor = function(c) { this.setMaterialColor(c, "fill"); } diff --git a/js/helper-classes/RDGE/GLMaterial.js b/js/helper-classes/RDGE/GLMaterial.js index 51c27ace..c633f679 100644 --- a/js/helper-classes/RDGE/GLMaterial.js +++ b/js/helper-classes/RDGE/GLMaterial.js @@ -62,6 +62,10 @@ function GLMaterial( world ) this.getShader = function() { return this._shader; } this.getMaterialNode = function() { return this._materialNode; } + // a material can be animated or not. default is not. + // Any material needing continuous rendering should override this method + this.isAnimated = function() { return false; } + /////////////////////////////////////////////////////////////////////// // Common Material Methods @@ -174,6 +178,31 @@ function GLMaterial( world ) // animated materials should implement the update method } + this.registerTexture = function( texture ) + { + // the world needs to know about the texture map + var world = this.getWorld(); + if (!world) + console.log( "**** world not defined for registering texture map: " + texture.lookUpName ); + else + world.textureToLoad( texture ); + } + + this.loadTexture = function( texMapName, wrap, mips ) + { + var tex; + var world = this.getWorld(); + if (!world) + console.log( "world not defined for material with texture map" ); + else + { + var renderer = world.getRenderer(); + tex = renderer.getTextureByName(texMapName, wrap, mips ); + this.registerTexture( tex ); + } + return tex; + } + this.export = function() { // this function should be overridden by subclasses diff --git a/js/helper-classes/RDGE/GLRectangle.js b/js/helper-classes/RDGE/GLRectangle.js index 1334d7e6..bc3b1478 100644 --- a/js/helper-classes/RDGE/GLRectangle.js +++ b/js/helper-classes/RDGE/GLRectangle.js @@ -80,13 +80,14 @@ function GLRectangle() this._materialSpecular = [0.4, 0.4, 0.4, 1.0]; if(strokeMaterial) - { this._strokeMaterial = strokeMaterial; - } + else + this._strokeMaterial = new FlatMaterial(); + if(fillMaterial) - { this._fillMaterial = fillMaterial; - } + else + this._fillMaterial = new FlatMaterial(); } /////////////////////////////////////////////////////////////////////// @@ -278,10 +279,10 @@ function GLRectangle() brRadius = -z*(r-l)/(2.0*zn)*brRadiusNDC; // stroke - var strokeMaterial = this.makeStrokeMaterial(); - prim = this.createStroke([x,y], 2*xFill, 2*yFill, strokeSize, tlRadius, blRadius, brRadius, trRadius, strokeMaterial) - this._primArray.push( prim ); - this._materialNodeArray.push( strokeMaterial.getMaterialNode() ); +// var strokeMaterial = this.makeStrokeMaterial(); +// prim = this.createStroke([x,y], 2*xFill, 2*yFill, strokeSize, tlRadius, blRadius, brRadius, trRadius, strokeMaterial) +// this._primArray.push( prim ); +// this._materialNodeArray.push( strokeMaterial.getMaterialNode() ); // fill tlRadius -= strokeSize; if (tlRadius < 0) tlRadius = 0.0; diff --git a/js/helper-classes/RDGE/GLWorld.js b/js/helper-classes/RDGE/GLWorld.js index cc44da50..dd9b6977 100644 --- a/js/helper-classes/RDGE/GLWorld.js +++ b/js/helper-classes/RDGE/GLWorld.js @@ -65,6 +65,11 @@ function GLWorld( canvas, use3D ) this._camera; + // keep a flag indicating whether a render has been completed. + // this allows us to turn off automatic updating if there are + // no animated materials + this._firstRender = true; + /////////////////////////////////////////////////////////////////////// // Property accessors /////////////////////////////////////////////////////////////////////// @@ -103,6 +108,8 @@ function GLWorld( canvas, use3D ) this.isWebGL = function() { return this._useWebGL; } + this.getRenderer = function() { return this.renderer; } + //////////////////////////////////////////////////////////////////////////////////// // RDGE // local variables @@ -114,6 +121,10 @@ function GLWorld( canvas, use3D ) this.strokeShader = null; this.renderer = null; + // keep an array of texture maps that need to be loaded + this._texMapsToLoad = []; + this._allMapsLoaded = true; + // this is the node to which objects get hung this._rootNode; @@ -214,18 +225,149 @@ function GLWorld( canvas, use3D ) { if (this._useWebGL) { - var ctx = g_Engine.getContext(); - //console.log( "RDGE state: " + ctx.ctxStateManager.currentState().name); - - var renderer = ctx.renderer; - renderer.disableCulling(); - this.myScene.render(); + if (this._allMapsLoaded) + { + var ctx = g_Engine.getContext(); + //console.log( "RDGE state: " + ctx.ctxStateManager.currentState().name); + + ///////////////////////////// + var ctx1 = g_Engine.ctxMan.handleToObject(this._canvas.rdgeCtxHandle); + if (ctx1 != ctx) console.log( "***** different contexts (2) *****" ); + var aRenderer = ctx1.renderer; + ////////////////////////////////////////// + + var renderer = ctx.renderer; + if (renderer != aRenderer) console.log( "***** DIFFERENT RENDERERS *****" ); + renderer.disableCulling(); + this.myScene.render(); + + if (this._firstRender) + { + this._firstRender = false; + + if (!this.hasAnimatedMaterials()) + { + this.myScene.render(); + this._canvas.task.stop(); + } + } + } } else { this.render(); } } + + this.onRunState = function() + { + console.log( "GLWorld.onRunState" ); + } + + this.onLoadState = function() + { + console.log( "GLWorld.onLoadState" ); + } + + this.textureToLoad = function( texture ) + { + if (!texture.previouslyReferenced) + { + var name = texture.lookUpName; + texture._world = this; + texture.callback = this.textureMapLoaded; + this._texMapsToLoad[name] = true; + this._allMapsLoaded = false; + + // stop the draw loop until all textures have been loaded + this._canvas.task.stop(); + } + } + + this.textureMapLoaded = function( texture ) + { + var world = texture._world; + if (!world) + { + console.log( "**** loaded texture does not have world defined ****" ); + return; + } + + var name = texture.lookUpName; + if (!world._texMapsToLoad[name]) + { + console.log( "loaded an unregistered texture map: " + name ); + } + else + { + //console.log( "loaded a registered texture map: " + name ); + world._texMapsToLoad[name] = undefined; + } + + // check if all the texture maps are loaded. if so, resume the render loop + world._allMapsLoaded = world.allTextureMapsLoaded(); + if (world._allMapsLoaded) + world._canvas.task.start(); + } + + this.allTextureMapsLoaded = function() + { + for (var name in this._texMapsToLoad) + { + var needsLoad = this._texMapsToLoad[name]; + if (needsLoad) return false; + } + + return true; + } + + this.textureLoadedCallback = function( name ) + { + console.log( "*** material texture loaded: " + name ); + + var world = this._world; + if (!world) + console.log( "**** world not defined for loaded texture map: " + name ); + else + world.textureMapLoaded( name ); + } + + this.hasAnimatedMaterials = function() + { + var root = this.getGeomRoot(); + var rtnVal = false; + if (root) + rtnVal = this.hHasAnimatedMaterials( root ); + + return rtnVal; + } + + this.hHasAnimatedMaterials = function( obj ) + { + if (obj) + { + if (obj.getFillMaterial()) + { + if (obj.getFillMaterial().isAnimated()) return true; + } + + if (obj.getStrokeMaterial()) + { + if (obj.getStrokeMaterial().isAnimated()) return true; + } + + + // do the sibling + var hasAnim = false; + if (obj.getNext()) hasAnim = this.hHasAnimatedMaterials( obj.getNext() ); + if (hasAnim) return true; + if (obj.getChild()) hasAnim = this.hHasAnimatedMaterials( obj.getChild() ); + if (hasAnim) return true; + } + + return false; + } + // END RDGE //////////////////////////////////////////////////////////////////////////////////// @@ -233,23 +375,20 @@ function GLWorld( canvas, use3D ) // start RDGE passing your runtime object, and false to indicate we don't need a an initialization state // in the case of a procedurally built scene an init state is not needed for loading data - //if (this._useWebGL) + if (this._useWebGL) { - if (this._useWebGL) - { - rdgeStarted = true; + rdgeStarted = true; - // TODO - temporary fix for RDGE id's - this._canvas.id = this._canvas.uuid; + // TODO - temporary fix for RDGE id's + this._canvas.id = this._canvas.uuid; - g_Engine.registerCanvas(this._canvas, this); - RDGEStart( this._canvas ); + g_Engine.registerCanvas(this._canvas, this); + RDGEStart( this._canvas ); - //this._canvas.fpsTracker = new fpsTracker( '0' ); - //this._canvas.task = new RDGETask(this._canvas, true); - //this._canvas.task.stop() - //this._canvas.task.start() - } + //this._canvas.fpsTracker = new fpsTracker( '0' ); + this._canvas.task = new RDGETask(this._canvas, false); + this._canvas.task.stop() + //this._canvas.task.start() } } @@ -334,10 +473,6 @@ GLWorld.prototype.addObject = function( obj ) obj.setWorld( this ); - // build the WebGL buffers - if (this._useWebGL) - obj.buildBuffers(); - if (this._geomRoot == null) { this._geomRoot = obj; @@ -349,6 +484,13 @@ GLWorld.prototype.addObject = function( obj ) go.setNext( obj ); obj.setPrev( go ); } + + // build the WebGL buffers + if (this._useWebGL) + { + obj.buildBuffers(); + this.restartRenderLoop(); + } } catch(e) { @@ -356,16 +498,23 @@ GLWorld.prototype.addObject = function( obj ) } } +GLWorld.prototype.restartRenderLoop = function() +{ + this._firstRender = true; + if (this._allMapsLoaded) + this._canvas.task.start(); + else + this._canvas.task.stop(); +} + //append to the list of objects if obj doesn't already exist //if obj exists, then don't add to list of objects -GLWorld.prototype.addIfNewObject = function (obj) { +GLWorld.prototype.addIfNewObject = function (obj) +{ if (!obj) return; try { obj.setWorld(this); - // build the WebGL buffers - if (this._useWebGL) - obj.buildBuffers(); if (this._geomRoot == null) { this._geomRoot = obj; @@ -384,8 +533,16 @@ GLWorld.prototype.addIfNewObject = function (obj) { go.setNext(obj); obj.setPrev(go); + } } + + // build the WebGL buffers + if (this._useWebGL) + { + obj.buildBuffers(); + this.restartRenderLoop(); + } } catch (e) { alert("Exception in GLWorld.addIfNewObject " + e); diff --git a/js/helper-classes/RDGE/Materials/BumpMetalMaterial.js b/js/helper-classes/RDGE/Materials/BumpMetalMaterial.js index 0aa3ee78..17be0cd7 100644 --- a/js/helper-classes/RDGE/Materials/BumpMetalMaterial.js +++ b/js/helper-classes/RDGE/Materials/BumpMetalMaterial.js @@ -22,9 +22,9 @@ function BumpMetalMaterial() this._shaderName = "bumpMetal"; this._lightDiff = [0.3, 0.3, 0.3, 1.0]; - this._diffuseTexture = "metal"; - this._specularTexture = "silver"; - this._normalTexture = "normalMap"; + this._diffuseTexture = "assets/images/metal.png"; + this._specularTexture = "assets/images/silver.png"; + this._normalTexture = "assets/images/normalMap.png"; /////////////////////////////////////////////////////////////////////// // Property Accessors @@ -37,17 +37,16 @@ function BumpMetalMaterial() if (this._shader && this._shader.default) this._shader.default.u_light0Diff.set( ld ); } - this.getDiffuseTexture = function() { return this._diffuseTexture; } - this.setDiffuseTexture = function(dt) { this._diffuseTexture = dt; - if (this._materialNode) this._materialNode.setDiffuseTexture( dt ); } + this.getDiffuseTexture = function() { return this._propValues[this._propNames[1]] ? this._propValues[this._propNames[1]].slice() : null } + this.setDiffuseTexture = function(m) { this._propValues[this._propNames[1]] = m ? m.slice(0) : null; this.updateTexture(1); } - this.getSpecularTexture = function() { return this._specularTexture; } - this.setSpecularTexture = function(st) { this._specularTexture = st; - if (this._materialNode) this._materialNode.setSpecularTexture( st ); } + this.getNormalTexture = function() { return this._propValues[this._propNames[2]] ? this._propValues[this._propNames[2]].slice() : null } + this.setNormalTexture = function(m) { this._propValues[this._propNames[2]] = m ? m.slice(0) : null; this.updateTexture(2); } - this.getNormalTexture = function() { return this._normalTexture; } - this.setNormalTexture = function(nt) { this._normalTexture = nt; - if (this._materialNode) this._materialNode.setNormalTexture( nt ); } + this.getSpecularTexture = function() { return this._propValues[this._propNames[3]] ? this._propValues[this._propNames[3]].slice() : null } + this.setSpecularTexture = function(m) { this._propValues[this._propNames[3]] = m ? m.slice(0) : null; this.updateTexture(3); } + + this.isAnimated = function() { return true; } /////////////////////////////////////////////////////////////////////// // Material Property Accessors @@ -59,7 +58,7 @@ function BumpMetalMaterial() this._propValues[ this._propNames[0] ] = this._lightDiff.slice(0); this._propValues[ this._propNames[1] ] = this._diffuseTexture.slice(0); - this._propValues[ this._propNames[2] ] = this._specularTexture.slice(0); + this._propValues[ this._propNames[2] ] = this._normalTexture.slice(0); this._propValues[ this._propNames[3] ] = this._specularTexture.slice(0); // TODO - shader techniques are not all named the same, i.e., FlatMaterial uses "colorMe" and BrickMaterial uses "default" @@ -95,8 +94,11 @@ function BumpMetalMaterial() // duplcate method requirde this.dup = function() { return new BumpMetalMaterial(); } - this.init = function() + this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = bumpMetalMaterialDef; @@ -108,9 +110,36 @@ function BumpMetalMaterial() this._materialNode.setShader(this._shader); // set some image maps - this._materialNode.setDiffuseTexture( this.getDiffuseTexture() ); - this._materialNode.setSpecTexture( this.getSpecularTexture() ); - this._materialNode.setNormalTexture( this.getNormalTexture() ); + this.updateTexture(1); + this.updateTexture(2); + this.updateTexture(3); + } + + this.updateTexture = function( index ) + { + var material = this._materialNode; + if (material) + { + var technique = material.shaderProgram.default; + var renderer = g_Engine.getContext().renderer; + if (renderer && technique) + { + var texMapName = this._propValues[this._propNames[index]]; + var wrap = 'REPEAT', mips = true; + var tex = this.loadTexture( texMapName, wrap, mips ); + + if (tex) + { + switch (index) + { + case 1: technique.u_colMap.set( tex ); break; + case 2: technique.u_normalMap.set( tex ); break; + case 3: technique.u_glowMap.set( tex ); break; + default: console.log( "invalid map index in BumpMetalMaterial, " + index ); + } + } + } + } } this.export = function() @@ -229,6 +258,9 @@ bumpMetalShaderDef = { 'u_light0Diff' : { 'type' : 'vec4' }, //'u_matDiffuse' : { 'type' : 'vec4' } + 'u_colMap': { 'type' : 'tex2d' }, + 'u_normalMap': { 'type' : 'tex2d' }, + 'u_glowMap': { 'type' : 'tex2d' }, }, // render states diff --git a/js/helper-classes/RDGE/Materials/FlatMaterial.js b/js/helper-classes/RDGE/Materials/FlatMaterial.js index 5177a8a0..db66ca42 100644 --- a/js/helper-classes/RDGE/Materials/FlatMaterial.js +++ b/js/helper-classes/RDGE/Materials/FlatMaterial.js @@ -29,6 +29,8 @@ function FlatMaterial() this.getColor = function() { return this._color; } this.getShaderName = function() { return this._shaderName; } + this.isAnimated = function() { return true; } + //////////////////////////////////s///////////////////////////////////// // Methods /////////////////////////////////////////////////////////////////////// diff --git a/js/helper-classes/RDGE/Materials/IridescentScalesMaterial.js b/js/helper-classes/RDGE/Materials/IridescentScalesMaterial.js index ac1d3fe7..a8b1c18b 100644 --- a/js/helper-classes/RDGE/Materials/IridescentScalesMaterial.js +++ b/js/helper-classes/RDGE/Materials/IridescentScalesMaterial.js @@ -80,8 +80,11 @@ function IridescentScalesMaterial() /////////////////////////////////////////////////////////////////////// this.dup = function() { return new IridescentScalesMaterial(); } - this.init = function() + this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = iridescentScalesShaderDef; diff --git a/js/helper-classes/RDGE/Materials/JuliaMaterial.js b/js/helper-classes/RDGE/Materials/JuliaMaterial.js index 69884d18..f95263f4 100644 --- a/js/helper-classes/RDGE/Materials/JuliaMaterial.js +++ b/js/helper-classes/RDGE/Materials/JuliaMaterial.js @@ -64,6 +64,9 @@ function JuliaMaterial() this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = JuliaMaterialDef; diff --git a/js/helper-classes/RDGE/Materials/KeleidoscopeMaterial.js b/js/helper-classes/RDGE/Materials/KeleidoscopeMaterial.js index 8f94f47b..1547aca9 100644 --- a/js/helper-classes/RDGE/Materials/KeleidoscopeMaterial.js +++ b/js/helper-classes/RDGE/Materials/KeleidoscopeMaterial.js @@ -62,6 +62,9 @@ function KeleidoscopeMaterial() this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = keleidoscopeMaterialDef; diff --git a/js/helper-classes/RDGE/Materials/LinearGradientMaterial.js b/js/helper-classes/RDGE/Materials/LinearGradientMaterial.js index 357ce275..f026cd15 100644 --- a/js/helper-classes/RDGE/Materials/LinearGradientMaterial.js +++ b/js/helper-classes/RDGE/Materials/LinearGradientMaterial.js @@ -98,6 +98,8 @@ function LinearGradientMaterial() this._shader.default.u_cos_sin_angle.set([Math.cos(a), Math.sin(a)]); } + this.isAnimated = function() { return true; } + /////////////////////////////////////////////////////////////////////// // Material Property Accessors /////////////////////////////////////////////////////////////////////// @@ -146,6 +148,8 @@ function LinearGradientMaterial() // send the current values to the shader this.updateShaderValues(); + + console.log( "**** LinearGradientMaterial initialized" ); } this.updateShaderValues= function() diff --git a/js/helper-classes/RDGE/Materials/MandelMaterial.js b/js/helper-classes/RDGE/Materials/MandelMaterial.js index 76083b76..25b08404 100644 --- a/js/helper-classes/RDGE/Materials/MandelMaterial.js +++ b/js/helper-classes/RDGE/Materials/MandelMaterial.js @@ -42,6 +42,7 @@ function MandelMaterial() /////////////////////////////////////////////////////////////////////// + this.isAnimated = function() { return true; } /////////////////////////////////////////////////////////////////////// // Methods @@ -64,6 +65,9 @@ function MandelMaterial() this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = MandelMaterialDef; diff --git a/js/helper-classes/RDGE/Materials/PulseMaterial.js b/js/helper-classes/RDGE/Materials/PulseMaterial.js index 5bee818e..3d6107fb 100644 --- a/js/helper-classes/RDGE/Materials/PulseMaterial.js +++ b/js/helper-classes/RDGE/Materials/PulseMaterial.js @@ -33,9 +33,11 @@ function PulseMaterial() this.getName = function() { return this._name; } this.getShaderName = function() { return this._shaderName; } - this.getTextureMap = function() { return this._texMap.slice(0); } + this.getTextureMap = function() { return this._propValues[this._propNames[0]] ? this._propValues[this._propNames[0]].slice() : null } this.setTextureMap = function(m) { this._propValues[this._propNames[0]] = m ? m.slice(0) : null; this.updateTexture(); } + this.isAnimated = function() { return true; } + /////////////////////////////////////////////////////////////////////// // Material Property Accessors /////////////////////////////////////////////////////////////////////// @@ -72,6 +74,9 @@ function PulseMaterial() // duplcate method requirde this.dup = function( world ) { + // save the world + if (world) this.setWorld( world ); + // allocate a new uber material var newMat = new PulseMaterial(); @@ -87,6 +92,9 @@ function PulseMaterial() this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = pulseMaterialDef; @@ -116,7 +124,10 @@ function PulseMaterial() if (renderer && technique) { var texMapName = this._propValues[this._propNames[0]]; - var tex = renderer.getTextureByName(texMapName, 'REPEAT'); + var wrap = 'REPEAT', mips = true; + //var tex = renderer.getTextureByName(texMapName, wrap, mips ); + //this.registerTexture( tex ); + var tex = this.loadTexture( texMapName, wrap, mips ); if (tex) technique.u_tex0.set( tex ); } diff --git a/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js b/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js index 25331b54..9acb4213 100644 --- a/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js +++ b/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js @@ -92,6 +92,9 @@ function RadialBlurMaterial() this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = radialBlurMaterialDef; diff --git a/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js b/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js index 70c0e952..5f912dec 100644 --- a/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js +++ b/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js @@ -21,13 +21,15 @@ function RadialGradientMaterial() this._name = "RadialGradientMaterial"; this._shaderName = "radialGradient"; - this._startColor = [1, 0, 0, 1]; - this._stopColor = [0, 1, 0, 1]; - - this._mainCircleRadius = 0.5; - this._innerCircleRadius = 0.05; - this._innerCircleCenter = [0.5, 0.5]; - this._mainCircleCenter = [0.5, 0.5]; + this._color1 = [1,0,0,1]; + this._color2 = [0,1,0,1]; + this._color3 = [0,0,1,1]; + this._color4 = [0,1,1,1]; + this._colorStop1 = 0.0; + this._colorStop2 = 0.3; + this._colorStop3 = 0.6; + this._colorStop4 = 1.0; + this._colorCount = 4; /////////////////////////////////////////////////////////////////////// // Property Accessors @@ -35,42 +37,79 @@ function RadialGradientMaterial() this.getName = function() { return this._name; } this.getShaderName = function() { return this._shaderName; } - this.getStartColor = function() { return this._startColor.slice(0); } - this.setStartColor = function(c) { this._startColor = c.slice(0); } - - this.getStopColor = function() { return this._stopColor.slice(0); } - this.setStopColor = function(c) { this._stopColor = c.slice(0); } - - this.getMainCircleRadius = function() { return this._mainCircleRadius; } - this.setMainCircleRadius = function(r) { this._mainCircleRadius = r; } - - this.getInnerCircleRadius = function() { return this._innerCircleRadius; } - this.setInnerCircleRadius = function(r) { this._innerCircleRadius = r; } + + this.getColor1 = function() { return this._color1; } + this.setColor1 = function(c) { this._color1 = c.slice(); + if (this._shader && this._shader.default) + this._shader.default.u_color1.set(c); + } + + this.getColor2 = function() { return this._color2; } + this.setColor2 = function(c) { this._color2 = c.slice(); + if (this._shader && this._shader.default) + this._shader.default.u_color2.set(c); + } + + this.getColor3 = function() { return this._color3; } + this.setColor3 = function(c) { this._color3 = c.slice(); + if (this._shader && this._shader.default) + this._shader.default.u_color3.set(c); + } + + this.getColor4 = function() { return this._color4; } + this.setColor4 = function(c) { this._color4 = c.slice(); + if (this._shader && this._shader.default) + this._shader.default.u_color4.set(c); + } + + this.getColorStop1 = function() { return this._colorStop1; } + this.setColorStop1 = function(s) { this._colorStop1 = s; + if (this._shader && this._shader.default) + this._shader.default.u_colorStop1.set([s]); + } + + this.getColorStop2 = function() { return this._colorStop2; } + this.setColorStop2 = function(s) { this._colorStop2 = s; + if (this._shader && this._shader.default) + this._shader.default.u_colorStop2.set([s]); + } + + this.getColorStop3 = function() { return this._colorStop3; } + this.setColorStop3 = function(s) { this._colorStop3 = s; + if (this._shader && this._shader.default) + this._shader.default.u_colorStop3.set([s]); + } + + this.getColorStop4 = function() { return this._colorStop4; } + this.setColorStop4 = function(s) { this._colorStop4 = s; + if (this._shader && this._shader.default) + this._shader.default.u_colorStop4.set([s]); + } + + this.getColorCount = function() { return this._colorCount; } + this.setColorCount = function(c) { this._colorCount = c; + if (this._shader && this._shader.default) + this._shader.default.u_colorCount.set([c]); + } + + this.isAnimated = function() { return true; } - this.getInnerCircleCenter = function() { return this._innerCircleCenter; } - this.setInnerCircleCenter = function(c) { this._innerCircleCenter = c; } - - this.getMainCircleCenter = function() { return this._mainCircleCenter; } - this.setMainCircleCenter = function(c) { this._mainCircleCenter = c; } /////////////////////////////////////////////////////////////////////// // Material Property Accessors /////////////////////////////////////////////////////////////////////// - this._propNames = ["startColor", "stopColor", "mainCircleRadius", "innerCircleRadius", "mainCircleCenter", "innerCircleCenter"]; - this._propLabels = ["Start Color", "Stop Color", "Main Circle Radius", "Inner Circle Radius", "Main Circle Center", "Inner Circle Center"]; - this._propTypes = ["color", "color", "float", "float", "vector2d", "vector2d"]; + this._propNames = ["color1", "color2", "angle"]; + this._propLabels = ["Start Color", "Stop Color", "Angle"]; + this._propTypes = ["color", "color", "float"]; this._propValues = []; - this._propValues[ this._propNames[0] ] = this._startColor.slice(0); - this._propValues[ this._propNames[1] ] = this._stopColor.slice(0); - this._propValues[ this._propNames[2] ] = this.getMainCircleRadius(); - this._propValues[ this._propNames[3] ] = this.getInnerCircleRadius(); - this._propValues[ this._propNames[4] ] = this.getMainCircleCenter(); - this._propValues[ this._propNames[5] ] = this.getInnerCircleCenter(); + this._propValues[ this._propNames[0] ] = this._color1.slice(0); + this._propValues[ this._propNames[1] ] = this._color4.slice(0); + this._propValues[ this._propNames[2] ] = this._angle; this.setProperty = function( prop, value ) { - if (prop === "color") prop = "startColor"; + if (prop === "color") prop = "color1"; // make sure we have legitimate imput var ok = this.validateProperty( prop, value ); @@ -79,12 +118,9 @@ function RadialGradientMaterial() switch (prop) { - case "startColor": this.setStartColor(value); break; - case "stopColor": this.setStopColor(value); break; - case "innerCircleRadius": this.setInnerCircleRadius( value ); break; - case "mainCircleRadius": this.setMainCircleRadius( value ); break; - case "innerCircleCenter": this.setInnerCircleCenter( value ); break; - case "mainCircleCenter": this.setMainCircleCenter( value ); break; + case "color1": this.setColor1( value ); break; + case "color2": this.setColor2( value ); break; + case "angle": this.setAngle( value ); break; } this.updateValuesInShader(); @@ -115,25 +151,30 @@ function RadialGradientMaterial() this.updateValuesInShader = function() { - if (!this._shader || !this._shader.default) return; - - // calculate values - var mainCircleRadius = this.getMainCircleRadius(); - var innerCircleRadius = this.getInnerCircleRadius(); - var innerCircleCenter = this.getInnerCircleCenter(); - var mainCircleCenter = this.getMainCircleCenter(); - var radiusDelta = innerCircleRadius - mainCircleRadius; - var innerCircleCenterMinusCenter = VecUtils.vecSubtract( 2, innerCircleCenter, mainCircleCenter ); - var u_A = VecUtils.vecDot( 2, innerCircleCenterMinusCenter, innerCircleCenterMinusCenter) - (radiusDelta * radiusDelta) - - // set values - this._shader.default.u_center.set( innerCircleCenter ); - this._shader.default.u_startColor.set( this.getStartColor() ); - this._shader.default.u_stopColor.set( this.getStopColor() ); - this._shader.default.u_innerCircleCenterMinusCenter.set( innerCircleCenterMinusCenter ); - this._shader.default.u_radius.set( [mainCircleRadius] ); - this._shader.default.u_A.set( [ u_A] ); - this._shader.default.u_radiusDelta.set( [radiusDelta] ); + if (this._shader && this._shader.default) + { + //this._shader.default.u_colorCount.set( [4] ); + + var c; + c = this.getColor1(); + this._shader.default.u_color1.set( c ); + c = this.getColor2(); + this._shader.default.u_color2.set( c ); + c = this.getColor3(); + this._shader.default.u_color3.set( c ); + c = this.getColor4(); + this._shader.default.u_color4.set( c ); + + var s; + s = this.getColorStop1(); + this._shader.default.u_colorStop1.set( [s] ); + s = this.getColorStop2(); + this._shader.default.u_colorStop2.set( [s] ); + s = this.getColorStop3(); + this._shader.default.u_colorStop3.set( [s] ); + s = this.getColorStop4(); + this._shader.default.u_colorStop4.set( [s] ); + } } this.export = function() @@ -190,13 +231,13 @@ function RadialGradientMaterial() /////////////////////////////////////////////////////////////////////////////////////// // RDGE shader - + // shader spec (can also be loaded from a .JSON file, or constructed at runtime) var radialGradientMaterialDef = {'shaders': { 'defaultVShader':"assets/shaders/radialGradient.vert.glsl", - 'defaultFShader':"assets/shaders/radialGradient.frag.glsl", + 'defaultFShader':"assets/shaders/radialGradient.frag.glsl" }, 'techniques': { @@ -210,18 +251,21 @@ var radialGradientMaterialDef = { 'vert' : { 'type' : 'vec3' }, 'normal' : { 'type' : 'vec3' }, - 'texcoord' : { 'type' : 'vec2' }, + 'texcoord' : { 'type' : 'vec2' } }, // parameters 'params' : { - 'u_startColor' : { 'type' : 'vec4' }, - 'u_stopColor' : { 'type' : 'vec4' }, - 'u_center' : { 'type' : 'vec2' }, - 'u_radius' : { 'type' : 'float' }, - 'u_A' : { 'type' : 'float' }, - 'u_radiusDelta' : { 'type' : 'float' }, - 'u_innerCircleCenterMinusCenter' : { 'type' : 'vec2' }, + 'u_color1' : { 'type' : 'vec4' }, + 'u_color2' : { 'type' : 'vec4' }, + 'u_color3' : { 'type' : 'vec4' }, + 'u_color4' : { 'type' : 'vec4' }, + 'u_colorStop1': { 'type' : 'float' }, + 'u_colorStop2': { 'type' : 'float' }, + 'u_colorStop3': { 'type' : 'float' }, + 'u_colorStop4': { 'type' : 'float' }, + 'u_cos_sin_angle' : { 'type' : 'vec2' } + //'u_colorCount': {'type' : 'int' } }, // render states @@ -229,12 +273,8 @@ var radialGradientMaterialDef = { 'depthEnable' : true, 'offset':[1.0, 0.1] - }, - }, + } + } ] } }; - - - - diff --git a/js/helper-classes/RDGE/Materials/TunnelMaterial.js b/js/helper-classes/RDGE/Materials/TunnelMaterial.js index fe277af6..9b12e197 100644 --- a/js/helper-classes/RDGE/Materials/TunnelMaterial.js +++ b/js/helper-classes/RDGE/Materials/TunnelMaterial.js @@ -62,6 +62,9 @@ function TunnelMaterial() this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = tunnelMaterialDef; diff --git a/js/helper-classes/RDGE/Materials/TwistMaterial.js b/js/helper-classes/RDGE/Materials/TwistMaterial.js index c3094621..b113965b 100644 --- a/js/helper-classes/RDGE/Materials/TwistMaterial.js +++ b/js/helper-classes/RDGE/Materials/TwistMaterial.js @@ -62,6 +62,9 @@ function TwistMaterial() this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = new jshader(); this._shader.def = twistMaterialDef; diff --git a/js/helper-classes/RDGE/Materials/UberMaterial.js b/js/helper-classes/RDGE/Materials/UberMaterial.js index a8254465..afb745d1 100644 --- a/js/helper-classes/RDGE/Materials/UberMaterial.js +++ b/js/helper-classes/RDGE/Materials/UberMaterial.js @@ -270,6 +270,7 @@ function UberMaterial() if (renderer && technique) { var tex = renderer.getTextureByName(value, caps.environmentMap.wrap); + this.registerTexture( tex ); technique.s_environmentMap.set( tex ); } } @@ -307,6 +308,7 @@ function UberMaterial() if (renderer && technique) { var tex = renderer.getTextureByName(value, caps.diffuseMap.wrap); + this.registerTexture( tex ); technique.s_diffuseMap.set( tex ); } } @@ -344,6 +346,7 @@ function UberMaterial() if (renderer && technique) { var tex = renderer.getTextureByName(value, caps.specularMap.wrap); + this.registerTexture( tex ); technique.s_specularMap.set( tex ); } } @@ -381,6 +384,7 @@ function UberMaterial() if (renderer && technique) { var tex = renderer.getTextureByName(value, caps.normalMap.wrap); + this.registerTexture( tex ); technique.s_normalMap.set( tex ); } } @@ -411,8 +415,11 @@ function UberMaterial() return newMat; } - this.init = function() + this.init = function( world ) { + // save the world + if (world) this.setWorld( world ); + // set up the shader this._shader = this.buildUberShader( this._ubershaderCaps ); @@ -579,16 +586,24 @@ function UberMaterial() renderer = g_Engine.getContext().renderer; if(this._useDiffuseMap) { - technique.s_diffuseMap.set(renderer.getTextureByName(caps.diffuseMap.texture, caps.diffuseMap.wrap, caps.diffuseMap.mips)); + var tex = renderer.getTextureByName(caps.diffuseMap.texture, caps.diffuseMap.wrap, caps.diffuseMap.mips); + this.registerTexture( tex ); + technique.s_diffuseMap.set( tex ); } if(this._useNormalMap) { - technique.s_normalMap.set(renderer.getTextureByName(caps.normalMap.texture, caps.normalMap.wrap, caps.normalMap.mips)); + var tex = renderer.getTextureByName(caps.normalMap.texture, caps.normalMap.wrap, caps.normalMap.mips); + this.registerTexture( tex ); + technique.s_normalMap.set( tex ); } if(this._useSpecularMap) { - technique.s_specMap.set(renderer.getTextureByName(caps.specularMap.texture, caps.specularMap.wrap)); + var tex = renderer.getTextureByName(caps.specularMap.texture, caps.specularMap.wrap); + this.registerTexture( tex ); + technique.s_specMap.set( tex ); } if(this._useEnvironmentMap) { - technique.s_envMap.set(renderer.getTextureByName(caps.environmentMap.texture, caps.environmentMap.wrap)); + var tex = renderer.getTextureByName(caps.environmentMap.texture, caps.environmentMap.wrap); + this.registerTexture( tex ); + technique.s_envMap.set( tex ); technique.u_envReflection.set([ caps.environmentMap.envReflection || 1.0 ] ); } diff --git a/js/helper-classes/RDGE/MaterialsLibrary.js b/js/helper-classes/RDGE/MaterialsLibrary.js index edc4f7da..5f82a996 100644 --- a/js/helper-classes/RDGE/MaterialsLibrary.js +++ b/js/helper-classes/RDGE/MaterialsLibrary.js @@ -170,28 +170,28 @@ var MaterialsLibrary = Object.create(Object.prototype, { // create the library of stroke and fill materials var uberMaterial = new UberMaterial(); -//var linearGradientMaterial = new LinearGradientMaterial(); -//var radialGradientMaterial = new RadialGradientMaterial(); -//var radialBlurMaterial = new RadialBlurMaterial(); -//var pulseMaterial = new PulseMaterial(); -//var tunnelMaterial = new TunnelMaterial(); -//var twistMaterial = new TwistMaterial(); -//var keleidoscopeMaterial = new KeleidoscopeMaterial(); -//var juliaMaterial = new JuliaMaterial(); -//var mandelMaterial = new MandelMaterial(); -//var plasmaMaterial = new PlasmaMaterial(); +var linearGradientMaterial = new LinearGradientMaterial(); +var radialGradientMaterial = new RadialGradientMaterial(); +var radialBlurMaterial = new RadialBlurMaterial(); +var pulseMaterial = new PulseMaterial(); +var tunnelMaterial = new TunnelMaterial(); +var twistMaterial = new TwistMaterial(); +var keleidoscopeMaterial = new KeleidoscopeMaterial(); +var juliaMaterial = new JuliaMaterial(); +var mandelMaterial = new MandelMaterial(); +var plasmaMaterial = new PlasmaMaterial(); var bumpMetalMaterial = new BumpMetalMaterial(); -//MaterialsLibrary.addMaterial(linearGradientMaterial); -//MaterialsLibrary.addMaterial(radialGradientMaterial); -//MaterialsLibrary.addMaterial(radialBlurMaterial); -//MaterialsLibrary.addMaterial(pulseMaterial); -//MaterialsLibrary.addMaterial(tunnelMaterial); -//MaterialsLibrary.addMaterial(twistMaterial); -//MaterialsLibrary.addMaterial(keleidoscopeMaterial); -//MaterialsLibrary.addMaterial(juliaMaterial); -//MaterialsLibrary.addMaterial(mandelMaterial); -//MaterialsLibrary.addMaterial(plasmaMaterial); +MaterialsLibrary.addMaterial(linearGradientMaterial); +MaterialsLibrary.addMaterial(radialGradientMaterial); +MaterialsLibrary.addMaterial(radialBlurMaterial); +MaterialsLibrary.addMaterial(pulseMaterial); +MaterialsLibrary.addMaterial(tunnelMaterial); +MaterialsLibrary.addMaterial(twistMaterial); +MaterialsLibrary.addMaterial(keleidoscopeMaterial); +MaterialsLibrary.addMaterial(juliaMaterial); +MaterialsLibrary.addMaterial(mandelMaterial); +MaterialsLibrary.addMaterial(plasmaMaterial); MaterialsLibrary.addMaterial(bumpMetalMaterial); MaterialsLibrary.addMaterial(uberMaterial); diff --git a/js/helper-classes/RDGE/rdge-compiled.js b/js/helper-classes/RDGE/rdge-compiled.js index 4b74aa17..e55516db 100644 --- a/js/helper-classes/RDGE/rdge-compiled.js +++ b/js/helper-classes/RDGE/rdge-compiled.js @@ -19,14 +19,14 @@ vec4.equal=function(a,b,f){f||(f=0.0010);return vec4.distanceSq(a,b)