tweaks + bug

master
remrem 2 years ago
parent 1ff4e91de4
commit 128d641657

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

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

@ -122,17 +122,16 @@
// const c2 = new Card({shape: 'oval', color: '008000', number: 2, filling: 'full', outline: null}) // 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 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 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 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 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 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 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(c1);
CardToHtml.create(c2);
CardToHtml.create(c3);
CardToHtml.create(c4);
CardToHtml.create(c5);
</script> </script>
</body> </body>
</html> </html>
Loading…
Cancel
Save