text drop shadow now available.

README.md

@@ -14,6 +14,7 @@ The Nim badgemaker tool.
 -   Custom badge size.
 -   Custom styles (flat, plastic, square, plastic square).
 -   CLI.
+-   Text drop shadows.
 
 
 ## Standart badge params
@@ -30,6 +31,10 @@ The Nim badgemaker tool.
 -   `height` -- 20.
 -   `image_path` -- "".
 -   `image_color` -- "".
+-   `label_shadow` -- false.
+-   `value_shadow` -- false.
+-   `dx` -- 0.
+-   `dy` -- 0.
 
 ## Results
 [![test1](https://github.com/Ethosa/badgemaker/blob/master/tests/test1.svg)](https://github.com/Ethosa/badgemaker/blob/master/tests/test1.svg)  
@@ -42,4 +47,10 @@ The Nim badgemaker tool.
 [![test8](https://github.com/Ethosa/badgemaker/blob/master/tests/test8.svg)](https://github.com/Ethosa/badgemaker/blob/master/tests/test8.svg)  
 [![test9](https://github.com/Ethosa/badgemaker/blob/master/tests/test9.svg)](https://github.com/Ethosa/badgemaker/blob/master/tests/test9.svg)  
 [![test10](https://github.com/Ethosa/badgemaker/blob/master/tests/test10.svg)](https://github.com/Ethosa/badgemaker/blob/master/tests/test10.svg)  
-[![test11](https://github.com/Ethosa/badgemaker/blob/master/tests/test11.svg)](https://github.com/Ethosa/badgemaker/blob/master/tests/test11.svg)
+[![test11](https://github.com/Ethosa/badgemaker/blob/master/tests/test11.svg)](https://github.com/Ethosa/badgemaker/blob/master/tests/test11.svg)  
+[![test13](https://github.com/Ethosa/badgemaker/blob/master/tests/test13.svg)](https://github.com/Ethosa/badgemaker/blob/master/tests/test13.svg)
+
+
+## FAQ
+*Q*: How I can help to develop this library?  
+*A*: You can put a star to this repository :3

badgemaker.nimble

@@ -1,7 +1,7 @@
 [Package]
 name = "badgemaker"
 author = "Ethosa"
-version = "0.0.6"
+version = "0.0.7"
 description = "The Nim badgemaker tool."
 license = "AGPLv3"
 srcDir = "badgemaker"

badgemaker/badgemaker.nim

@@ -2,7 +2,8 @@
 import streams
 import xmltree
 import strutils
-from base64 import encode
+import strtabs
+import base64
 
 
 type
@@ -14,11 +15,13 @@ type
     value_text_color: string  ## right text color
     label_color: string  ## left color.
     value_color: string  ## right color.
-    font: string
+    font: string  ## label and value font.
     font_size: int
     width, height: int
-    image_path: string
-    image_color: string
+    image_path: string  ## image path for icon.
+    image_color: string  ## image fill color.
+    label_shadow, value_shadow: bool
+    dx, dy: int
 
 
 proc newBadge*(label="", value="", style="flat", label_color="#212121",
@@ -30,25 +33,35 @@ proc newBadge*(label="", value="", style="flat", label_color="#212121",
            label_color: label_color, value_color: value_color,
            font: "DejaVu Sans,Verdana,Geneva,sans-serif",
            width: width, height: height, image_path: "", image_color: "",
-           font_size: 12)
+           font_size: 12, label_shadow: false, value_shadow: false, dx: 0, dy: 0)
 
-proc setFont*(badge: BadgeRef, font: string) =
+proc setFont*(badge: BadgeRef, font: string) {.inline.} =
   ## Sets badge font.
   badge.font = font
 
-proc setFontSize*(badge: BadgeRef, size: int) =
+proc setFontSize*(badge: BadgeRef, size: int) {.inline.} =
   ## Sets badge font size.
   badge.font_size = size
 
-proc setIcon*(badge: BadgeRef, image_path: string) =
+proc setIcon*(badge: BadgeRef, image_path: string) {.inline.} =
   ## Sets icon for badge.
   badge.image_path = image_path
 
-proc setIcon*(badge: BadgeRef, image_path, color: string) =
+proc setIcon*(badge: BadgeRef, image_path, color: string) {.inline.} =
   ## Sets icon with fill color.
   badge.image_path = image_path
   badge.image_color = color
 
+proc setShadow*(badge: BadgeRef, label=false, value=false) {.inline.} =
+  ## Change text drop shadow.
+  badge.label_shadow = label
+  badge.value_shadow = value
+
+proc offsetShadow*(badge: BadgeRef, dx, dy: int) {.inline.} =
+  ## Change drop shadow offset.
+  badge.dx = dx
+  badge.dy = dy
+
 proc `$`*(badge: BadgeRef): string =
   let
     # start variables
@@ -67,6 +80,25 @@ proc `$`*(badge: BadgeRef): string =
         labelw - badge.font_size + radius.parseInt
     stop_opacity = if "plastic" notin badge.style: "0" else: ".1"
 
+  # Drop shadow effect.
+  var shadow = newXMLTree("defs", [], newStringTable(modeCaseSensitive))
+  shadow.add newXMLTree(
+    "filter", [], {
+    "id": "drop_shadow", "x": "0", "y": "0", "width": "200%", "height": "200%"
+    }.toXMLAttributes)
+  shadow[0].add newXMLTree(
+    "feOffset", [], {
+      "result": "offOut", "in": "SourceAlpha", "dx": $badge.dx, "dy": $badge.dy
+    }.toXMLAttributes)
+  shadow[0].add newXMLTree(
+    "feGaussianBlur", [], {
+      "result": "blurOut", "in": "offOut", "stdDeviation": "1"
+    }.toXMLAttributes)
+  shadow[0].add newXMLTree(
+    "feBlend", [], {
+      "in": "SourceGraphic", "in2": "blurOut", "mode": "normal"
+    }.toXMLAttributes)
+
   var
     # trees
     tree = newXMLTree(
@@ -119,18 +151,21 @@ proc `$`*(badge: BadgeRef): string =
   text.add newXMLTree(
     "text", [], {
       "x": $(image_width + 2 + parseInt(radius)),
-      "y": $(badge.height/2 + (badge.font_size/2) - 1.0), "fill": badge.label_text_color
+      "y": $(badge.height/2 + (badge.font_size/2) - 1.0), "fill": badge.label_text_color,
+      "filter": if badge.label_shadow: "url(#drop_shadow)" else: ""
     }.toXMLAttributes)
   text.add newXMLTree(
     "text", [], {
       "x": $(dif + 2),
-      "y": $(badge.height/2 + (badge.font_size/2) - 1.0), "fill": badge.value_text_color
+      "y": $(badge.height/2 + (badge.font_size/2) - 1.0), "fill": badge.value_text_color,
+      "filter": if badge.value_shadow: "url(#drop_shadow)" else: ""
     }.toXMLAttributes)
 
   text[0].add newText badge.label
   text[1].add newText badge.value
 
   tree.add gradient
+  tree.add shadow
   tree.add main
   tree.add text
   if badge.image_path != "":

badgemaker/badgemaker/CLI.nim

@@ -30,7 +30,11 @@ proc parseCommandLine*(args: seq[string]) =
     "image_color": %"",
     "font": %"DejaVu Sans,Verdana,Geneva,sans-serif",
     "font_size": %"12",
-    "style": %"plastic"
+    "style": %"plastic",
+    "label_shadow": %"false",
+    "value_shadow": %"false",
+    "dx": %"0",
+    "dy": %"0"
   }
   var opts = initOptParser(args)
 
@@ -56,6 +60,8 @@ proc parseCommandLine*(args: seq[string]) =
   badge.setFont params["font"].getStr
   badge.setFontSize params["font_size"].getStr.parseInt
   badge.setIcon params["image_path"].getStr, params["image_color"].getStr
+  badge.setShadow params["label_shadow"].getStr.parseBool, params["value_shadow"].getStr.parseBool
+  badge.offsetShadow params["dx"].getStr.parseInt, params["dy"].getStr.parseInt
 
   if not name.endsWith(".svg"):
     name &= ".svg"

tests/test13.nim

@@ -0,0 +1,14 @@
+# author: Ethosa
+import badgemaker
+
+var badge = newBadge(
+  label="Open source", value="❤",
+  label_color="#77dd77", value_color="#212121",
+  label_text_color="#e0e0e0", value_text_color="#dd7777",
+  style="plastic", width=100
+)
+
+badge.setShadow(label=true, value=false)
+badge.offsetShadow 1, 1
+
+badge.write "test13.svg"

tests/test13.svg

@@ -0,0 +1,21 @@
+<svg width="100" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="20">
+  <linearGradient x2="0" id="gradient" y2="100%">
+    <stop stop-color="#bbb" stop-opacity=".1" offset="0" />
+    <stop stop-opacity=".1" offset="1" />
+  </linearGradient>
+  <defs><filter width="200%" y="0" x="0" id="drop_shadow" height="200%">
+      <feOffset in="SourceAlpha" dy="1" result="offOut" dx="1" />
+      <feGaussianBlur in="offOut" result="blurOut" stdDeviation="1" />
+      <feBlend in2="blurOut" mode="normal" in="SourceGraphic" />
+    </filter></defs>
+  <g mask="url(#gradient)">
+    <rect style="fill:#77dd77" width="110" y="0" x="0" rx="4" height="20" ry="4" />
+    <rect style="fill:#212121" width="10" y="0" x="84" rx="0" height="20" ry="0" />
+    <rect style="fill:#212121" width="12" y="0" x="88" rx="4" height="20" ry="4" />
+    <path fill="url(#gradient)" d="M0 0h100v20H0z" />
+  </g>
+  <g font-size="12" fill="#77dd77" font-family="DejaVu Sans,Verdana,Geneva,sans-serif">
+    <text filter="url(#drop_shadow)" y="15.0" x="6" fill="#e0e0e0">Open source</text>
+    <text filter="" y="15.0" x="86" fill="#dd7777">❤</text>
+  </g>
+</svg>