summaryrefslogtreecommitdiff
path: root/scripts/cards/card.js
diff options
context:
space:
mode:
authorKyle Gunger <corechg@gmail.com>2020-09-18 12:19:44 -0400
committerKyle Gunger <corechg@gmail.com>2020-09-18 12:19:44 -0400
commitdbaf69557c0d6e648120b068fec1920b9391a24a (patch)
treef31f7b956455b1243d344d0c54d5b04e9e80fb3f /scripts/cards/card.js
parente5515d3e1603339b4957421c9494ca619490a03d (diff)
Update from local repo
Diffstat (limited to 'scripts/cards/card.js')
-rw-r--r--scripts/cards/card.js110
1 files changed, 110 insertions, 0 deletions
diff --git a/scripts/cards/card.js b/scripts/cards/card.js
new file mode 100644
index 0000000..750d124
--- /dev/null
+++ b/scripts/cards/card.js
@@ -0,0 +1,110 @@
+'use strict';
+
+// Possible positions of content in a card
+const CardPos = ["top", "topl", "topr", "mid", "midt", "midb", "bot", "botl", "botr", "all"];
+
+// Card class represents one card.
+// Every card should have a deck.
+// Use deck.appendCard or deck.prependCard to make a card visible
+class Card {
+ constructor (data)
+ {
+ this.e = document.createElement("card");
+ this.generateElements(data);
+ this.e.style.left = "0px";
+ this.e.style.top = "0px";
+ }
+
+ // Generate a card with basic text only
+ static generateBasicCard (data, el)
+ {
+ let t = document.createElement("carea");
+ t.className = "mid";
+ t.innerText = data;
+ el.appendChild(t);
+ }
+
+ // Generate a card with a simple error message.
+ static generateErrorCard (el)
+ {
+ Card.generateBasicCard("Card Error: data", el);
+ }
+
+ // Generate an area of a card
+ static generateCArea (data, carea, assetURL)
+ {
+ // Create and set area
+ let area = document.createElement("carea");
+ area.className = carea;
+
+ // Create inner area text and images
+ for (let i in data)
+ {
+ if (i == "style")
+ {
+ for (j in data.style)
+ area.style[j] = data.style[j];
+ }
+
+ if (data[i].type == "text")
+ {
+ let e = document.createElement("ctext");
+
+ e.innerText = data[i].text;
+
+ for (let j in data[i].style)
+ e.style[j] = data[i].style[j];
+
+ area.appendChild(e);
+
+ }
+ else if (data[i].type == "image")
+ {
+ let e = document.createElement("cimage");
+
+ e.style.backgroundImage = "url(\"" + assetURL + data[i].image + "\")";
+
+ for (let j in data[i].style)
+ e.style[j] = data[i].style[j];
+
+ area.appendChild(e);
+ }
+ }
+
+ return area;
+ }
+
+ // Generate a card with rich visuals
+ static generateObjectCard (data, el)
+ {
+ // Generate card areas.
+ for (let i in CardPos)
+ {
+ if (typeof data[CardPos[i]] == "object")
+ el.appendChild(this.generateCArea(data[CardPos[i]], CardPos[i], data.assetURL));
+ }
+ }
+
+ generateElements (data)
+ {
+ while(this.e.firstElementChild != null)
+ this.e.firstElementChild.remove();
+
+ switch (typeof data)
+ {
+ case "object":
+ Card.generateObjectCard(data, this.e);
+ break;
+ case "string":
+ Card.generateBasicCard(data, this.e);
+ break;
+ default:
+ Card.generateErrorCard(this.e);
+ }
+ }
+
+ setPos (p)
+ {
+ this.e.style.setProperty("--cpos", p);
+ }
+}