summaryrefslogtreecommitdiff
path: root/scripts/gui/table.js
diff options
context:
space:
mode:
Diffstat (limited to 'scripts/gui/table.js')
-rw-r--r--scripts/gui/table.js71
1 files changed, 51 insertions, 20 deletions
diff --git a/scripts/gui/table.js b/scripts/gui/table.js
index f17abb1..51ed4b3 100644
--- a/scripts/gui/table.js
+++ b/scripts/gui/table.js
@@ -1,12 +1,13 @@
'use strict';
-const TABLE_RPC = ["newDeck", "newCard", "deleteDeck", "deleteCard", "moveByID", "swapCard"]
+const TABLE_RPC = ["newDeck", "newCard", "deleteDeck", "deleteCard", "moveCard", "swapCard"]
// Table represents and manages the actual game. It accepts inputs from the server and tries to query the server when the player makes a move.
class Table{
constructor(e, drag, socket) {
this.root = e;
this.drag = drag;
+ this.drag.transform = this.getTransform.bind(this);
drag.addEventListener("dragstart", (e) => {console.log(e)});
drag.addEventListener("dragstop", this.dragMsg.bind(this));
@@ -57,8 +58,11 @@ class Table{
// Should reset all internal objects and delete all dangling decks and cards.
reset ()
{
- while(this.root.firstElementChild != null)
- this.root.firstElementChild.remove();
+ for (let e of this.root.children) {
+ if(e.tagName !== "DRAG") {
+ e.remove();
+ }
+ }
this.decks = {};
this.cards = {};
@@ -117,29 +121,32 @@ class Table{
// Move a card from one deck to another
// {data object} data from the server
- // {data.cardID any} ID of the card to move
- // {data.deckID any} ID of the deck to move the card to
+ // {data.card any} ID of the card to move
+ // {data.deck any} ID of the deck to move the card to
// {data.index number} card index in the new deck
- moveByID(data)
+ moveCard(data)
{
- this.cards[data.cardID].getDeck().removeCardByID(data.cardID);
- this.decks[data.deckID].addCardAt(this.cards[data.cardID], data.index);
+ let c = this.cards[data.card];
+ this.decks[c.getDeck()].removeCardByID(data.card);
+ this.decks[data.deck].addCardAt(c, data.index);
+ c.resetPos();
+ c.e.className = "";
}
// Swap card data with new data
// {data object} data from the server
- // {data.cardID any} ID of the card to swap
- // {data.newID any} New ID for the card
+ // {data.card any} ID of the card to swap
+ // {data.id any} New ID for the card
// {data.data object} visualization data
swapCard(data)
{
// Can't swap a card into a an id of a pre-existing card.
- if (this.cards[data.newID] != null) {
+ if (this.cards[data.id] != null) {
return false;
}
- this.cards[data.newID] = this.cards[data.cardID];
- delete this.cards[data.cardID];
- this.cards[data.newID].generateElements(data.data);
+ this.cards[data.id] = this.cards[data.card];
+ delete this.cards[data.card];
+ this.cards[data.id].generateElements(data.data);
}
@@ -162,6 +169,27 @@ class Table{
this.socket.send("move", {card: cardID, deck: deckID, index: index});
}
+ getTransform(x, y)
+ {
+ let rot = 0, scale = 0, dtot = 0;
+
+ for(let d in this.decks ) {
+ let r = parseFloat(this.decks[d].e.style.getPropertyValue("--rot"));
+ let s = parseFloat(this.decks[d].e.style.getPropertyValue("--scale"));
+
+ //
+ //TODO: Some code to properly weight the importance of scale and rotation
+ // Hopefully this can be done in one pass
+ let f = 1/this.decks[d].dist(x, y);
+ let tot = dtot + f;
+ rot = rot*(dtot/tot) + r*(f/tot);
+ scale = scale*(dtot/tot) + s*(f/tot);
+ dtot += tot;
+ }
+
+ return [rot, scale];
+ }
+
// DRAG DEBUGGING
@@ -177,15 +205,18 @@ class Table{
if(event.drag.length < 1)
return;
- let c = event.drag[0].e.card;
+ let c = event.drag[0];
let d = this.checkDeck(event.x, event.y);
- if(c !== null)
+ if(c.e.card !== null)
{
- if(d !== null && !this.decks[d].hasCard(c.id))
- this.checkMove(c.id, d);
- else
- c.resetPos();
+ let id = c.e.card.id;
+ if(d !== null && !this.decks[d].hasCard(id))
+ this.checkMove(id, d);
+ else {
+ c.ep.appendChild(c.e)
+ c.e.card.resetPos();
+ }
}
}
}