From b48f0adccb11619680a47cac5fa9c68f638bd489 Mon Sep 17 00:00:00 2001 From: Kyle Gunger Date: Sun, 17 May 2020 13:15:41 -0400 Subject: [WebCards] Update from my local repos --- webcards/scripts/cards/card.js | 45 +++++++++++++++++++++--------------------- webcards/scripts/cards/deck.js | 27 ++++++++++++++----------- 2 files changed, 38 insertions(+), 34 deletions(-) (limited to 'webcards/scripts/cards') diff --git a/webcards/scripts/cards/card.js b/webcards/scripts/cards/card.js index 015995d..0f045fe 100644 --- a/webcards/scripts/cards/card.js +++ b/webcards/scripts/cards/card.js @@ -1,45 +1,44 @@ -var CardPos = ["top", "topl", "topr", "mid", "midt", "midb", "bot", "botl", "botr", "all"]; +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 function Card (data) { - this.e = this.generateElements(data); + this.e = document.createElement("card"); + this.generateElements(data); this.e.style.left = "0px"; this.e.style.top = "0px"; } // Internal Card.prototype = { - // Main generation func + // Main generation func, only for use in contructor generateElements: function (data) { + while(this.e.firstElementChild != null) + this.e.firstElementChild.remove(); + switch (typeof data) { case "object": - return this.generateObjectCard(data); + this.generateObjectCard(data, this.e); + break; case "string": - return this.generateBasicCard(data); + this.generateBasicCard(data, this.e); + break; + default: + this.generateErrorCard(this.e); } - let e = document.createElement("card"); - let t = document.createElement("carea"); - t.className = "mid"; - t.innerText = "Card Error: data"; - e.append(t); - return e; }, // Generate a card with basic text only - generateBasicCard: function (data) { - let e = document.createElement("card"); + generateBasicCard: function (data, el) { let t = document.createElement("carea"); t.className = "mid"; t.innerText = data; - e.appendChild(t); - return e; + el.appendChild(t); }, // Generate a card with rich visuals - generateObjectCard: function (data) { - let e = document.createElement("card"); + generateObjectCard: function (data, el) { // Check for an asset URL if (typeof data.assetURL != "string") { @@ -48,16 +47,14 @@ Card.prototype = { // Set card styles for (let i in data.style) { - e.style[i] = data.style[i]; + el.style[i] = data.style[i]; } // Generate card areas. for (let i in CardPos) { if (typeof data[CardPos[i]] == "object") - e.appendChild(this.generateCArea(data[CardPos[i]], CardPos[i], data.assetURL)); + el.appendChild(this.generateCArea(data[CardPos[i]], CardPos[i], data.assetURL)); } - - return e; }, generateCArea: function (data, carea, assetURL) { @@ -92,6 +89,10 @@ Card.prototype = { } return area; - } + }, + generateErrorCard: function(el) + { + this.generateBasicCard("Card Error: data", el); + } }; \ No newline at end of file diff --git a/webcards/scripts/cards/deck.js b/webcards/scripts/cards/deck.js index 544a9ef..620a038 100644 --- a/webcards/scripts/cards/deck.js +++ b/webcards/scripts/cards/deck.js @@ -1,6 +1,6 @@ // Deck class represents multiple cards. // Can be arranged in multiple ways. -function Deck (options = {}){ +function Deck (options = {mode: "stack", smode: "one", sct: 0, pos: [0, 0]}){ this.cards = []; // View mode @@ -11,19 +11,19 @@ function Deck (options = {}){ // left (strip-hl) // right (strip-hr) // vertical - // top (strip-vt) - // bottom (strip-vb) - this.mode = options.mode; + // up (strip-vu) + // down (strip-vd) + this.inf = options.mode == "infdraw"; - // Select mode - // above - // below - // around - // one - // all + // Select mode - controls what other cards are selected when one card is selected + // above - selectes cards above the selected one + // below - selects cards below the selected one + // around - selects cards above and below + // one - selects only card chosen + // all - selects all cards when card selected this.smode = options.smode; - // Select count (-1 = all available) + // Select count (negative defaults to 0) // above - controls number of cards above clicked are selected // below - controls number of cards below clicked are selected // around @@ -31,7 +31,7 @@ function Deck (options = {}){ // array - [first number: number above selected] [second number: number below selected] // one - no effect // all - no effect - this.sct = options.sct; + this.sct = options.sct > 0 ? options.sct : 0; // Position // array of where the deck is centered @@ -39,6 +39,9 @@ function Deck (options = {}){ this.y = options.pos[1]; this.e = document.createElement("deck"); + this.e.style.left = this.x + "px"; + this.e.style.top = this.y + "px"; + this.e.setAttribute("mode", options.mode); } Deck.prototype = { -- cgit v1.2.3