fix bug when shape have empty filling and an outline

src/Model/Const.js

@@ -1,6 +1,6 @@
 const TAB_COLOR = ['red', 'purple', 'green', 'blue', 'orange'];
 const TAB_NUMBER = [1, 2, 3, 4, 5];
-const TAB_SHAPE = ['diamond', 'oval', 'squiggle', 'star', 'triangle'];
+const TAB_SHAPE = ['diamond', 'oval', 'squiggle', 'triangle', 'star'];
 const TAB_FILLING = ['empty', 'stripped', 'full', 'pointed', 'squared'];
 const TAB_OUTLINE = ['continuous', 'dot', 'rect', 'spade', 'sharp'];
 const ATTRIBUTES = [TAB_COLOR, TAB_NUMBER, TAB_SHAPE, TAB_FILLING, TAB_OUTLINE];
@@ -19,5 +19,5 @@ const OUTLINE_SPEC = {
   dot: { "stroke-dasharray": "1 25", "stroke-linecap": "round" },
   rect: { "stroke-dasharray": 70 },
   spade: { "stroke-dasharray": "10 15", "stroke-width": 40 },
-  sharp: {}
+  sharp: { "stroke-dasharray": "30 30", "stroke-width": 25 }
 };

src/Model/card-to-html.js

@@ -37,7 +37,7 @@ class CardToHtml {
 
     if(shape === undefined) shape = 'oval';
     if(color === undefined) color = 'black';
-    if(filling === undefined) filling = 'none';
+    if(filling === undefined) filling = 'empty';
 
     // Add lots of attributes
     path.setAttribute("d",SHAPE_PATH[shape]);
@@ -55,7 +55,8 @@ class CardToHtml {
       Object.keys(OUTLINE_SPEC[outline]).forEach(function(k) {
         path.setAttribute(k,OUTLINE_SPEC[outline][k]);
       });
-      path.setAttribute('stroke','#000000');
+      if(filling == 'empty') path.setAttribute('stroke',color);
+      else path.setAttribute('stroke','black');
     }
 
     // Diff between two paths in svg