Add a template filter for displaying signature as base64

README.rst

@@ -5,6 +5,7 @@ It provides:
 * A form field and a form widget to handle jquery plugin through a Django form;
 * A model field to store a captured signature;
 * A mixin adding two fields (signature / signature_date) in any of your Django models.
+* A template filter to render signatures as base64 image urls.
 
 .. image:: https://img.shields.io/pypi/v/django-jsignature.svg
     :target: https://pypi.python.org/pypi/django-jsignature/

jsignature/templatetags/jsignature_filters.py

@@ -0,0 +1,21 @@
+import base64
+import io
+
+from django import template
+from django.utils.encoding import iri_to_uri
+
+from jsignature.utils import draw_signature
+
+register = template.Library()
+
+
+@register.filter
+def signature_base64(value):
+    if value is None or not isinstance(value, str):
+        return ""
+    in_mem_file = io.BytesIO()
+    draw_signature(value).save(in_mem_file, format="PNG")
+    in_mem_file.seek(0)
+    return "data:image/png;base64,{}".format(
+        iri_to_uri(base64.b64encode(in_mem_file.read()).decode('utf8'))
+    )

tests/test_filter.py

@@ -0,0 +1,19 @@
+import json
+
+from django.test import SimpleTestCase
+
+from jsignature.templatetags.jsignature_filters import signature_base64
+
+DUMMY_VALUE = [{"x": [205, 210], "y": [59, 63]},
+               {"x": [205, 207], "y": [67, 64]}]
+DUMMY_STR_VALUE = json.dumps(DUMMY_VALUE)
+
+
+class TemplateFilterTest(SimpleTestCase):
+    def test_inputs_bad_type_value(self):
+        self.assertEqual(signature_base64(object()), '')
+        self.assertEqual(signature_base64(None), '')
+
+    def test_outputs_as_base64(self):
+        output = signature_base64(DUMMY_STR_VALUE)
+        self.assertEqual(output, "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANwAAABNCAYAAADNYApnAAABIklEQVR4nO3ZP0odURjG4d/ce5dgE3EHgXTp07iD6B7cga3YpUoh7iFrCti4BkGw0OLMoEVIEW4yxPs81ZxzGPial+/8KQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAPh3ttW0dhFwCN4GbbNaFXAAlrCdVh/m791KtcC7tmkE7mP1XP2sPs1rQgd7NjVCd1TdNkL3UJ2tWRQciovqqRG8q0aXc6aDPZsat5RVX6q7Rui+zXPbX/wD/KFla7mc306qH9XneazLwZ4s3eu8eqwuV6wF3rXllvK4um9sI7/Oc7s8hMNeLVf/3xthu5nHzmzwF0y9drjrxvPAMgcA/7/lWUBnAwAAAAAAfucFwt4TZmdXW+AAAAAASUVORK5CYII=")