tweaks + bug

src/Model/Const.js

@@ -15,8 +15,8 @@ const SHAPE_PATH = {
 };
 
 const OUTLINE_SPEC = {
-  full: {},
-  dot: { "stroke-dasharray": "1 20", "stroke-linecap": "round" },
+  continuous: {},
+  dot: { "stroke-dasharray": "1 25", "stroke-linecap": "round" },
   rect: { "stroke-dasharray": 70 },
   spade: { "stroke-dasharray": "10 15", "stroke-width": 40 },
   sharp: {}

src/Model/card-to-html.js

@@ -11,6 +11,10 @@ class CardToHtml {
     svg.setAttribute('width','80');
     svg.setAttribute('viewBox','0 0 200 400');
 
+    if(card.attributes['number'] == undefined){
+      card.attributes['number'] = 1;
+    }
+    
     // Create paths + add to svg
     for(let j = 0; j < 2; j++) {
       // Faut pas oublier le j à la fin hein, c'est pas une typo
@@ -31,14 +35,9 @@ class CardToHtml {
     // The way to create svg element (differs from html element)
     const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
 
-    if(shape === null) shape = 'oval';
-    if(color === null) color = '000000';
-    if(filling === null) filling = 'fill';
-
-    // console.log("shape: " + shape);
-    // console.log("color: " + color);
-    // console.log("filling: " + filling);
-    // console.log("outline: " + outline);
+    if(shape === undefined) shape = 'oval';
+    if(color === undefined) color = 'black';
+    if(filling === undefined) filling = 'none';
 
     // Add lots of attributes
     path.setAttribute("d",SHAPE_PATH[shape]);

views/cards-test.html

@@ -122,17 +122,16 @@
     // const c2 = new Card({shape: 'oval', color: '008000', number: 2, filling: 'full', outline: null})
     // const c3 = new Card({shape: 'oval', color: '800080', number: 3, filling: 'full', outline: null})
 
-    const c1 = new Card({shape: 'diamond', color: 'green', number: 3, filling: 'empty', outline: null})
-    const c2 = new Card({shape: 'squiggle', color: 'blue', number: 1, filling: 'stripe', outline: null})
-    const c3 = new Card({shape: 'squiggle', color: 'blue', number: 2, filling: 'stripe', outline: null})
-    const c4 = new Card({shape: 'diamond', color: 'green', number: 2, filling: 'empty', outline: null})
-    const c5 = new Card({shape: 'oval', color: 'red', number: 2, filling: 'full', outline: null})
+    // const c1 = new Card({shape: 'diamond', color: 'green', number: 3, filling: 'empty', outline: null})
+    // const c2 = new Card({shape: 'squiggle', color: 'blue', number: 1, filling: 'stripe', outline: null})
+    // const c3 = new Card({shape: 'squiggle', color: 'blue', number: 2, filling: 'stripe', outline: null})
+    // const c4 = new Card({shape: 'diamond', color: 'green', number: 2, filling: 'empty', outline: null})
+    // const c5 = new Card({shape: 'oval', color: 'red', number: 2, filling: 'full', outline: null})
+    // const c6 = new Card({shape: 'oval', color: 'red', number: 1, filling: 'dot', outline: null})
+
+    const c1 = new Card({shape: 'diamond',color: 'orange' ,filling: 'grid', outline: 'dot'})
     
     CardToHtml.create(c1);
-    CardToHtml.create(c2);
-    CardToHtml.create(c3);
-    CardToHtml.create(c4);
-    CardToHtml.create(c5);
   </script>
 </body>
 </html>