From 79189a473eaecde4ac773771306aa53bc0940fa1 Mon Sep 17 00:00:00 2001
From: Ryan Oldenburg <guzba8@gmail.com>
Date: Sat, 19 Dec 2020 18:01:14 -0600
Subject: [PATCH] svg decode more support

---
 src/pixie/fileformats/svg.nim   | 169 +++++++++++++++++++++-----------
 tests/images/svg/triangle01.png | Bin 0 -> 4048 bytes
 tests/images/svg/triangle01.svg |  11 +++
 tests/test_svg.nim              |  20 ++--
 4 files changed, 136 insertions(+), 64 deletions(-)
 create mode 100644 tests/images/svg/triangle01.png
 create mode 100644 tests/images/svg/triangle01.svg

diff --git a/src/pixie/fileformats/svg.nim b/src/pixie/fileformats/svg.nim
index 6819ee3..61518b2 100644
--- a/src/pixie/fileformats/svg.nim
+++ b/src/pixie/fileformats/svg.nim
@@ -1,75 +1,130 @@
 ## Load and Save SVG files.
 
-import chroma, pixie/images, pixie/common, pixie/paths, vmath, xmlparser, xmltree,
-  strutils, strutils, bumpy
+import chroma, pixie/images, pixie/common, pixie/paths, vmath, xmlparser,
+  xmltree, strutils, strutils, bumpy
 
 const svgSignature* = "<?xml"
 
+type Ctx = object
+  fill, stroke: ColorRGBA
+  strokeWidth: float32
+  transform: Mat3
+
 template failInvalid() =
   raise newException(PixieError, "Invalid SVG data")
 
-proc draw(img: Image, matStack: var seq[Mat3], xml: XmlNode) =
-  case xml.tag:
-  of "g":
-    let
-      fill = xml.attr("fill")
-      stroke = xml.attr("stroke")
-      strokeWidth = xml.attr("stroke-width")
-      transform = xml.attr("transform")
+proc initCtx(): Ctx =
+  result.fill = parseHtmlColor("black").rgba
+  result.strokeWidth = 1
+  result.transform = mat3()
 
-    if transform != "":
-      if transform.startsWith("matrix("):
-        let arr = transform[7..^2].split(",")
-        if arr.len != 6:
-          failInvalid()
-        var m = mat3()
-        m[0] = parseFloat(arr[0])
-        m[1] = parseFloat(arr[1])
-        m[3] = parseFloat(arr[2])
-        m[4] = parseFloat(arr[3])
-        m[6] = parseFloat(arr[4])
-        m[7] = parseFloat(arr[5])
-        matStack.add(matStack[^1] * m)
-      else:
-        raise newException(
-          PixieError, "Unsupported SVG transform: " & transform & ".")
+proc decodeCtx(inherited: Ctx, node: XmlNode): Ctx =
+  result = inherited
 
-    for child in xml:
-      if child.tag == "path":
-        let d = child.attr("d")
+  let
+    fill = node.attr("fill")
+    stroke = node.attr("stroke")
+    strokeWidth = node.attr("stroke-width")
+    transform = node.attr("transform")
 
-        if fill != "none" and fill != "":
-          let
-            fillColor = parseHtmlColor(fill).rgba
-            (bounds, fillImg) = fillPathBounds(d, fillColor, matStack[^1])
-          img.draw(fillImg, bounds.xy)
-
-        if stroke != "none" and stroke != "":
-          let
-            strokeColor = parseHtmlColor(stroke).rgba
-            strokeWidth =
-              if strokeWidth == "": 1.0 # Default stroke width is 1px
-              else: parseFloat(strokeWidth)
-            (bounds, strokeImg) =
-              strokePathBounds(d, strokeColor, strokeWidth, matStack[^1])
-          img.draw(strokeImg, bounds.xy)
-      else:
-        img.draw(matStack, child)
-
-    if transform != "":
-      discard matStack.pop()
+  if fill == "":
+    discard # Inherit
+  elif fill == "none":
+    result.fill = ColorRGBA()
   else:
