| 190 | // Adds gradients |
| 191 | |
| 192 | gradient = function(obj, p0, p1, colors, numColors) { |
| 193 | |
| 194 | var j, cols = []; |
| 195 | |
| 196 | if (vendor=='-webkit-') { |
| 197 | |
| 198 | for (j = 0; j<numColors; j++) |
| 199 | cols.push('color-stop('+colors[j][0]+', '+colors[j][1]+')'); |
| 200 | |
| 201 | obj.css({'background-image': '-webkit-gradient(linear, '+p0.x+'% '+p0.y+'%, '+p1.x+'% '+p1.y+'%, '+ cols.join(',') +' )'}); |
| 202 | |
| 203 | } else { |
| 204 | |
| 205 | // This procedure makes the gradients for non-webkit browsers |
| 206 | // It will be reduced to one unique way for gradients in next versions |
| 207 | |
| 208 | p0 = {x:p0.x/100 * obj.width(), y:p0.y/100 * obj.height()}; |
| 209 | p1 = {x:p1.x/100 * obj.width(), y:p1.y/100 * obj.height()}; |
| 210 | |
| 211 | var dx = p1.x-p0.x, |
| 212 | dy = p1.y-p0.y, |
| 213 | angle = Math.atan2(dy, dx), |
| 214 | angle2 = angle - Math.PI/2, |
| 215 | diagonal = Math.abs(obj.width()*Math.sin(angle2)) + Math.abs(obj.height()*Math.cos(angle2)), |
| 216 | gradientDiagonal = Math.sqrt(dy*dy + dx*dx), |
| 217 | corner = point2D((p1.x<p0.x) ? obj.width() : 0, (p1.y<p0.y) ? obj.height() : 0), |
| 218 | slope = Math.tan(angle), |
| 219 | inverse = -1/slope, |
| 220 | x = (inverse*corner.x - corner.y - slope*p0.x + p0.y) / (inverse-slope), |
| 221 | c = {x: x, y: inverse*x - inverse*corner.x + corner.y}, |
| 222 | segA = (Math.sqrt( Math.pow(c.x-p0.x,2) + Math.pow(c.y-p0.y,2))); |
| 223 | |
| 224 | for (j = 0; j<numColors; j++) |
| 225 | cols.push(' '+colors[j][1]+' '+(( segA + gradientDiagonal*colors[j][0] )*100/diagonal)+'%'); |
| 226 | |
| 227 | obj.css({'background-image': vendor+'linear-gradient(' + (-angle) + 'rad,' + cols.join(',') + ')'}); |
| 228 | } |
| 229 | }, |
| 230 | |
| 231 | turnMethods = { |
| 232 | |