From 6321075d93044c6747682a8e7280b5996da7ec52 Mon Sep 17 00:00:00 2001
From: hwc487
Date: Thu, 2 Feb 2012 11:57:58 -0800
Subject: added some additional shaders
---
assets/shaders/Deform.frag.glsl | 29 +++++
assets/shaders/Fly.frag.glsl | 23 ++++
assets/shaders/ReliefTunnel.frag.glsl | 35 ++++++
assets/shaders/SquareTunnel.frag.glsl | 21 ++++
assets/shaders/Star.frag.glsl | 28 +++++
assets/shaders/Water.frag.glsl | 55 +++++++++
assets/shaders/ZInvert.frag.glsl | 23 ++++
js/helper-classes/RDGE/Materials/DeformMaterial.js | 133 +++++++++++++++++++++
js/helper-classes/RDGE/Materials/FlyMaterial.js | 133 +++++++++++++++++++++
.../RDGE/Materials/ReliefTunnelMaterial.js | 133 +++++++++++++++++++++
.../RDGE/Materials/SquareTunnelMaterial.js | 133 +++++++++++++++++++++
js/helper-classes/RDGE/Materials/StarMaterial.js | 133 +++++++++++++++++++++
js/helper-classes/RDGE/Materials/WaterMaterial.js | 133 +++++++++++++++++++++
.../RDGE/Materials/ZInvertMaterial.js | 133 +++++++++++++++++++++
js/helper-classes/RDGE/MaterialsLibrary.js | 21 ++++
js/panels/Materials/Materials.xml | 7 ++
.../materials-popup.reel/materials-popup.js | 7 ++
js/preloader/Preloader.js | 7 ++
18 files changed, 1187 insertions(+)
create mode 100644 assets/shaders/Deform.frag.glsl
create mode 100644 assets/shaders/Fly.frag.glsl
create mode 100644 assets/shaders/ReliefTunnel.frag.glsl
create mode 100644 assets/shaders/SquareTunnel.frag.glsl
create mode 100644 assets/shaders/Star.frag.glsl
create mode 100644 assets/shaders/Water.frag.glsl
create mode 100644 assets/shaders/ZInvert.frag.glsl
create mode 100644 js/helper-classes/RDGE/Materials/DeformMaterial.js
create mode 100644 js/helper-classes/RDGE/Materials/FlyMaterial.js
create mode 100644 js/helper-classes/RDGE/Materials/ReliefTunnelMaterial.js
create mode 100644 js/helper-classes/RDGE/Materials/SquareTunnelMaterial.js
create mode 100644 js/helper-classes/RDGE/Materials/StarMaterial.js
create mode 100644 js/helper-classes/RDGE/Materials/WaterMaterial.js
create mode 100644 js/helper-classes/RDGE/Materials/ZInvertMaterial.js
diff --git a/assets/shaders/Deform.frag.glsl b/assets/shaders/Deform.frag.glsl
new file mode 100644
index 00000000..1dbe45a0
--- /dev/null
+++ b/assets/shaders/Deform.frag.glsl
@@ -0,0 +1,29 @@
+#ifdef GL_ES
+precision highp float;
+#endif
+
+uniform float u_time;
+uniform vec2 u_resolution;
+//uniform vec4 mouse;
+uniform sampler2D u_tex0;
+
+void main(void)
+{
+ vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy;
+ //vec2 m = -1.0 + 2.0 * mouse.xy / u_resolution.xy;
+ vec2 m = vec2(-.8, .8);
+
+ float a1 = atan(p.y-m.y,p.x-m.x);
+ float r1 = sqrt(dot(p-m,p-m));
+ float a2 = atan(p.y+m.y,p.x+m.x);
+ float r2 = sqrt(dot(p+m,p+m));
+
+ vec2 uv;
+ uv.x = 0.2*u_time + (r1-r2)*0.25;
+ uv.y = sin(2.0*(a1-a2));
+
+ float w = r1*r2*0.8;
+ vec3 col = texture2D(u_tex0,uv).xyz;
+
+ gl_FragColor = vec4(col/(.1+w),1.0);
+}
\ No newline at end of file
diff --git a/assets/shaders/Fly.frag.glsl b/assets/shaders/Fly.frag.glsl
new file mode 100644
index 00000000..f99b5ab8
--- /dev/null
+++ b/assets/shaders/Fly.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 an = u_time*.25;
+
+ float x = p.x*cos(an)-p.y*sin(an);
+ float y = p.x*sin(an)+p.y*cos(an);
+
+ uv.x = .25*x/abs(y);
+ uv.y = .20*u_time + .25/abs(y);
+
+ gl_FragColor = vec4(texture2D(u_tex0,uv).xyz * y*y, 1.0);
+}
diff --git a/assets/shaders/ReliefTunnel.frag.glsl b/assets/shaders/ReliefTunnel.frag.glsl
new file mode 100644
index 00000000..cee707db
--- /dev/null
+++ b/assets/shaders/ReliefTunnel.frag.glsl
@@ -0,0 +1,35 @@
+#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 r = sqrt( dot(p,p) );
+ float a = atan(p.y,p.x) + 0.5*sin(0.5*r-0.5*u_time);
+
+ float s = 0.5 + 0.5*cos(7.0*a);
+ s = smoothstep(0.0,1.0,s);
+ s = smoothstep(0.0,1.0,s);
+ s = smoothstep(0.0,1.0,s);
+ s = smoothstep(0.0,1.0,s);
+
+ uv.x = u_time + 1.0/( r + .2*s);
+ uv.y = 3.0*a/3.1416;
+
+ float w = (0.5 + 0.5*s)*r*r;
+
+ vec3 col = texture2D(u_tex0,uv).xyz;
+
+ float ao = 0.5 + 0.5*cos(7.0*a);
+ ao = smoothstep(0.0,0.4,ao)-smoothstep(0.4,0.7,ao);
+ ao = 1.0-0.5*ao*r;
+
+ gl_FragColor = vec4(col*w*ao,1.0);
+}
diff --git a/assets/shaders/SquareTunnel.frag.glsl b/assets/shaders/SquareTunnel.frag.glsl
new file mode 100644
index 00000000..51ef7b7c
--- /dev/null
+++ b/assets/shaders/SquareTunnel.frag.glsl
@@ -0,0 +1,21 @@
+#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 r = pow( pow(p.x*p.x,16.0) + pow(p.y*p.y,16.0), 1.0/32.0 );
+ uv.x = .5*u_time + 0.5/r;
+ uv.y = 1.0*atan(p.y,p.x)/3.1416;
+
+ vec3 col = texture2D(u_tex0,uv).xyz;
+
+ gl_FragColor = vec4(col*r*r*r,1.0);
+}
diff --git a/assets/shaders/Star.frag.glsl b/assets/shaders/Star.frag.glsl
new file mode 100644
index 00000000..f63fe605
--- /dev/null
+++ b/assets/shaders/Star.frag.glsl
@@ -0,0 +1,28 @@
+#ifdef GL_ES
+precision highp float;
+#endif
+
+uniform float u_time;
+uniform vec2 u_resolution;
+uniform sampler2D u_tex0;
+
+void main(void)
+{
+ vec2 uv;
+
+ vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / u_resolution.xy;
+ float a = atan(p.y,p.x);
+ float r = sqrt(dot(p,p));
+ float s = r * (1.0+0.8*cos(u_time*1.0));
+
+ uv.x = .02*p.y+.03*cos(-u_time+a*3.0)/s;
+ uv.y = .1*u_time +.02*p.x+.03*sin(-u_time+a*3.0)/s;
+
+ float w = .9 + pow(max(1.5-r,0.0),4.0);
+
+ w*=0.6+0.4*cos(u_time+3.0*a);
+
+ vec3 col = texture2D(u_tex0,uv).xyz;
+
+ gl_FragColor = vec4(col*w,1.0);
+}
\ No newline at end of file
diff --git a/assets/shaders/Water.frag.glsl b/assets/shaders/Water.frag.glsl
new file mode 100644
index 00000000..5b71a658
--- /dev/null
+++ b/assets/shaders/Water.frag.glsl
@@ -0,0 +1,55 @@
+#ifdef GL_ES
+precision highp float;
+#endif
+
+uniform sampler2D u_tex0;
+uniform float u_time;
+uniform vec2 u_resolution;
+
+const float speedx = 1./ 0.1;
+const float speedy = 1./ .01;
+const float speedr = 1./ 0.01;
+const float delta = 20.;
+const float intence = 10.;
+const int dif = 7;
+
+float col(vec2 coord)
+{
+ float delta_theta = 3.1415926535897932 / float(dif);
+ float col = 0.;
+ float theta = 0.;
+ theta = u_time/200.;
+
+ coord.x += u_time/speedx;
+ coord.y += u_time/speedy;
+ for (int i = 0; i < dif; i++)
+ {
+ coord.x += u_time/speedr;
+ theta = theta + delta_theta;
+ col = col + cos( (coord.x*cos(theta) - coord.y*sin(theta))*20. );
+ }
+
+ return cos(col);
+}
+
+void main(void)
+{
+ vec2 p = (gl_FragCoord.xy) / u_resolution.xy;
+
+ vec2 c1 = p;
+ vec2 c2 = p;
+
+ c2.x = c2.x+u_resolution.x/delta;
+ float dx = (col(c1)-col(c2))/delta;
+
+ c2 = p;
+ c2.y = c2.y + u_resolution.y/delta;
+ float dy = (col(c1)-col(c2))/delta;
+
+ c1.x = c1.x+dx;
+ c1.y = -(c1.y+dy);
+
+ float alpha = 1.+dot(dx,dy)*intence;
+ if (alpha < 0.7) alpha = 0.7;
+ gl_FragColor = texture2D(u_tex0,c1)*(alpha);
+}
diff --git a/assets/shaders/ZInvert.frag.glsl b/assets/shaders/ZInvert.frag.glsl
new file mode 100644
index 00000000..b1fd1748
--- /dev/null
+++ b/assets/shaders/ZInvert.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 = cos(0.6+u_time) + cos(cos(1.2+u_time)+a)/r;
+ uv.y = cos(0.3+u_time) + sin(cos(2.0+u_time)+a)/r;
+
+ vec3 col = texture2D(u_tex0,uv*.25).xyz;
+
+ gl_FragColor = vec4(col*r*r,1.0);
+}
\ No newline at end of file
diff --git a/js/helper-classes/RDGE/Materials/DeformMaterial.js b/js/helper-classes/RDGE/Materials/DeformMaterial.js
new file mode 100644
index 00000000..ddc97383
--- /dev/null
+++ b/js/helper-classes/RDGE/Materials/DeformMaterial.js
@@ -0,0 +1,133 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+
+///////////////////////////////////////////////////////////////////////
+// Class GLMaterial
+// RDGE representation of a material.
+///////////////////////////////////////////////////////////////////////
+function DeformMaterial()
+{
+ // initialize the inherited members
+ this.inheritedFrom = PulseMaterial;
+ this.inheritedFrom();
+
+ ///////////////////////////////////////////////////////////////////////
+ // Instance variables
+ ///////////////////////////////////////////////////////////////////////
+ this._name = "DeformMaterial";
+ this._shaderName = "deform";
+
+ this._texMap = 'assets/images/rocky-normal.jpg';
+
+ this._time = 0.0;
+ this._dTime = 0.01;
+
+ ///////////////////////////////////////////////////////////////////////
+ // Properties
+ ///////////////////////////////////////////////////////////////////////
+ // all defined in parent PulseMaterial.js
+ // load the local default value
+ this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+
+ ///////////////////////////////////////////////////////////////////////
+ // Material Property Accessors
+ ///////////////////////////////////////////////////////////////////////
+
+ ///////////////////////////////////////////////////////////////////////
+
+
+ ///////////////////////////////////////////////////////////////////////
+ // Methods
+ ///////////////////////////////////////////////////////////////////////
+ // duplcate method requirde
+ this.dup = function( world )
+ {
+ // allocate a new uber material
+ var newMat = new DeformMaterial();
+
+ // copy over the current values;
+ var propNames = [], propValues = [], propTypes = [], propLabels = [];
+ this.getAllProperties( propNames, propValues, propTypes, propLabels);
+ var n = propNames.length;
+ for (var i=0; i<n; i++)
+ newMat.setProperty( propNames[i], propValues[i] );
+
+ return newMat;
+ }
+
+ this.init = function( world )
+ {
+ // save the world
+ if (world) this.setWorld( world );
+
+ // set up the shader
+ this._shader = new jshader();
+ this._shader.def = deformMaterialDef;
+ this._shader.init();
+
+ // set up the material node
+ this._materialNode = createMaterialNode("deformMaterial");
+ this._materialNode.setShader(this._shader);
+
+ this._time = 0;
+ if (this._shader && this._shader.default)
+ this._shader.default.u_time.set( [this._time] );
+
+ // set the shader values in the shader
+ this.updateTexture();
+ this.setResolution( [world.getViewportWidth(),world.getViewportHeight()] );
+ this.update( 0 );
+ }
+}
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var deformMaterialDef =
+{'shaders':
+ {
+ 'defaultVShader':"assets/shaders/Basic.vert.glsl",
+ 'defaultFShader':"assets/shaders/Deform.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_resolution' : { 'type' : 'vec2' },
+ },
+
+ // render states
+ 'states' :
+ {
+ 'depthEnable' : true,
+ 'offset':[1.0, 0.1]
+ },
+ },
+ ]
+ }
+};
+
+
+
+
diff --git a/js/helper-classes/RDGE/Materials/FlyMaterial.js b/js/helper-classes/RDGE/Materials/FlyMaterial.js
new file mode 100644
index 00000000..ca07ce85
--- /dev/null
+++ b/js/helper-classes/RDGE/Materials/FlyMaterial.js
@@ -0,0 +1,133 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+
+///////////////////////////////////////////////////////////////////////
+// Class GLMaterial
+// RDGE representation of a material.
+///////////////////////////////////////////////////////////////////////
+function FlyMaterial()
+{
+ // initialize the inherited members
+ this.inheritedFrom = PulseMaterial;
+ this.inheritedFrom();
+
+ ///////////////////////////////////////////////////////////////////////
+ // Instance variables
+ ///////////////////////////////////////////////////////////////////////
+ this._name = "FlyMaterial";
+ this._shaderName = "tunnel";
+
+ this._texMap = 'assets/images/rocky-normal.jpg';
+
+ this._time = 0.0;
+ this._dTime = 0.01;
+
+ ///////////////////////////////////////////////////////////////////////
+ // Properties
+ ///////////////////////////////////////////////////////////////////////
+ // all defined in parent PulseMaterial.js
+ // load the local default value
+ this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+
+ ///////////////////////////////////////////////////////////////////////
+ // Material Property Accessors
+ ///////////////////////////////////////////////////////////////////////
+
+ ///////////////////////////////////////////////////////////////////////
+
+
+ ///////////////////////////////////////////////////////////////////////
+ // Methods
+ ///////////////////////////////////////////////////////////////////////
+ // duplcate method requirde
+ this.dup = function( world )
+ {
+ // allocate a new uber material
+ var newMat = new FlyMaterial();
+
+ // copy over the current values;
+ var propNames = [], propValues = [], propTypes = [], propLabels = [];
+ this.getAllProperties( propNames, propValues, propTypes, propLabels);
+ var n = propNames.length;
+ for (var i=0; i<n; i++)
+ newMat.setProperty( propNames[i], propValues[i] );
+
+ return newMat;
+ }
+
+ this.init = function( world )
+ {
+ // save the world
+ if (world) this.setWorld( world );
+
+ // set up the shader
+ this._shader = new jshader();
+ this._shader.def = flyMaterialDef;
+ this._shader.init();
+
+ // set up the material node
+ this._materialNode = createMaterialNode("flyMaterial");
+ this._materialNode.setShader(this._shader);
+
+ this._time = 0;
+ if (this._shader && this._shader.default)
+ this._shader.default.u_time.set( [this._time] );
+
+ // set the shader values in the shader
+ this.updateTexture();
+ this.setResolution( [world.getViewportWidth(),world.getViewportHeight()] );
+ this.update( 0 );
+ }
+}
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var flyMaterialDef =
+{'shaders':
+ {
+ 'defaultVShader':"assets/shaders/Basic.vert.glsl",
+ 'defaultFShader':"assets/shaders/Fly.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_resolution' : { 'type' : 'vec2' },
+ },
+
+ // render states
+ 'states' :
+ {
+ 'depthEnable' : true,
+ 'offset':[1.0, 0.1]
+ },
+ },
+ ]
+ }
+};
+
+
+
+
diff --git a/js/helper-classes/RDGE/Materials/ReliefTunnelMaterial.js b/js/helper-classes/RDGE/Materials/ReliefTunnelMaterial.js
new file mode 100644
index 00000000..c5c0b9a7
--- /dev/null
+++ b/js/helper-classes/RDGE/Materials/ReliefTunnelMaterial.js
@@ -0,0 +1,133 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+
+///////////////////////////////////////////////////////////////////////
+// Class GLMaterial
+// RDGE representation of a material.
+///////////////////////////////////////////////////////////////////////
+function ReliefTunnelMaterial()
+{
+ // initialize the inherited members
+ this.inheritedFrom = PulseMaterial;
+ this.inheritedFrom();
+
+ ///////////////////////////////////////////////////////////////////////
+ // Instance variables
+ ///////////////////////////////////////////////////////////////////////
+ this._name = "ReliefTunnelMaterial";
+ this._shaderName = "tunnel";
+
+ this._texMap = 'assets/images/rocky-normal.jpg';
+
+ this._time = 0.0;
+ this._dTime = 0.01;
+
+ ///////////////////////////////////////////////////////////////////////
+ // Properties
+ ///////////////////////////////////////////////////////////////////////
+ // all defined in parent PulseMaterial.js
+ // load the local default value
+ this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+
+ ///////////////////////////////////////////////////////////////////////
+ // Material Property Accessors
+ ///////////////////////////////////////////////////////////////////////
+
+ ///////////////////////////////////////////////////////////////////////
+
+
+ ///////////////////////////////////////////////////////////////////////
+ // Methods
+ ///////////////////////////////////////////////////////////////////////
+ // duplcate method requirde
+ this.dup = function( world )
+ {
+ // allocate a new uber material
+ var newMat = new ReliefTunnelMaterial();
+
+ // copy over the current values;
+ var propNames = [], propValues = [], propTypes = [], propLabels = [];
+ this.getAllProperties( propNames, propValues, propTypes, propLabels);
+ var n = propNames.length;
+ for (var i=0; i<n; i++)
+ newMat.setProperty( propNames[i], propValues[i] );
+
+ return newMat;
+ }
+
+ this.init = function( world )
+ {
+ // save the world
+ if (world) this.setWorld( world );
+
+ // set up the shader
+ this._shader = new jshader();
+ this._shader.def = reliefTunnelMaterialDef;
+ this._shader.init();
+
+ // set up the material node
+ this._materialNode = createMaterialNode("reliefTunnelMaterial");
+ this._materialNode.setShader(this._shader);
+
+ this._time = 0;
+ if (this._shader && this._shader.default)
+ this._shader.default.u_time.set( [this._time] );
+
+ // set the shader values in the shader
+ this.updateTexture();
+ this.setResolution( [world.getViewportWidth(),world.getViewportHeight()] );
+ this.update( 0 );
+ }
+}
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var reliefTunnelMaterialDef =
+{'shaders':
+ {
+ 'defaultVShader':"assets/shaders/Basic.vert.glsl",
+ 'defaultFShader':"assets/shaders/ReliefTunnel.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_resolution' : { 'type' : 'vec2' },
+ },
+
+ // render states
+ 'states' :
+ {
+ 'depthEnable' : true,
+ 'offset':[1.0, 0.1]
+ },
+ },
+ ]
+ }
+};
+
+
+
+
diff --git a/js/helper-classes/RDGE/Materials/SquareTunnelMaterial.js b/js/helper-classes/RDGE/Materials/SquareTunnelMaterial.js
new file mode 100644
index 00000000..41a46429
--- /dev/null
+++ b/js/helper-classes/RDGE/Materials/SquareTunnelMaterial.js
@@ -0,0 +1,133 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+
+///////////////////////////////////////////////////////////////////////
+// Class GLMaterial
+// RDGE representation of a material.
+///////////////////////////////////////////////////////////////////////
+function SquareTunnelMaterial()
+{
+ // initialize the inherited members
+ this.inheritedFrom = PulseMaterial;
+ this.inheritedFrom();
+
+ ///////////////////////////////////////////////////////////////////////
+ // Instance variables
+ ///////////////////////////////////////////////////////////////////////
+ this._name = "SquareTunnelMaterial";
+ this._shaderName = "tunnel";
+
+ this._texMap = 'assets/images/rocky-normal.jpg';
+
+ this._time = 0.0;
+ this._dTime = 0.01;
+
+ ///////////////////////////////////////////////////////////////////////
+ // Properties
+ ///////////////////////////////////////////////////////////////////////
+ // all defined in parent PulseMaterial.js
+ // load the local default value
+ this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+
+ ///////////////////////////////////////////////////////////////////////
+ // Material Property Accessors
+ ///////////////////////////////////////////////////////////////////////
+
+ ///////////////////////////////////////////////////////////////////////
+
+
+ ///////////////////////////////////////////////////////////////////////
+ // Methods
+ ///////////////////////////////////////////////////////////////////////
+ // duplcate method requirde
+ this.dup = function( world )
+ {
+ // allocate a new uber material
+ var newMat = new SquareTunnelMaterial();
+
+ // copy over the current values;
+ var propNames = [], propValues = [], propTypes = [], propLabels = [];
+ this.getAllProperties( propNames, propValues, propTypes, propLabels);
+ var n = propNames.length;
+ for (var i=0; i<n; i++)
+ newMat.setProperty( propNames[i], propValues[i] );
+
+ return newMat;
+ }
+
+ this.init = function( world )
+ {
+ // save the world
+ if (world) this.setWorld( world );
+
+ // set up the shader
+ this._shader = new jshader();
+ this._shader.def = squareTunnelMaterialDef;
+ this._shader.init();
+
+ // set up the material node
+ this._materialNode = createMaterialNode("squareTunnelMaterial");
+ this._materialNode.setShader(this._shader);
+
+ this._time = 0;
+ if (this._shader && this._shader.default)
+ this._shader.default.u_time.set( [this._time] );
+
+ // set the shader values in the shader
+ this.updateTexture();
+ this.setResolution( [world.getViewportWidth(),world.getViewportHeight()] );
+ this.update( 0 );
+ }
+}
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var squareTunnelMaterialDef =
+{'shaders':
+ {
+ 'defaultVShader':"assets/shaders/Basic.vert.glsl",
+ 'defaultFShader':"assets/shaders/SquareTunnel.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_resolution' : { 'type' : 'vec2' },
+ },
+
+ // render states
+ 'states' :
+ {
+ 'depthEnable' : true,
+ 'offset':[1.0, 0.1]
+ },
+ },
+ ]
+ }
+};
+
+
+
+
diff --git a/js/helper-classes/RDGE/Materials/StarMaterial.js b/js/helper-classes/RDGE/Materials/StarMaterial.js
new file mode 100644
index 00000000..a5f188a1
--- /dev/null
+++ b/js/helper-classes/RDGE/Materials/StarMaterial.js
@@ -0,0 +1,133 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+
+///////////////////////////////////////////////////////////////////////
+// Class GLMaterial
+// RDGE representation of a material.
+///////////////////////////////////////////////////////////////////////
+function StarMaterial()
+{
+ // initialize the inherited members
+ this.inheritedFrom = PulseMaterial;
+ this.inheritedFrom();
+
+ ///////////////////////////////////////////////////////////////////////
+ // Instance variables
+ ///////////////////////////////////////////////////////////////////////
+ this._name = "StarMaterial";
+ this._shaderName = "star";
+
+ this._texMap = 'assets/images/rocky-normal.jpg';
+
+ this._time = 0.0;
+ this._dTime = 0.01;
+
+ ///////////////////////////////////////////////////////////////////////
+ // Properties
+ ///////////////////////////////////////////////////////////////////////
+ // all defined in parent PulseMaterial.js
+ // load the local default value
+ this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+
+ ///////////////////////////////////////////////////////////////////////
+ // Material Property Accessors
+ ///////////////////////////////////////////////////////////////////////
+
+ ///////////////////////////////////////////////////////////////////////
+
+
+ ///////////////////////////////////////////////////////////////////////
+ // Methods
+ ///////////////////////////////////////////////////////////////////////
+ // duplcate method requirde
+ this.dup = function( world )
+ {
+ // allocate a new uber material
+ var newMat = new StarMaterial();
+
+ // copy over the current values;
+ var propNames = [], propValues = [], propTypes = [], propLabels = [];
+ this.getAllProperties( propNames, propValues, propTypes, propLabels);
+ var n = propNames.length;
+ for (var i=0; i<n; i++)
+ newMat.setProperty( propNames[i], propValues[i] );
+
+ return newMat;
+ }
+
+ this.init = function( world )
+ {
+ // save the world
+ if (world) this.setWorld( world );
+
+ // set up the shader
+ this._shader = new jshader();
+ this._shader.def = starMaterialDef;
+ this._shader.init();
+
+ // set up the material node
+ this._materialNode = createMaterialNode("starMaterial");
+ this._materialNode.setShader(this._shader);
+
+ this._time = 0;
+ if (this._shader && this._shader.default)
+ this._shader.default.u_time.set( [this._time] );
+
+ // set the shader values in the shader
+ this.updateTexture();
+ this.setResolution( [world.getViewportWidth(),world.getViewportHeight()] );
+ this.update( 0 );
+ }
+}
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var starMaterialDef =
+{'shaders':
+ {
+ 'defaultVShader':"assets/shaders/Basic.vert.glsl",
+ 'defaultFShader':"assets/shaders/Star.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_resolution' : { 'type' : 'vec2' },
+ },
+
+ // render states
+ 'states' :
+ {
+ 'depthEnable' : true,
+ 'offset':[1.0, 0.1]
+ },
+ },
+ ]
+ }
+};
+
+
+
+
diff --git a/js/helper-classes/RDGE/Materials/WaterMaterial.js b/js/helper-classes/RDGE/Materials/WaterMaterial.js
new file mode 100644
index 00000000..e6b9a8c7
--- /dev/null
+++ b/js/helper-classes/RDGE/Materials/WaterMaterial.js
@@ -0,0 +1,133 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+
+///////////////////////////////////////////////////////////////////////
+// Class GLMaterial
+// RDGE representation of a material.
+///////////////////////////////////////////////////////////////////////
+function WaterMaterial()
+{
+ // initialize the inherited members
+ this.inheritedFrom = PulseMaterial;
+ this.inheritedFrom();
+
+ ///////////////////////////////////////////////////////////////////////
+ // Instance variables
+ ///////////////////////////////////////////////////////////////////////
+ this._name = "WaterMaterial";
+ this._shaderName = "water";
+
+ this._texMap = 'assets/images/rocky-normal.jpg';
+
+ this._time = 0.0;
+ this._dTime = 0.01;
+
+ ///////////////////////////////////////////////////////////////////////
+ // Properties
+ ///////////////////////////////////////////////////////////////////////
+ // all defined in parent PulseMaterial.js
+ // load the local default value
+ this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+
+ ///////////////////////////////////////////////////////////////////////
+ // Material Property Accessors
+ ///////////////////////////////////////////////////////////////////////
+
+ ///////////////////////////////////////////////////////////////////////
+
+
+ ///////////////////////////////////////////////////////////////////////
+ // Methods
+ ///////////////////////////////////////////////////////////////////////
+ // duplcate method requirde
+ this.dup = function( world )
+ {
+ // allocate a new uber material
+ var newMat = new WaterMaterial();
+
+ // copy over the current values;
+ var propNames = [], propValues = [], propTypes = [], propLabels = [];
+ this.getAllProperties( propNames, propValues, propTypes, propLabels);
+ var n = propNames.length;
+ for (var i=0; i<n; i++)
+ newMat.setProperty( propNames[i], propValues[i] );
+
+ return newMat;
+ }
+
+ this.init = function( world )
+ {
+ // save the world
+ if (world) this.setWorld( world );
+
+ // set up the shader
+ this._shader = new jshader();
+ this._shader.def = waterMaterialDef;
+ this._shader.init();
+
+ // set up the material node
+ this._materialNode = createMaterialNode("waterMaterial");
+ this._materialNode.setShader(this._shader);
+
+ this._time = 0;
+ if (this._shader && this._shader.default)
+ this._shader.default.u_time.set( [this._time] );
+
+ // set the shader values in the shader
+ this.updateTexture();
+ this.setResolution( [world.getViewportWidth(),world.getViewportHeight()] );
+ this.update( 0 );
+ }
+}
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var waterMaterialDef =
+{'shaders':
+ {
+ 'defaultVShader':"assets/shaders/Basic.vert.glsl",
+ 'defaultFShader':"assets/shaders/Water.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_resolution' : { 'type' : 'vec2' },
+ },
+
+ // render states
+ 'states' :
+ {
+ 'depthEnable' : true,
+ 'offset':[1.0, 0.1]
+ },
+ },
+ ]
+ }
+};
+
+
+
+
diff --git a/js/helper-classes/RDGE/Materials/ZInvertMaterial.js b/js/helper-classes/RDGE/Materials/ZInvertMaterial.js
new file mode 100644
index 00000000..2ac8920f
--- /dev/null
+++ b/js/helper-classes/RDGE/Materials/ZInvertMaterial.js
@@ -0,0 +1,133 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+
+///////////////////////////////////////////////////////////////////////
+// Class GLMaterial
+// RDGE representation of a material.
+///////////////////////////////////////////////////////////////////////
+function ZInvertMaterial()
+{
+ // initialize the inherited members
+ this.inheritedFrom = PulseMaterial;
+ this.inheritedFrom();
+
+ ///////////////////////////////////////////////////////////////////////
+ // Instance variables
+ ///////////////////////////////////////////////////////////////////////
+ this._name = "ZInvertMaterial";
+ this._shaderName = "zinvert";
+
+ this._texMap = 'assets/images/rocky-normal.jpg';
+
+ this._time = 0.0;
+ this._dTime = 0.01;
+
+ ///////////////////////////////////////////////////////////////////////
+ // Properties
+ ///////////////////////////////////////////////////////////////////////
+ // all defined in parent PulseMaterial.js
+ // load the local default value
+ this._propValues[ this._propNames[0] ] = this._texMap.slice(0);
+
+ ///////////////////////////////////////////////////////////////////////
+ // Material Property Accessors
+ ///////////////////////////////////////////////////////////////////////
+
+ ///////////////////////////////////////////////////////////////////////
+
+
+ ///////////////////////////////////////////////////////////////////////
+ // Methods
+ ///////////////////////////////////////////////////////////////////////
+ // duplcate method requirde
+ this.dup = function( world )
+ {
+ // allocate a new uber material
+ var newMat = new ZInvertMaterial();
+
+ // copy over the current values;
+ var propNames = [], propValues = [], propTypes = [], propLabels = [];
+ this.getAllProperties( propNames, propValues, propTypes, propLabels);
+ var n = propNames.length;
+ for (var i=0; i<n; i++)
+ newMat.setProperty( propNames[i], propValues[i] );
+
+ return newMat;
+ }
+
+ this.init = function( world )
+ {
+ // save the world
+ if (world) this.setWorld( world );
+
+ // set up the shader
+ this._shader = new jshader();
+ this._shader.def = zInvertMaterialDef;
+ this._shader.init();
+
+ // set up the material node
+ this._materialNode = createMaterialNode("zInvertMaterial");
+ this._materialNode.setShader(this._shader);
+
+ this._time = 0;
+ if (this._shader && this._shader.default)
+ this._shader.default.u_time.set( [this._time] );
+
+ // set the shader values in the shader
+ this.updateTexture();
+ this.setResolution( [world.getViewportWidth(),world.getViewportHeight()] );
+ this.update( 0 );
+ }
+}
+
+///////////////////////////////////////////////////////////////////////////////////////
+// RDGE shader
+
+// shader spec (can also be loaded from a .JSON file, or constructed at runtime)
+var zInvertMaterialDef =
+{'shaders':
+ {
+ 'defaultVShader':"assets/shaders/Basic.vert.glsl",
+ 'defaultFShader':"assets/shaders/ZInvert.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_resolution' : { 'type' : 'vec2' },
+ },
+
+ // render states
+ 'states' :
+ {
+ 'depthEnable' : true,
+ 'offset':[1.0, 0.1]
+ },
+ },
+ ]
+ }
+};
+
+
+
+
diff --git a/js/helper-classes/RDGE/MaterialsLibrary.js b/js/helper-classes/RDGE/MaterialsLibrary.js
index 5f82a996..19204470 100644
--- a/js/helper-classes/RDGE/MaterialsLibrary.js
+++ b/js/helper-classes/RDGE/MaterialsLibrary.js
@@ -136,6 +136,13 @@ var MaterialsLibrary = Object.create(Object.prototype, {
case "radialBlur": mat = new RadiaBlurMaterial(); break;
case "pulse": mat = new PulseMaterial(); break;
case "tunnel": mat = new TunnelMaterial(); break;
+ case "reliefTunnel": mat = new ReliefTunnelMaterial(); break;
+ case "squareTunnel": mat = new SquareTunnelMaterial(); break;
+ case "fly": mat = new FlyMaterial(); break;
+ case "water": mat = new WaterMaterial(); break;
+ case "zInvert": mat = new ZInvertMaterial(); break;
+ case "deform": mat = new DeformMaterial(); break;
+ case "star": mat = new StarMaterial(); break;
case "twist": mat = new TwistMaterial(); break;
case "keleidoscope": mat = new KeleidoscopeMaterial(); break;
case "julia": mat = new JuliaMaterial(); break;
@@ -175,6 +182,13 @@ var radialGradientMaterial = new RadialGradientMaterial();
var radialBlurMaterial = new RadialBlurMaterial();
var pulseMaterial = new PulseMaterial();
var tunnelMaterial = new TunnelMaterial();
+var reliefTunnelMaterial = new ReliefTunnelMaterial();
+var squareTunnelMaterial = new SquareTunnelMaterial();
+var flyMaterial = new FlyMaterial();
+var waterMaterial = new WaterMaterial();
+var zInvertMaterial = new ZInvertMaterial();
+var deformMaterial = new DeformMaterial();
+var starMaterial = new StarMaterial();
var twistMaterial = new TwistMaterial();
var keleidoscopeMaterial = new KeleidoscopeMaterial();
var juliaMaterial = new JuliaMaterial();
@@ -187,6 +201,13 @@ MaterialsLibrary.addMaterial(radialGradientMaterial);
MaterialsLibrary.addMaterial(radialBlurMaterial);
MaterialsLibrary.addMaterial(pulseMaterial);
MaterialsLibrary.addMaterial(tunnelMaterial);
+MaterialsLibrary.addMaterial(reliefTunnelMaterial);
+MaterialsLibrary.addMaterial(squareTunnelMaterial);
+MaterialsLibrary.addMaterial(flyMaterial);
+MaterialsLibrary.addMaterial(waterMaterial);
+MaterialsLibrary.addMaterial(zInvertMaterial);
+MaterialsLibrary.addMaterial(deformMaterial);
+MaterialsLibrary.addMaterial(starMaterial);
MaterialsLibrary.addMaterial(twistMaterial);
MaterialsLibrary.addMaterial(keleidoscopeMaterial);
MaterialsLibrary.addMaterial(juliaMaterial);
diff --git a/js/panels/Materials/Materials.xml b/js/panels/Materials/Materials.xml
index cdeee69e..7d10fcfa 100644
--- a/js/panels/Materials/Materials.xml
+++ b/js/panels/Materials/Materials.xml
@@ -5,6 +5,13 @@
<leaf id="RadialBlurMaterial" label="Radial Blur" />
<leaf id="PulseMaterial" label="Pulse" />
<leaf id="TunnelMaterial" label="Tunnel" />
+ <leaf id="ReliefTunnelMaterial" label="Relief Tunnel" />
+ <leaf id="SquareTunnelMaterial" label="Square Tunnel" />
+ <leaf id="FlyMaterial" label="Fly" />
+ <leaf id="WaterMaterial" label="Water" />
+ <leaf id="ZInvertMaterial" label="ZInvert" />
+ <leaf id="DeformMaterial" label="Deform" />
+ <leaf id="StarMaterial" label="Star" />
<leaf id="TwistMaterial" label="Twist" />
<leaf id="KeleidoscopeMaterial" label="Keleidoscope" />
<leaf id="JuliaMaterial" label="Julia" />
diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.js b/js/panels/Materials/materials-popup.reel/materials-popup.js
index afdc3628..bce2e42b 100644
--- a/js/panels/Materials/materials-popup.reel/materials-popup.js
+++ b/js/panels/Materials/materials-popup.reel/materials-popup.js
@@ -246,6 +246,13 @@ exports.MaterialsPopup = Montage.create(Component, {
(materialID === "RadialBlurMaterial") ||
(materialID === "PulseMaterial") ||
(materialID === "TunnelMaterial") ||
+ (materialID === "ReliefTunnelMaterial") ||
+ (materialID === "SquareTunnelMaterial") ||
+ (materialID === "FlyMaterial") ||
+ (materialID === "WaterMaterial") ||
+ (materialID === "ZInvertMaterial") ||
+ (materialID === "DeformMaterial") ||
+ (materialID === "StarMaterial") ||
(materialID === "TwistMaterial") ||
(materialID === "KeleidoscopeMaterial") ||
(materialID === "JuliaMaterial") ||
diff --git a/js/preloader/Preloader.js b/js/preloader/Preloader.js
index 3daeb1b4..12028e32 100755
--- a/js/preloader/Preloader.js
+++ b/js/preloader/Preloader.js
@@ -70,6 +70,13 @@ exports.Preloader = Montage.create(Component, {
{"type":"js", "url":"js/helper-classes/RDGE/Materials/RadialBlurMaterial.js"},
{"type":"js", "url":"js/helper-classes/RDGE/Materials/PulseMaterial.js"},
{"type":"js", "url":"js/helper-classes/RDGE/Materials/TunnelMaterial.js"},
+ {"type":"js", "url":"js/helper-classes/RDGE/Materials/ReliefTunnelMaterial.js"},
+ {"type":"js", "url":"js/helper-classes/RDGE/Materials/SquareTunnelMaterial.js"},
+ {"type":"js", "url":"js/helper-classes/RDGE/Materials/FlyMaterial.js"},
+ {"type":"js", "url":"js/helper-classes/RDGE/Materials/WaterMaterial.js"},
+ {"type":"js", "url":"js/helper-classes/RDGE/Materials/ZInvertMaterial.js"},
+ {"type":"js", "url":"js/helper-classes/RDGE/Materials/DeformMaterial.js"},
+ {"type":"js", "url":"js/helper-classes/RDGE/Materials/StarMaterial.js"},
{"type":"js", "url":"js/helper-classes/RDGE/Materials/TwistMaterial.js"},
{"type":"js", "url":"js/helper-classes/RDGE/Materials/KeleidoscopeMaterial.js"},
{"type":"js", "url":"js/helper-classes/RDGE/Materials/JuliaMaterial.js"},
--
cgit v1.2.3
From 4ebae7378608750192f8d3bb392a54222ca0ec2f Mon Sep 17 00:00:00 2001
From: hwc487
Date: Thu, 2 Feb 2012 13:56:25 -0800
Subject: Added the 'animate' flag to the pulse material
---
js/helper-classes/RDGE/Materials/RadialBlurMaterial.js | 2 ++
1 file changed, 2 insertions(+)
diff --git a/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js b/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js
index 9acb4213..732800cf 100644
--- a/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js
+++ b/js/helper-classes/RDGE/Materials/RadialBlurMaterial.js
@@ -37,6 +37,8 @@ function RadialBlurMaterial()
this.getTextureMap = function() { return this._texMap.slice(0); }
this.setTextureMap = function(m) { this._propValues[this._propNames[0]] = m.slice(0); this.updateTexture(); }
+ this.isAnimated = function() { return true; }
+
///////////////////////////////////////////////////////////////////////
// Material Property Accessors
///////////////////////////////////////////////////////////////////////
--
cgit v1.2.3
From 2082fa6912eec2ffabd2081b7706e8e1b88a9711 Mon Sep 17 00:00:00 2001
From: Armen Kesablyan
Date: Thu, 2 Feb 2012 19:03:59 -0800
Subject: Initial Text Tool Implementation
Has rich-text-editor in place need to place with finalized version when complete
---
_scss/compass_app_log.txt | 7 +
_scss/imports/scss/_Stage.scss | 14 +
css/ninja.css | 4 +
js/panels/CSSPanel/CSSPanel.js | 6 +-
js/stage/stage.reel/stage.html | 12 +-
js/stage/stage.reel/stage.js | 7 +
js/tools/TextTool.js | 96 +-
.../ui/rich-text-editor.reel/rich-text-editor.css | 112 ++
.../ui/rich-text-editor.reel/rich-text-editor.html | 27 +
.../ui/rich-text-editor.reel/rich-text-editor.js | 1669 ++++++++++++++++++++
.../ui/rich-text-editor.reel/rich-text-resizer.js | 349 ++++
.../rich-text-editor.reel/rich-text-sanitizer.js | 132 ++
12 files changed, 2425 insertions(+), 10 deletions(-)
create mode 100644 node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.css
create mode 100644 node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.html
create mode 100644 node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.js
create mode 100644 node_modules/montage/ui/rich-text-editor.reel/rich-text-resizer.js
create mode 100644 node_modules/montage/ui/rich-text-editor.reel/rich-text-sanitizer.js
diff --git a/_scss/compass_app_log.txt b/_scss/compass_app_log.txt
index 6fe64a6f..d28e1e77 100644
--- a/_scss/compass_app_log.txt
+++ b/_scss/compass_app_log.txt
@@ -93,3 +93,10 @@
2012-01-20 15:16:38 overwrite ../css/ninja.css
2012-01-20 15:17:03 overwrite ../css/ninja.css
2012-01-20 15:17:39 overwrite ../css/ninja.css
+2012-01-30 16:28:54 overwrite ../css/ninja.css
+2012-01-30 16:29:04 overwrite ../css/ninja.css
+2012-01-30 16:33:31 overwrite ../css/ninja.css
+2012-01-30 17:18:02 overwrite ../css/ninja.css
+2012-01-30 18:28:44 overwrite ../css/ninja.css
+2012-02-02 17:20:26 overwrite ../css/ninja.css
+2012-02-02 17:20:31 identical ../css/ninja.css
diff --git a/_scss/imports/scss/_Stage.scss b/_scss/imports/scss/_Stage.scss
index a992b793..09dae3d6 100644
--- a/_scss/imports/scss/_Stage.scss
+++ b/_scss/imports/scss/_Stage.scss
@@ -192,3 +192,17 @@
overflow-x: auto;
overflow-y: auto;
}
+.montage-editor-frame {
+ position:absolute;
+ z-index:7;
+ top: 0;
+ left:0;
+ display:none;
+ -webkit-user-select: initial;
+}
+.montage-editor {
+ padding:0px;
+ word-wrap: normal;
+
+
+ }
\ No newline at end of file
diff --git a/css/ninja.css b/css/ninja.css
index 2fcb1380..7bc4c80e 100644
--- a/css/ninja.css
+++ b/css/ninja.css
@@ -271,6 +271,10 @@ background: transparent;
#mainContent .CodeMirror-scroll { height: 100%; overflow: scroll; overflow-x: auto; overflow-y: auto; }
+.montage-editor-frame { position: absolute; z-index: 7; top: 0; left: 0; display: none; -webkit-user-select: initial; }
+
+.montage-editor { padding: 0px; word-wrap: normal; }
+
/* PanelUI.scss Styles governing the panels in the UI. Note that colors and font definitions go in _scss/themes/themename/_colors.scss and _scss/themes/themename/_fonts.scss */
/* layout for the container of all panels within a dock area */
.panelContainer { margin: 0px; padding: 0px 0px; position: relative; /*
diff --git a/js/panels/CSSPanel/CSSPanel.js b/js/panels/CSSPanel/CSSPanel.js
index 94860b30..cf8880a3 100644
--- a/js/panels/CSSPanel/CSSPanel.js
+++ b/js/panels/CSSPanel/CSSPanel.js
@@ -20,9 +20,9 @@ exports.CSSPanel = Montage.create(PanelBase, {
init : {
enumerable:true,
value : function (){
- this.minHeight = 300;
- this.contentHeight = 300;
- this.defaultHeight= 300;
+ this.minHeight = 195;
+ this.contentHeight = 195;
+ this.defaultHeight= 195;
/* OLD WAY -- Removing the temporary div
// TODO: Remove this comment once this is tested.
diff --git a/js/stage/stage.reel/stage.html b/js/stage/stage.reel/stage.html
index 49d10baf..07b823a7 100644
--- a/js/stage/stage.reel/stage.html
+++ b/js/stage/stage.reel/stage.html
@@ -34,6 +34,14 @@
}
}
},
+
+ "textTool": {
+ "module": "montage/ui/rich-text-editor.reel",
+ "name": "RichTextEditor",
+ "properties": {
+ "element" : {"#": "textToolObject"}
+ }
+ },
"owner": {
"module": "js/stage/stage.reel",
@@ -46,7 +54,8 @@
"_canvas": {"#": "stageCanvas"},
"_drawingCanvas": {"#": "drawingCanvas"},
"stageDeps": {"@": "StageDeps1"},
- "layout": {"@": "layout1"}
+ "layout": {"@": "layout1"},
+ "textTool": {"@": "textTool"}
},
"bindings": {
"currentDocumentStageView": {
@@ -64,6 +73,7 @@
<section id="stageAndScenesContainer" class="stageAndScenesContainer">
<section id="iframeContainer"></section>
+ <section id="textToolObject">asdasd asd asd asd asd asd </section>
<section id="codeViewContainer"></section>
<canvas id="layoutCanvas"></canvas>
<canvas id="stageCanvas"></canvas>
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 3e0b852e..96bfccdd 100644
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -12,6 +12,7 @@ var vecUtils = require("js/helper-classes/3D/vec-utils").VecUtils;
exports.Stage = Montage.create(Component, {
+ textTool: { value: null },
// TODO - Need to figure out how to remove this dependency
// Needed by some tools that depend on selectionDrawn event to set up some logic
drawNow: { value : false },
@@ -780,6 +781,12 @@ exports.Stage = Montage.create(Component, {
}
},
+ toViewportCoordinates: {
+ value: function(x,y) {
+ return [x + this._userContentLeft, y + this._userContentTop];
+ }
+ },
+
setZoom: {
value: function(value) {
if(!this._firstDraw)
diff --git a/js/tools/TextTool.js b/js/tools/TextTool.js
index 538583ee..8b48ff4f 100644
--- a/js/tools/TextTool.js
+++ b/js/tools/TextTool.js
@@ -6,12 +6,30 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
var Montage = require("montage/core/core").Montage,
DrawingTool = require("js/tools/drawing-tool").DrawingTool;
+ RichTextEditor = require("montage/ui/rich-text-editor.reel").RichTextEditor;
exports.TextTool = Montage.create(DrawingTool, {
+
+ _selectedElement: { value : null },
+
+ selectedElement: {
+ get: function() {
+ return this._selectedElement;
+ },
+ set: function(val) {
+ if(this._selectedElement !== null) {
+
+ }
+ this._selectedElement = val;
+ }
+ },
+
+
drawingFeedback: { value: { mode: "Draw3D", type: "rectangle" } },
HandleLeftButtonDown: {
value: function(event) {
+ this.deselectText();
this.startDraw(event);
}
},
@@ -50,24 +68,88 @@ exports.TextTool = Montage.create(DrawingTool, {
if(drawData) {
//this.insertElement(drawData);
}
-
+
this._hasDraw = false;
this.endDraw(event);
} else {
-
this.doSelection(event);
+ console.log("im here");
+ if (this.application.ninja.selectedElements.length !== 0 ) {
+ this.selectedElement = this.application.ninja.selectedElements[0]._element;
+ this.drawTextTool();
+ }
this._isDrawing = false;
}
}
},
+ applyElementStyles : {
+ value: function(fromElement, toElement, styles) {
+ styles.forEach(function(style) {
+ var styleCamelCase = style.replace(/(\-[a-z])/g, function($1){return $1.toUpperCase().replace('-','');});
+ console.log(styleCamelCase, style, window.getComputedStyle(fromElement)[style]);
+ toElement.style[styleCamelCase] = window.getComputedStyle(fromElement)[style];
+ }, this);
+ }
+ },
+
+ drawTextTool: {
+ value: function() {
+ console.log(" now im here");
+ this.application.ninja.stage.textTool.value = this.selectedElement.innerHTML;
+ if(this.application.ninja.stage.textTool.value === "") { this.application.ninja.stage.textTool.value = " "; }
+ this.selectedElement.innerHTML = "";
+
+ //Styling Options for text tool to look identical to the text you are manipulating.
+ this.application.ninja.stage.textTool.element.style.display = "block";
+ this.application.ninja.stage.textTool.element.style.position = "absolute";
+
+ // Set Top & Left Positions
+ var textToolCoordinates = this.application.ninja.stage.toViewportCoordinates(this.selectedElement.offsetLeft, this.selectedElement.offsetTop);
+ this.application.ninja.stage.textTool.element.style.left = textToolCoordinates[0] + "px";
+ this.application.ninja.stage.textTool.element.style.top = textToolCoordinates[1] + "px";
+
+ // Set Width, Height
+ this.application.ninja.stage.textTool.element.style.width = this.selectedElement.offsetWidth + "px";
+ this.application.ninja.stage.textTool.element.style.height = this.selectedElement.offsetHeight + "px";
+
+
+ // Set font styling (Size, Style, Weight)
+
+ me = this;
+ this.application.ninja.stage.textTool.didDraw = function() {
+ me.applyElementStyles(me.selectedElement, me.application.ninja.stage.textTool.element, ["overflow"]);
+ me.applyElementStyles(me.selectedElement, me.application.ninja.stage.textTool.element.firstChild, ["font","padding-left","padding-top","padding-right","padding-bottom", "color"]);
+ var range = document.createRange(),
+ sel = window.getSelection();
+ sel.removeAllRanges();
+ range.selectNodeContents(this.application.ninja.stage.textTool.element.firstChild);
+ sel.addRange(range);
+ this.didDraw = function() {};
+ console.log("im drew here");
+ }
+ console.log("i end here");
+ }
+ },
+
+
+ deselectText: {
+ value: function() {
+ this.application.ninja.stage.textTool.element.style.display = "none";
+ this.selectedElement.innerHTML = this.application.ninja.stage.textTool.value;
+ this.application.ninja.stage.textTool.value = "";
+ }
+ },
+
HandleDoubleClick: {
value: function(e) {
- console.log(this.application.ninja.selectedElements[0]._element);
- this.application.ninja.selectedElements[0]._element.setAttribute("contenteditable", true);
- this.application.ninja.stage._iframeContainer.style.zIndex = 200;
- this.application.ninja.selectedElements[0]._element.focus();
+ //this.application.ninja.selectedElements[0]._element.setAttribute("contenteditable", true);
+
+ //if (!this.application.ninja.textTool) {
+
+ //}
+
}
@@ -75,10 +157,12 @@ exports.TextTool = Montage.create(DrawingTool, {
Configure: {
value: function(wasSelected) {
+
if(wasSelected) {
NJevent("enableStageMove");
this.application.ninja.stage.stageDeps.snapManager.setupDragPlaneFromPlane( workingPlane );
} else {
+ this.deselectText();
NJevent("disableStageMove");
}
}
diff --git a/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.css b/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.css
new file mode 100644
index 00000000..656183c4
--- /dev/null
+++ b/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.css
@@ -0,0 +1,112 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+.montage-editor {
+ /* need to be relative in order for the resizer to be positioned correctly */
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ padding: 4px;
+
+ font-size: 1.0em;
+ outline: none;
+ overflow: auto;
+ z-index: 1;
+}
+
+.montage-editor-frame {
+ position: relative;
+ overflow: auto;
+ height: 100%;
+ width: 100%;
+}
+
+.montage-resizer-element::selection {
+ background: rgba(0,0,0,0);
+}
+
+
+/*
+Resizer
+*/
+.montage-resizer {
+ display: inline-block;
+}
+
+.montage-resizer-frame {
+ position: absolute;
+ border: 1px solid black;
+ z-index: 30;
+}
+
+.montage-resizer-handle {
+ position: absolute;
+ border: 1px solid black;
+ background-color: white;
+ width: 6px;
+ height: 6px;
+ z-index: 31;
+}
+
+.montage-resizer.dragged .montage-resizer-handle{
+ display: none;
+}
+
+.montage-resizer-handle:hover {
+ background-color: black;
+}
+
+.montage-resizer-n {
+ cursor: n-resize;
+}
+.montage-resizer-ne {
+ cursor: ne-resize;
+}
+.montage-resizer-e {
+ cursor: e-resize;
+}
+.montage-resizer-se {
+ cursor: se-resize;
+}
+.montage-resizer-s {
+ cursor: s-resize;
+}
+.montage-resizer-sw {
+ cursor: sw-resize;
+}
+.montage-resizer-w {
+ cursor: w-resize;
+}
+.montage-resizer-nw {
+ cursor: nw-resize;
+}
+
+
+/*
+Link Popup
+*/
+.montage-link-popup {
+ -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.2);
+ -webkit-border-radius: 2px;
+ border-radius: 2px;
+ position: absolute;
+ border: 1px solid;
+ background-color: white;
+ color: #666;
+ padding: 12px 20px;
+ z-index: 50;
+ cursor: default;
+ border-color: #BBB #BBB #A8A8A8;
+ font: 13px/normal "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+.montage-link-popup a {
+ cursor: pointer;
+ text-decoration: none;
+ color: #15C;
+}
\ No newline at end of file
diff --git a/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.html b/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.html
new file mode 100644
index 00000000..0856043f
--- /dev/null
+++ b/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<!-- <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> -->
+<html>
+<head>
+ <title></title>
+ <link rel="stylesheet" type="text/css" href="rich-text-editor.css">
+ <script type="text/montage-serialization">
+ {
+ "owner": {
+ "module": "montage/ui/rich-text-editor.reel",
+ "name": "RichTextEditor",
+ "properties": {
+
+ }
+ }
+ }
+ </script>
+
+</head>
+<body>
+</body>
+</html>
+
\ No newline at end of file
diff --git a/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.js b/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.js
new file mode 100644
index 00000000..37fb9599
--- /dev/null
+++ b/node_modules/montage/ui/rich-text-editor.reel/rich-text-editor.js
@@ -0,0 +1,1669 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+/**
+ @module "montage/ui/rich-text-editor.reel"
+ @requires montage/core/core
+*/
+var Montage = require("montage").Montage,
+ Component = require("ui/component").Component,
+ MutableEvent = require("core/event/mutable-event").MutableEvent,
+ Resizer = require("./rich-text-resizer").Resizer,
+ Sanitizer = require("./rich-text-sanitizer").Sanitizer,
+ Point = require("core/geometry/point").Point;
+
+/**
+ @class module:"montage/ui/rich-text-editor.reel".RichTextEditor
+ @extends module:montage/ui/component.Component
+*/
+exports.RichTextEditor = Montage.create(Component,/** @lends module:"montage/ui/rich-text-editor.reel".RichTextEditor# */ {
+
+ /**
+ Description TODO
+ @private
+ */
+ _hasSelectionChangeEvent: {
+ enumerable: false,
+ value: null // Need to be preset to null, will be set to true or false later on
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _uniqueId: {
+ enumerable: false,
+ value: Math.floor(Math.random() * 1000) + "-" + Math.floor(Math.random() * 1000)
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _needsSelectionReset: {
+ enumerable: false,
+ value: false
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _selectionChangeTimer: {
+ enumerable: false,
+ value: null
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _activeLink: {
+ enumerable: false,
+ value: null
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _needsActiveLinkOn: {
+ enumerable: false,
+ value: false
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _hasFocus: {
+ enumerable: false,
+ value: false
+ },
+
+ /**
+ Description TODO
+ @type {Function}
+ */
+ hasFocus: {
+ enumerable: true,
+ get: function() {
+ return this._hasFocus;
+ }
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _dirty: {
+ enumerable: false,
+ value: false
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _value: {
+ enumerable: false,
+ value: ""
+ },
+
+ /**
+ Description TODO
+ @type {Function}
+ */
+ value: {
+ enumerable: true,
+ serializable: true,
+ get: function() {
+ var contentNode = this.element.firstChild,
+ content;
+
+ if (this._dirtyValue) {
+ if (this._resizer) {
+ contentNode = this._resizer.cleanup(contentNode);
+ }
+
+ contentNode = this._cleanupActiveLink(contentNode);
+
+ content = contentNode ? contentNode.innerHTML : "";
+ if (content == "<br>") {
+ // when the contentEditable div is emptied, Chrome add a <br>, let's filter it out
+ content = "";
+ }
+ if (this._sanitizer) {
+ content = this._sanitizer.didGetValue(content, this._uniqueId);
+ }
+
+ this._value = content;
+ this._dirtyValue = false;
+ }
+ return this._value;
+ },
+ set: function(value) {
+ if (this._value !== value || this._dirtyValue) {
+ if (this._resizer) {
+ this._needsHideResizer = true;
+ }
+
+ if (this._sanitizer) {
+ value = this._sanitizer.willSetValue(value, this._uniqueId);
+ }
+ this._value = value;
+ this._dirtyValue = false;
+ this._dirtyTextValue = true;
+ this._needsSelectionReset = true;
+ this._needsResetContent = true;
+ this.needsDraw = true;
+ }
+ }
+ },
+
+ /**
+ Description TODO
+ @private
+ */
+ _textValue: {
+ enumerable: false,
+ value: ""
+ },
+
+ /**
+ Description TODO
+ @type {Function}
+ */
+ textValue: {
+ enumerable: true,
+ get: function() {
+ var contentNode = this.element.firstChild,
+ childNodes;
+
+ if (this._dirtyTextValue) {
+ if (contentNode) {
+ if (this._resizer) {
+ contentNode = this._resizer.cleanup(contentNode);
+ }
+ contentNode = this._cleanupActiveLink(contentNode);
+ }
+
+ this._textValue = contentNode ? this._innerText(contentNode) : "";
+