From b6288e1ffe4ffe29a595bb1e146feb388503e2c4 Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Wed, 7 Mar 2012 15:31:20 -0800
Subject: gradient support for canvas-2d shapes.

Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
 js/lib/geom/line.js | 38 ++++++++++++++++++++++++++++++++++----
 1 file changed, 34 insertions(+), 4 deletions(-)

(limited to 'js/lib/geom/line.js')

diff --git a/js/lib/geom/line.js b/js/lib/geom/line.js
index da63b21c..eaa26cf0 100755
--- a/js/lib/geom/line.js
+++ b/js/lib/geom/line.js
@@ -348,16 +348,46 @@ var Line = function GLLine( world, xOffset, yOffset, width, height, slope, strok
 		if (!ctx)  return;
 	
 		// set up the stroke style
-		var lineWidth = this._strokeWidth;
+		var lineWidth = this._strokeWidth,
+            w = this._width,
+            h = this._height;
+
+        var c,
+            gradient,
+            colors,
+            len,
+            n,
+            position,
+            cs;
+
 		ctx.beginPath();
 		ctx.lineWidth	= lineWidth;
 		if (this._strokeColor) {
-			var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")";  
-			ctx.strokeStyle = c;
+            if(this._strokeColor.gradientMode) {
+                if(this._strokeColor.gradientMode === "radial") {
+                    gradient = ctx.createRadialGradient(w/2, h/2, 0, w/2, h/2, h/2);
+                } else {
+                    gradient = ctx.createLinearGradient(0, h/2, w, h/2);
+                }
+                colors = this._strokeColor.color;
+
+                len = colors.length;
+
+                for(n=0; n<len; n++) {
+                    position = colors[n].position/100;
+                    cs = colors[n].value;
+                    gradient.addColorStop(position, "rgba(" + cs.r + "," + cs.g + "," + cs.b + "," + cs.a + ")");
+                }
+
+                ctx.strokeStyle = gradient;
+
+            } else {
+                c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")";
+                ctx.strokeStyle = c;
+            }
 
 			// get the points
 			var p0,  p1;
-			var  w = this._width,  h = this._height;
 			if(this._slope === "vertical") {
 				p0 = [0.5*w, 0];
 				p1 = [0.5*w, h];
-- 
cgit v1.2.3