aboutsummaryrefslogtreecommitdiff
path: root/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/helper-classes/RDGE/Materials/RadialGradientMaterial.js')
-rw-r--r--js/helper-classes/RDGE/Materials/RadialGradientMaterial.js87
1 files changed, 55 insertions, 32 deletions
diff --git a/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js b/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js
index cf91f1aa..12842798 100644
--- a/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js
+++ b/js/helper-classes/RDGE/Materials/RadialGradientMaterial.js
@@ -29,7 +29,7 @@ function RadialGradientMaterial()
29 this._colorStop2 = 0.3; 29 this._colorStop2 = 0.3;
30 this._colorStop3 = 0.6; 30 this._colorStop3 = 0.6;
31 this._colorStop4 = 1.0; 31 this._colorStop4 = 1.0;
32 this._colorCount = 4; 32// this._colorCount = 4;
33 33
34 /////////////////////////////////////////////////////////////////////// 34 ///////////////////////////////////////////////////////////////////////
35 // Property Accessors 35 // Property Accessors
@@ -98,14 +98,20 @@ function RadialGradientMaterial()
98 /////////////////////////////////////////////////////////////////////// 98 ///////////////////////////////////////////////////////////////////////
99 // Material Property Accessors 99 // Material Property Accessors
100 /////////////////////////////////////////////////////////////////////// 100 ///////////////////////////////////////////////////////////////////////
101 this._propNames = ["color1", "color2", "angle"]; 101 this._propNames = ["color1", "color2", "color3", "color4", "colorStop1", "colorStop2", "colorStop3", "colorStop4", "angle"];
102 this._propLabels = ["Start Color", "Stop Color", "Angle"]; 102 this._propLabels = ["Color 1", "Color 2", "Color 3", "Color 4", "Color Stop 1", "Color Stop 2", "Color Stop 3", "Color Stop 4", "Angle"];
103 this._propTypes = ["color", "color", "float"]; 103 this._propTypes = ["color", "color", "color", "color", "float", "float", "float", "float", "float"];
104 this._propValues = []; 104 this._propValues = [];
105 105
106 this._propValues[ this._propNames[0] ] = this._color1.slice(0); 106 this._propValues[ this._propNames[0] ] = this._color1.slice(0);
107 this._propValues[ this._propNames[1] ] = this._color4.slice(0); 107 this._propValues[ this._propNames[1] ] = this._color2.slice(0);
108 this._propValues[ this._propNames[2] ] = this._angle; 108 this._propValues[ this._propNames[2] ] = this._color3.slice(0);
109 this._propValues[ this._propNames[3] ] = this._color4.slice(0);
110
111 this._propValues[ this._propNames[4] ] = this._colorStop1;
112 this._propValues[ this._propNames[5] ] = this._colorStop2;
113 this._propValues[ this._propNames[6] ] = this._colorStop3;
114 this._propValues[ this._propNames[7] ] = this._colorStop4;
109 115
110 this.setProperty = function( prop, value ) 116 this.setProperty = function( prop, value )
111 { 117 {
@@ -116,14 +122,20 @@ function RadialGradientMaterial()
116 if (!ok) 122 if (!ok)
117 console.log( "invalid property in Radial Gradient Material:" + prop + " : " + value ); 123 console.log( "invalid property in Radial Gradient Material:" + prop + " : " + value );
118 124
119 switch (prop) 125 switch (prop)
120 { 126 {
121 case "color1": this.setColor1( value ); break; 127 case "color1": this.setColor1( value ); break;
122 case "color2": this.setColor2( value ); break; 128 case "color2": this.setColor2( value ); break;
123 case "angle": this.setAngle( value ); break; 129 case "color3": this.setColor3( value ); break;
124 } 130 case "color4": this.setColor4( value ); break;
125 131 case "colorStop1": this.setColorStop1( value ); break;
126 this.updateValuesInShader(); 132 case "colorStop2": this.setColorStop2( value ); break;
133 case "colorStop3": this.setColorStop3( value ); break;
134 case "colorStop4": this.setColorStop4( value ); break;
135 case "angle": this.setAngle( value ); break;
136 }
137
138 //this.updateValuesInShader();
127 } 139 }
128 /////////////////////////////////////////////////////////////////////// 140 ///////////////////////////////////////////////////////////////////////
129 141
@@ -183,10 +195,15 @@ function RadialGradientMaterial()
183 var exportStr = "material: " + this.getShaderName() + "\n"; 195 var exportStr = "material: " + this.getShaderName() + "\n";
184 exportStr += "name: " + this.getName() + "\n"; 196 exportStr += "name: " + this.getName() + "\n";
185 197
186 exportStr += "innerCircleRadius: " + this.getInnerCircleRadius() + "\n"; 198 exportStr += "color1: " + this.getColor1() + "\n";
187 exportStr += "mainCircleRadius: " + this.getMainCircleRadius() + "\n"; 199 exportStr += "color2: " + this.getColor2() + "\n";
188 exportStr += "innerCircleCenter: " + String(this.getInnerCircleCenter()) + "\n"; 200 exportStr += "color3: " + this.getColor3() + "\n";
189 exportStr += "mainCircleCenter: " + String(this.getMainCircleCenter()) + "\n"; 201 exportStr += "color4: " + this.getColor4() + "\n";
202
203 exportStr += "colorStop1: " + this.getColorStop1() + "\n";
204 exportStr += "colorStop2: " + this.getColorStop2() + "\n";
205 exportStr += "colorStop3: " + this.getColorStop3() + "\n";
206 exportStr += "colorStop4: " + this.getColorStop4() + "\n";
190 207
191 // every material needs to terminate like this 208 // every material needs to terminate like this
192 exportStr += "endMaterial\n"; 209 exportStr += "endMaterial\n";
@@ -204,16 +221,23 @@ function RadialGradientMaterial()
204 var rtnStr; 221 var rtnStr;
205 try 222 try
206 { 223 {
207 var innerCircleRadius = Number( pu.nextValue("innerCircleRadius: ") ), 224 var color1 = eval( "[" + pu.nextValue( "color1: " ) + "]" ),
208 mainCircleRadius = Number( pu.nextValue("mainCircleRadius: ") ), 225 color2 = eval( "[" + pu.nextValue( "color2: " ) + "]" ),
209 innerCircleCenter = eval( "[" + pu.nextValue( "innerCircleCenter: " ) + "]" ); 226 color3 = eval( "[" + pu.nextValue( "color3: " ) + "]" ),
210 mainCircleCenter = eval( "[" + pu.nextValue( "mainCircleCenter: " ) + "]" ); 227 color4 = eval( "[" + pu.nextValue( "color4: " ) + "]" ),
211 228 colorStop1 = Number(pu.nextValue( "colorStop1: " )),
212 this._innerCircleRadius = innerCircleRadius; 229 colorStop2 = Number(pu.nextValue( "colorStop2: " )),
213 this._mainCircleRadius = mainCircleRadius; 230 colorStop3 = Number(pu.nextValue( "colorStop3: " )),
214 this._innerCircleCenter = innerCircleCenter; 231 colorStop4 = Number(pu.nextValue( "colorStop4: " ));
215 this.mainCircleCenter = mainCircleCenter; 232
216 this.updateValuesInShader(); 233 this.setProperty( "color1", color1 );
234 this.setProperty( "color2", color2 );
235 this.setProperty( "color3", color3 );
236 this.setProperty( "color4", color4 );
237 this.setProperty( "colorStop1", colorStop1 );
238 this.setProperty( "colorStop2", colorStop2 );
239 this.setProperty( "colorStop3", colorStop3 );
240 this.setProperty( "colorStop4", colorStop4 );
217 241
218 var endKey = "endMaterial\n"; 242 var endKey = "endMaterial\n";
219 var index = importStr.indexOf( endKey ); 243 var index = importStr.indexOf( endKey );
@@ -263,8 +287,7 @@ var radialGradientMaterialDef =
263 'u_colorStop1': { 'type' : 'float' }, 287 'u_colorStop1': { 'type' : 'float' },
264 'u_colorStop2': { 'type' : 'float' }, 288 'u_colorStop2': { 'type' : 'float' },
265 'u_colorStop3': { 'type' : 'float' }, 289 'u_colorStop3': { 'type' : 'float' },
266 'u_colorStop4': { 'type' : 'float' }, 290 'u_colorStop4': { 'type' : 'float' }
267 'u_cos_sin_angle' : { 'type' : 'vec2' }
268 //'u_colorCount': {'type' : 'int' } 291 //'u_colorCount': {'type' : 'int' }
269 }, 292 },
270 293