diff options
Diffstat (limited to 'js/helper-classes/RDGE/Materials/RadialGradientMaterial.js')
-rw-r--r-- | js/helper-classes/RDGE/Materials/RadialGradientMaterial.js | 87 |
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 | ||