resolve outline problem in createPath()

src/Model/Const.js

@@ -15,8 +15,8 @@ oval : "m11.49999,95.866646c0,-44.557076 37.442923,-81.999998 82.000002,-81.9999
 
 const OUTLINE_SPEC = {
 full : {},
-dot : { strokedasharray : "1 20", strokelinecap : "round" },
+dot : { "stroke-dasharray" : "1 20", "stroke-linecap" : "round" },
 rect : { "stroke-dasharray" : 70},
-spade : { "stroke-dasharray" : "10 15", "stroke-width" : 70},
+spade : { "stroke-dasharray" : "10 15", "stroke-width" : 40},
 sharp : {}
 };

src/Model/card-to-html.js

@@ -41,8 +41,8 @@ class CardToHtml {
 
     // Add svg attributes for shape outline
     if(outline !== null){
-      Object.keys(OUTLINE_SPEC.rect).forEach(function(k){
-        path.setAttribute(k,OUTLINE_SPEC.rect[k]);
+      Object.keys(OUTLINE_SPEC[outline]).forEach(function(k){
+        path.setAttribute(k,OUTLINE_SPEC[outline][k]);
       });
 
       path.setAttribute('stroke','#000000');

views/cards-test.html

@@ -113,11 +113,13 @@
   <script>
     const testCard1 = new Card5('ed5467',2,'diamond','grid','rect');
     const testCard2 = new Card5('78ef56',3,'star','dot','dot');
+    const testCard3 = new Card5('79ec36',1,'squiggle','stripe','spade');
 
 
 
     CardToHtml.create(testCard1);
     CardToHtml.create(testCard2);
+    CardToHtml.create(testCard3);
   </script>
 </body>
 </html>