diff options
Diffstat (limited to 'js/lib/rdge/materials/linear-gradient-material.js')
-rwxr-xr-x | js/lib/rdge/materials/linear-gradient-material.js | 72 |
1 files changed, 71 insertions, 1 deletions
diff --git a/js/lib/rdge/materials/linear-gradient-material.js b/js/lib/rdge/materials/linear-gradient-material.js index da6d205c..e1d31a42 100755 --- a/js/lib/rdge/materials/linear-gradient-material.js +++ b/js/lib/rdge/materials/linear-gradient-material.js | |||
@@ -26,7 +26,7 @@ INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN | |||
26 | CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) | 26 | CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) |
27 | ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE | 27 | ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE |
28 | POSSIBILITY OF SUCH DAMAGE. | 28 | POSSIBILITY OF SUCH DAMAGE. |
29 | </copyright> */ | 29 | </copyright> */ |
30 | 30 | ||
31 | var MaterialParser = require("js/lib/rdge/materials/material-parser").MaterialParser; | 31 | var MaterialParser = require("js/lib/rdge/materials/material-parser").MaterialParser; |
32 | var Material = require("js/lib/rdge/materials/material").Material; | 32 | var Material = require("js/lib/rdge/materials/material").Material; |
@@ -103,6 +103,76 @@ var LinearGradientMaterial = function LinearGradientMaterial() { | |||
103 | this.setShaderValues(); | 103 | this.setShaderValues(); |
104 | this.update( 0 ); | 104 | this.update( 0 ); |
105 | }; | 105 | }; |
106 | |||
107 | this.resetToDefault = function() | ||
108 | { | ||
109 | this._propValues[this._propNames[0]] = this._color1.slice(0); | ||
110 | this._propValues[this._propNames[1]] = this._color2.slice(0); | ||
111 | this._propValues[this._propNames[2]] = this._color3.slice(0); | ||
112 | this._propValues[this._propNames[3]] = this._color4.slice(0); | ||
113 | |||
114 | this._propValues[this._propNames[4]] = this._colorStop1; | ||
115 | this._propValues[this._propNames[5]] = this._colorStop2; | ||
116 | this._propValues[this._propNames[6]] = this._colorStop3; | ||
117 | this._propValues[this._propNames[7]] = this._colorStop4; | ||
118 | |||
119 | this._propValues[this._propNames[8]] = [ Math.cos(this._angle), Math.sin(this._angle) ]; | ||
120 | |||
121 | var nProps = this._propNames.length; | ||
122 | for (var i=0; i<nProps; i++) { | ||
123 | this.setProperty( this._propNames[i], this._propValues[this._propNames[i]] ); | ||
124 | } | ||
125 | }; | ||
126 | |||
127 | // Only Linear Gradient and Radial Gradients support gradients; | ||
128 | this.gradientType = "linear"; | ||
129 | |||
130 | this.getGradientData = function() { | ||
131 | var angle = Math.round(this._angle*180/Math.PI), | ||
132 | color, | ||
133 | colorStr, | ||
134 | css = "-webkit-gradient(linear, " + angle + "deg"; | ||
135 | |||
136 | // TODO - Angle is not supported in -webkit-gradient syntax, so just default to across: | ||
137 | css = '-webkit-gradient(linear, left top, right top'; | ||
138 | |||
139 | // TODO - Also, Color Model requires from and to in the gradient string | ||
140 | color = this.getProperty('u_color1'); | ||
141 | colorStr = Math.round(color[0] * 255) + ', ' + Math.round(color[1] * 255) + ', ' + Math.round(color[2] * 255) + ', ' + Math.round(color[3] * 100); | ||
142 | css += ', from(rgba(' + colorStr + '))'; | ||
143 | |||
144 | for (var i=2; i < 4; i++) { | ||
145 | color = this.getProperty('u_color'+i); | ||
146 | colorStr = Math.round(color[0] * 255) + ', ' + Math.round(color[1] * 255) + ', ' + Math.round(color[2] * 255) + ', ' + Math.round(color[3] * 100); | ||
147 | css += ', color-stop(' + this.getProperty('u_colorStop'+i) + ', rgba(' + colorStr + '))'; | ||
148 | } | ||
149 | |||
150 | color = this.getProperty('u_color4'); | ||
151 | colorStr = Math.round(color[0] * 255) + ', ' + Math.round(color[1] * 255) + ', ' + Math.round(color[2] * 255) + ', ' + Math.round(color[3] * 100); | ||
152 | css += ', to(rgba(' + colorStr + '))'; | ||
153 | |||
154 | css += ')'; | ||
155 | |||
156 | return css; | ||
157 | }; | ||
158 | |||
159 | // Only Linear Gradient and Radial Gradient have gradient data. | ||
160 | this.setGradientData = function(colors) { | ||
161 | var len = colors.length; | ||
162 | // TODO - Current shaders only support 4 color stops | ||
163 | if (len > 4) { | ||
164 | len = 4; | ||
165 | } | ||
166 | |||
167 | for (var n = 0; n < len; n++) { | ||
168 | var position = colors[n].position/100; | ||
169 | var cs = colors[n].value; | ||
170 | var stop = [cs.r/255, cs.g/255, cs.b/255, cs.a]; | ||
171 | |||
172 | this.setProperty("u_color" + (n + 1), stop.slice(0)); | ||
173 | this.setProperty("u_colorStop" + (n + 1), position); | ||
174 | } | ||
175 | }; | ||
106 | }; | 176 | }; |
107 | 177 | ||
108 | /////////////////////////////////////////////////////////////////////////////////////// | 178 | /////////////////////////////////////////////////////////////////////////////////////// |