-    raise newException(PixieError, "Unsupported SVG tag: " & xml.tag & ".")
+    result.fill = parseHtmlColor(fill).rgba
+
+  if stroke == "":
+    discard # Inherit
+  elif stroke == "none":
+    result.stroke = ColorRGBA()
+  else:
+    result.stroke = parseHtmlColor(stroke).rgba
+
+  if strokeWidth == "":
+    discard # Inherit
+  else:
+    result.strokeWidth = parseFloat(strokeWidth)
+
+  if transform == "":
+    discard # Inherit
+  else:
+    if transform.startsWith("matrix("):
+      let arr = transform[7..^2].split(",")
+      if arr.len != 6:
+        failInvalid()
+      var m = mat3()
+      m[0] = parseFloat(arr[0])
+      m[1] = parseFloat(arr[1])
+      m[3] = parseFloat(arr[2])
+      m[4] = parseFloat(arr[3])
+      m[6] = parseFloat(arr[4])
+      m[7] = parseFloat(arr[5])
+      result.transform = result.transform * m
+    else:
+      raise newException(
+        PixieError, "Unsupported SVG transform: " & transform & "."
+      )
+
+proc draw(
+  img: Image, node: XmlNode, ctxStack: var seq[Ctx]
+) =
+  if node.kind != xnElement:
+    # Skip <!-- comments -->
+    return
+
+  case node.tag:
+  of "title":
+    discard
+  of "desc":
+    discard
+  of "g":
+    let ctx = decodeCtx(ctxStack[^1], node)
+    ctxStack.add(ctx)
+    for child in node:
+      img.draw(child, ctxStack)
+    discard ctxStack.pop()
+  of "path":
+    let
+      d = node.attr("d")
+      ctx = decodeCtx(ctxStack[^1], node)
+    if ctx.fill != ColorRGBA():
+      let (bounds, fillImg) = fillPathBounds(d, ctx.fill, ctx.transform)
+      img.draw(fillImg, bounds.xy)
+    if ctx.stroke != ColorRGBA():
+      let (bounds, strokeImg) = strokePathBounds(
+        d, ctx.stroke, ctx.strokeWidth, ctx.transform
+      )
+      img.draw(strokeImg, bounds.xy)
+  of "rect":
+    let
+      ctx = decodeCtx(ctxStack[^1], node)
+      x = parseFloat(node.attr("x"))
+      y = parseFloat(node.attr("y"))
+      width = parseFloat(node.attr("width"))
+      height = parseFloat(node.attr("height"))
+      path = newPath()
+    path.moveTo(x, y)
+    path.lineTo(x + width, x)
+    path.lineTo(x + width, y + height)
+    path.lineTo(x, y + height)
+    path.closePath()
+    if ctx.fill != ColorRGBA():
+      img.fillPath(path, ctx.fill, ctx.transform)
+    if ctx.stroke != ColorRGBA():
+      img.strokePath(path, ctx.stroke, ctx.strokeWidth, ctx.transform)
+  else:
+    raise newException(PixieError, "Unsupported SVG tag: " & node.tag & ".")
 
 proc decodeSvg*(data: string): Image =
   ## Render SVG file and return the image.
   try:
-    let xml = parseXml(data)
-    if xml.tag != "svg":
+    let root = parseXml(data)
+    if root.tag != "svg":
       failInvalid()
 
     let
-      viewBox = xml.attr("viewBox")
+      viewBox = root.attr("viewBox")
       box = viewBox.split(" ")
     if parseInt(box[0]) != 0 or parseInt(box[1]) != 0:
       failInvalid()
@@ -77,11 +132,11 @@ proc decodeSvg*(data: string): Image =
     let
       width = parseInt(box[2])
       height = parseInt(box[3])
+    var ctxStack = @[initCtx()]
     result = newImage(width, height)
-    var matStack = @[mat3()]
-    for n in xml:
-      result.draw(matStack, n)
+    for node in root:
+      result.draw(node, ctxStack)
   except PixieError as e:
     raise e
   except:
-     raise newException(PixieError, "Unable to load SVG")
+    raise newException(PixieError, "Unable to load SVG")
diff --git a/tests/images/svg/triangle01.png b/tests/images/svg/triangle01.png
new file mode 100644
index 0000000000000000000000000000000000000000..603107fdb2538ad2228050b3d8b2059ef4a3f233
GIT binary patch
literal 4048
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
ZL*VZ46kU5_9+=c2X9qX?V#NQ%e*jAqfZG57

literal 0
HcmV?d00001

diff --git a/tests/images/svg/triangle01.svg b/tests/images/svg/triangle01.svg
new file mode 100644
index 0000000..ef65f9b
--- /dev/null
+++ b/tests/images/svg/triangle01.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" standalone="no"?>
+<svg width="4cm" height="4cm" viewBox="0 0 400 400"
+     xmlns="http://www.w3.org/2000/svg" version="1.1">
+  <title>Example triangle01- simple example of a 'path'</title>
+  <desc>A path that draws a triangle</desc>
+  <rect x="1" y="1" width="398" height="398"
+        fill="none" stroke="blue" />
+  <path d="M 100 100 L 300 100 L 200 300 z"
+        fill="red" stroke="blue" stroke-width="3" />
+</svg>
+
diff --git a/tests/test_svg.nim b/tests/test_svg.nim
index d9b2361..1abc0bd 100644
--- a/tests/test_svg.nim
+++ b/tests/test_svg.nim
@@ -1,9 +1,15 @@
-import pixie/fileformats/svg, pixie
+import pixie/fileformats/svg, pixie, strformat
 
-let
-  original = readFile("tests/images/svg/Ghostscript_Tiger.svg")
-  image = decodeSvg(original)
-  gold = readImage("tests/images/svg/Ghostscript_Tiger.png")
+const files = [
+  "triangle01",
+  "Ghostscript_Tiger"
+]
 
-doAssert image.data == gold.data
-# image.writeFile("tests/images/svg/Ghostscript_Tiger.png")
+for file in files:
+  let
+    original = readFile(&"tests/images/svg/{file}.svg")
+    image = decodeSvg(original)
+    gold = readImage(&"tests/images/svg/{file}.png")
+
+  doAssert image.data == gold.data
+  # image.writeFile(&"{file}.png")