From efcdc56ccd48cfa51ddcb0d79f1d297c3179ce96 Mon Sep 17 00:00:00 2001
From: fuzhen <fuzhen@maptalks.org>
Date: Wed, 6 Jan 2016 23:27:49 +0800
Subject: [PATCH 1/3] fixed a bug with globalAlpha

---
 canvas2svg.js | 26 +++++++++++++++++++++++---
 1 file changed, 23 insertions(+), 3 deletions(-)

diff --git a/canvas2svg.js b/canvas2svg.js
index e34309a..63d73db 100644
--- a/canvas2svg.js
+++ b/canvas2svg.js
@@ -141,10 +141,16 @@
             apply : "stroke"
         },
         "globalAlpha": {
-            svgAttr : "opacity",
+            svgAttr : "stroke-opacity",
             canvas : 1,
             svg : 1,
-            apply : "fill stroke"
+            apply :  "stroke"
+        },
+        "globalAlpha": {
+            svgAttr : "fill-opacity",
+            canvas : 1,
+            svg : 1,
+            apply : "fill"
         },
         "font":{
             //font converts to multiple svg attributes, there is custom logic for this
@@ -368,10 +374,24 @@
                         regex = /rgba\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d?\.?\d*)\s*\)/gi;
                         matches = regex.exec(value);
                         this.__currentElement.setAttribute(style.svgAttr, format("rgb({r},{g},{b})", {r:matches[1], g:matches[2], b:matches[3]}));
-                        this.__currentElement.setAttribute(style.svgAttr+"-opacity", matches[4]);
+                        //should take globalAlpha here
+                        var opacity = matches[4];
+                        var globalAlpha = this.globalAlpha;
+                        if (globalAlpha != null) {
+                            opacity *= globalAlpha;
+                        }
+                        this.__currentElement.setAttribute(style.svgAttr+"-opacity", opacity);
                     } else {
+                        if (keys[i] === 'globalAlpha') {
+                            if (this.__currentElement.getAttribute(style.svgAttr)) {
+                                 //fill-opacity or stroke-opacity has already been set by stroke or fill.
+                                continue;
+                            }
+                        }
                         //otherwise only update attribute if right type, and not svg default
                         this.__currentElement.setAttribute(style.svgAttr, value);
+
+
                     }
                 }
             }

From f302a60389e1c51c307fd050e9e915260a78f527 Mon Sep 17 00:00:00 2001
From: fuzhen <fuzhen@maptalks.org>
Date: Wed, 6 Jan 2016 23:58:17 +0800
Subject: [PATCH 2/3] fixed duplicate def of globalAlpha in STYLES

---
 canvas2svg.js | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

diff --git a/canvas2svg.js b/canvas2svg.js
index 63d73db..cb09113 100644
--- a/canvas2svg.js
+++ b/canvas2svg.js
@@ -141,16 +141,10 @@
             apply : "stroke"
         },
         "globalAlpha": {
-            svgAttr : "stroke-opacity",
+            svgAttr : "opacity",
             canvas : 1,
             svg : 1,
-            apply :  "stroke"
-        },
-        "globalAlpha": {
-            svgAttr : "fill-opacity",
-            canvas : 1,
-            svg : 1,
-            apply : "fill"
+            apply :  "fill stroke"
         },
         "font":{
             //font converts to multiple svg attributes, there is custom logic for this
@@ -382,14 +376,16 @@
                         }
                         this.__currentElement.setAttribute(style.svgAttr+"-opacity", opacity);
                     } else {
+                        var attr = style.svgAttr;
                         if (keys[i] === 'globalAlpha') {
-                            if (this.__currentElement.getAttribute(style.svgAttr)) {
+                            attr = type+'-'+style.svgAttr;
+                            if (this.__currentElement.getAttribute(attr)) {
                                  //fill-opacity or stroke-opacity has already been set by stroke or fill.
                                 continue;
                             }
                         }
                         //otherwise only update attribute if right type, and not svg default
-                        this.__currentElement.setAttribute(style.svgAttr, value);
+                        this.__currentElement.setAttribute(attr, value);
 
 
                     }

From d70b13eedda83bc6bb7da3f6d604979d4eda0f10 Mon Sep 17 00:00:00 2001
From: fuzhen <fuzhen@maptalks.org>
Date: Sat, 16 Jan 2016 17:22:47 +0800
Subject: [PATCH 3/3] add tests for globalAlpha

---
 test/unit.spec.js | 38 +++++++++++++++++++++++++++++++++++++-
 1 file changed, 37 insertions(+), 1 deletion(-)

diff --git a/test/unit.spec.js b/test/unit.spec.js
index e8f05a7..bcafbd1 100644
--- a/test/unit.spec.js
+++ b/test/unit.spec.js
@@ -296,4 +296,40 @@ describe('canvas2svg', function() {
         });
 
     });
-});
\ No newline at end of file
+
+    describe("supports globalOpacity", function() {
+        it("set stroke-opacity when stroking and set fill-opacity when filling",function() {
+            var ctx = new C2S();
+            ctx.globalAlpha = 0.5;
+            ctx.moveTo(5,5);
+            ctx.lineTo(15,15);
+            ctx.stroke();
+            var svg = ctx.getSvg();
+            expect(svg.querySelector("path").getAttribute("stroke-opacity")).to.equal('0.5');
+            ctx.globalAlpha = 0.1;
+            ctx.fillStyle = "#000000";
+            ctx.fill();
+            expect(svg.querySelector("path").getAttribute("fill-opacity")).to.equal('0.1');
+            //stroke-opacity stays o.5
+            expect(svg.querySelector("path").getAttribute("stroke-opacity")).to.equal('0.5');
+        });
+
+        it("added into color opacity when stroking or filling with rgba style color. ",function() {
+            var ctx = new C2S();
+            ctx.strokeStyle="rgba(0,0,0,0.8)";
+            ctx.globalAlpha = 0.5;
+            ctx.moveTo(5,5);
+            ctx.lineTo(15,15);
+            ctx.stroke();
+            var svg = ctx.getSvg();
+            expect(svg.querySelector("path").getAttribute("stroke")).to.equal('rgb(0,0,0)');
+            //stroke-opacity should be globalAlpha*(alpha in rgba)
+            expect(svg.querySelector("path").getAttribute("stroke-opacity")).to.equal(''+0.8*0.5);
+            ctx.globalAlpha = 0.6;
+            ctx.fillStyle = "rgba(0,0,0,0.6)";
+            ctx.fill();
+            expect(svg.querySelector("path").getAttribute("fill-opacity")).to.equal(''+0.6*0.6);
+            expect(svg.querySelector("path").getAttribute("stroke-opacity")).to.equal(''+0.8*0.5);
+        });
+    });
+});