diff options
author | hwc487 | 2012-07-09 16:08:02 -0700 |
---|---|---|
committer | hwc487 | 2012-07-09 16:08:02 -0700 |
commit | 5085d0f67df89a21715308956004164597a6ba79 (patch) | |
tree | 2c896163143a66331205a39b0a3b1b45d51bf12a /js/lib/rdge/materials/radial-gradient-material.js | |
parent | 51f1691f792dbda9b740ded8aa0457c9406db156 (diff) | |
parent | 84b3327bd92faafab7954b5eb64c7abe24a3fe13 (diff) | |
download | ninja-5085d0f67df89a21715308956004164597a6ba79.tar.gz |
Merge branch 'master' of github.com:Motorola-Mobility/ninja-internal into GridFixes
Conflicts:
js/helper-classes/3D/StageLine.js
Diffstat (limited to 'js/lib/rdge/materials/radial-gradient-material.js')
-rwxr-xr-x | js/lib/rdge/materials/radial-gradient-material.js | 246 |
1 files changed, 167 insertions, 79 deletions
diff --git a/js/lib/rdge/materials/radial-gradient-material.js b/js/lib/rdge/materials/radial-gradient-material.js index 6a5a9e9a..f1094771 100755 --- a/js/lib/rdge/materials/radial-gradient-material.js +++ b/js/lib/rdge/materials/radial-gradient-material.js | |||
@@ -47,17 +47,17 @@ var RadialGradientMaterial = function RadialGradientMaterial() { | |||
47 | this._defaultColorStop2 = 0.3; | 47 | this._defaultColorStop2 = 0.3; |
48 | this._defaultColorStop3 = 0.6; | 48 | this._defaultColorStop3 = 0.6; |
49 | this._defaultColorStop4 = 1.0; | 49 | this._defaultColorStop4 = 1.0; |
50 | // this._defaultColorCount = 4; | 50 | // this._defaultColorCount = 4; |
51 | 51 | ||
52 | this._textureTransform = [1,0,0, 0,1,0, 0,0,1]; | 52 | this._textureTransform = [1,0,0, 0,1,0, 0,0,1]; |
53 | 53 | ||
54 | /////////////////////////////////////////////////////////////////////// | 54 | /////////////////////////////////////////////////////////////////////// |
55 | // Property Accessors | 55 | // Property Accessors |
56 | /////////////////////////////////////////////////////////////////////// | 56 | /////////////////////////////////////////////////////////////////////// |
57 | |||
58 | 57 | ||
59 | this.isAnimated = function () { return false; }; | 58 | |
60 | this.getShaderDef = function() { return radialGradientMaterialDef; }; | 59 | this.isAnimated = function () { return false; }; |
60 | this.getShaderDef = function() { return radialGradientMaterialDef; }; | ||
61 | 61 | ||
62 | /////////////////////////////////////////////////////////////////////// | 62 | /////////////////////////////////////////////////////////////////////// |
63 | // Material Property Accessors | 63 | // Material Property Accessors |
@@ -95,49 +95,137 @@ var RadialGradientMaterial = function RadialGradientMaterial() { | |||
95 | this._materialNode.setShader(this._shader); | 95 | this._materialNode.setShader(this._shader); |
96 | 96 | ||
97 | // set the shader values in the shader | 97 | // set the shader values in the shader |
98 | this._shader['default'].u_texTransform.set( this._textureTransform ); | 98 | this._shader['default'].u_texTransform.set( this._textureTransform ); |
99 | this.setShaderValues(); | 99 | this.setShaderValues(); |
100 | }; | 100 | }; |
101 | 101 | ||
102 | this.fitToPrimitive = function( prim ) | 102 | this.resetToDefault = function() |
103 | { | ||
104 | this._propValues[this._propNames[0]] = this._defaultColor1.slice(0); | ||
105 | this._propValues[this._propNames[1]] = this._defaultColor2.slice(0); | ||
106 | this._propValues[this._propNames[2]] = this._defaultColor3.slice(0); | ||
107 | this._propValues[this._propNames[3]] = this._defaultColor4.slice(0); | ||
108 | |||
109 | this._propValues[this._propNames[4]] = this._defaultColorStop1; | ||
110 | this._propValues[this._propNames[5]] = this._defaultColorStop2; | ||
111 | this._propValues[this._propNames[6]] = this._defaultColorStop3; | ||
112 | this._propValues[this._propNames[7]] = this._defaultColorStop4; | ||
113 | |||
114 | var nProps = this._propNames.length; | ||
115 | for (var i=0; i<nProps; i++) { | ||
116 | this.setProperty( this._propNames[i], this._propValues[this._propNames[i]] ); | ||
117 | } | ||
118 | }; | ||
119 | |||
120 | this.fitToBounds = function( bounds ) | ||
103 | { | 121 | { |
104 | var bounds = ShapePrimitive.getBounds( prim ); | 122 | if (bounds) |
105 | if (bounds) | 123 | { |
124 | var dx = Math.abs( bounds[3] - bounds[0] ), | ||
125 | dy = Math.abs( bounds[4] - bounds[1] ); | ||
126 | if (dy == 0) dy = 1.0; | ||
127 | if (dx == 0) dx = 1.0; | ||
128 | var xScale = 2.0, yScale = 2.0; | ||
129 | if (dx > dy) | ||
130 | yScale *= dy/dx; | ||
131 | else | ||
132 | xScale *= dx/dy; | ||
133 | |||
134 | // build the matrix - the translation to the origin, the scale, | ||
135 | // and the translation back to the center (hard coded at (0.5, 0.5) for now). | ||
136 | // the matrix is build directly instead of with matrix multiplications | ||
137 | // for efficiency, not to mention that the multiplication function does | ||
138 | // not exist for mat3's. | ||
139 | // the matrix as laid out below looks transposed - order is columnwise. | ||
140 | var xCtr = 0.5, yCtr = 0.5; | ||
141 | this._textureTransform = [ | ||
142 | xScale, 0.0, 0.0, | ||
143 | 0.0, yScale, 0.0, | ||
144 | xCtr*(1-xScale), yCtr*(1 - yScale), 1.0 | ||
145 | ]; | ||
146 | |||
147 | if (this._shader && this._shader['default']) | ||
148 | this._shader['default'].u_texTransform.set( this._textureTransform ); | ||
149 | |||
150 | } | ||
151 | }; | ||
152 | |||
153 | this.fitToPrimitiveArray = function( primArray ) | ||
154 | { | ||
155 | if (!primArray) return; | ||
156 | var nPrims = primArray.length; | ||
157 | if (nPrims == 0) return; | ||
158 | var bounds = ShapePrimitive.getBounds( primArray[0] ); | ||
159 | for (var i=1; i<nPrims; i++) | ||
106 | { | 160 | { |
107 | var dx = Math.abs( bounds[3] - bounds[0] ), | 161 | var prim = primArray[i]; |
108 | dy = Math.abs( bounds[4] - bounds[1] ); | 162 | var b2 = ShapePrimitive.getBounds( prim ); |
109 | if (dy == 0) dy = 1.0; | 163 | |
110 | if (dx == 0) dx = 1.0; | 164 | // [xMin, yMin, zMin, xMax, yMax, zMax] |
111 | var xScale = 2.0, yScale = 2.0; | 165 | if (b2[0] < bounds[0]) bounds[0] = b2[0]; |
112 | if (dx > dy) | 166 | if (b2[1] < bounds[1]) bounds[1] = b2[1]; |
113 | yScale *= dy/dx; | 167 | if (b2[2] < bounds[2]) bounds[2] = b2[2]; |
114 | else | ||
115 | xScale *= dx/dy; | ||
116 | |||
117 | // build the matrix - the translation to the origin, the scale, | ||
118 | // and the translation back to the center (hard coded at (0.5, 0.5) for now). | ||
119 | // the matrix is build directly instead of with matrix multiplications | ||
120 | // for efficiency, not to mention that the multiplication function does | ||
121 | // not exist for mat3's. | ||
122 | // the matrix as laid out below looks transposed - order is columnwise. | ||
123 | var xCtr = 0.5, yCtr = 0.5; | ||
124 | this._textureTransform = [ | ||
125 | xScale, 0.0, 0.0, | ||
126 | 0.0, yScale, 0.0, | ||
127 | xCtr*(1-xScale), yCtr*(1 - yScale), 1.0 | ||
128 | ]; | ||
129 | |||
130 | if (this._shader && this._shader['default']) | ||
131 | this._shader['default'].u_texTransform.set( this._textureTransform ); | ||
132 | 168 | ||
169 | if (b2[3] > bounds[3]) bounds[3] = b2[3]; | ||
170 | if (b2[4] > bounds[4]) bounds[4] = b2[4]; | ||
171 | if (b2[5] > bounds[5]) bounds[5] = b2[5]; | ||
133 | } | 172 | } |
173 | |||
174 | this.fitToBounds( bounds ); | ||
134 | }; | 175 | }; |
135 | 176 | ||
136 | this.customExport = function( jObj ) | 177 | this.fitToPrimitive = function( prim ) |
137 | { | 178 | { |
138 | jObj.u_texTransform = this._textureTransform.slice(); | 179 | var bounds = ShapePrimitive.getBounds( prim ); |
139 | return jObj; | 180 | this.fitToBounds( bounds ); |
140 | } | 181 | }; |
182 | |||
183 | this.customExport = function( jObj ) | ||
184 | { | ||
185 | jObj.u_texTransform = this._textureTransform.slice(); | ||
186 | return jObj; | ||
187 | }; | ||
188 | |||
189 | // Only Linear Gradient and Radial Gradient have gradient data. | ||
190 | this.gradientType = "radial"; | ||
191 | |||
192 | this.getGradientData = function() { | ||
193 | var angle = Math.round(this._angle*180/Math.PI), | ||
194 | color, | ||
195 | colorStr, | ||
196 | css = "-webkit-gradient(linear, " + angle + "deg"; | ||
197 | |||
198 | // TODO - Angle is not supported in -webkit-gradient syntax, so just default to across: | ||
199 | css = '-webkit-radial-gradient(50% 50%, ellipse cover'; | ||
200 | |||
201 | // TODO - Also, Color Model requires from and to in the gradient string | ||
202 | for (var i=1; i < 5; i++) { | ||
203 | color = this.getProperty('u_color'+i); | ||
204 | colorStr = Math.round(color[0] * 255) + ', ' + Math.round(color[1] * 255) + ', ' + Math.round(color[2] * 255) + ', ' + Math.round(color[3] * 100); | ||
205 | css += ', rgba(' + colorStr + ') ' + Math.round(this.getProperty('u_colorStop'+i)*100) + '%'; | ||
206 | } | ||
207 | |||
208 | css += ')'; | ||
209 | |||
210 | return css; | ||
211 | }; | ||
212 | |||
213 | this.setGradientData = function(colors) { | ||
214 | var len = colors.length; | ||
215 | // TODO - Current shaders only support 4 color stops | ||
216 | if (len > 4) { | ||
217 | len = 4; | ||
218 | } | ||
219 | |||
220 | for (var n = 0; n < len; n++) { | ||
221 | var position = colors[n].position/100; | ||
222 | var cs = colors[n].value; | ||
223 | var stop = [cs.r/255, cs.g/255, cs.b/255, cs.a]; | ||
224 | |||
225 | this.setProperty("u_color" + (n + 1), stop.slice(0)); | ||
226 | this.setProperty("u_colorStop" + (n + 1), position); | ||
227 | } | ||
228 | }; | ||
141 | }; | 229 | }; |
142 | 230 | ||
143 | /////////////////////////////////////////////////////////////////////////////////////// | 231 | /////////////////////////////////////////////////////////////////////////////////////// |
@@ -146,48 +234,48 @@ var RadialGradientMaterial = function RadialGradientMaterial() { | |||
146 | // shader spec (can also be loaded from a .JSON file, or constructed at runtime) |