[Webcards] styles and some fixes

+ Fixed draging transformed cards
+ Fixed mobile styles
+ Theme template complete

3 files changed, 38 insertions, 12 deletions

diff --git a/webcards/scripts/cards/card.js b/webcards/scripts/cards/card.js
index 0f045fe..932a22c 100644
--- a/webcards/scripts/cards/card.js
+++ b/webcards/scripts/cards/card.js
@@ -94,5 +94,10 @@ Card.prototype = {
     generateErrorCard: function(el)
     {
         this.generateBasicCard("Card Error: data", el);
+    },
+
+    setPos: function(p)
+    {
+        this.e.style.setProperty("--cpos", p);
     }
 };
\ No newline at end of file
diff --git a/webcards/scripts/cards/deck.js b/webcards/scripts/cards/deck.js
index 620a038..a02142d 100644
--- a/webcards/scripts/cards/deck.js
+++ b/webcards/scripts/cards/deck.js
@@ -44,17 +44,20 @@ function Deck (options = {mode: "stack", smode: "one", sct: 0, pos: [0, 0]}){
     this.e.setAttribute("mode", options.mode);
 }
 
+//Decks work as FIFO
 Deck.prototype = {
     // Add a card to the front of the deck
     appendCard: function(card) {
         this.cards.push(card);
         this.e.appendChild(card.e);
+        this.updatePos();
     },
 
     // Add a card to the back of the deck
     prependCard: function(card) {
         this.cards.unshift(card);
         this.e.prepend(card.e);
+        card.setPos(this.cards.length - 1);
     },
 
     // Add a card at the index specified
@@ -105,5 +108,11 @@ Deck.prototype = {
 
         this.e.removeChild(this.cards[index].e);
         return this.cards.splice(index, 1)[0];
+    },
+
+    updatePos: function() {
+        let len = this.cards.length - 1;
+        for(let i in this.cards)
+            this.cards[i].setPos(len-i);
     }
 };
\ No newline at end of file
diff --git a/webcards/scripts/cards/drag.js b/webcards/scripts/cards/drag.js
index cce1e72..54fb797 100644
--- a/webcards/scripts/cards/drag.js
+++ b/webcards/scripts/cards/drag.js
@@ -24,24 +24,36 @@ MultiDrag.prototype = {
         return this.drag.length - 1;
     },
 
-    startDragging: function(mevent) {
+    dragging: function(e) {
+        for(let i in this.drag) {
+            if(this.drag[i].e == e)
+                return true;
+        }
+        return false;
+    },
+
+    startDragging: function(e) {
         if(this.del)
             return;
 
-        console.log(mevent);
+        console.log(e);
 
-        if(mevent.button != 0)
+        if(e.button != 0)
             return;
 
-        let pos = mevent.target.getBoundingClientRect();
+        let pos
+        if(e.target.parentElement != null)
+            pos = e.target.parentElement.getBoundingClientRect();
+        else
+            pos = e.target.getBoundingClientRect();
 
         return this.addDragEl(
-            mevent.currentTarget,
-            mevent.clientX - pos.left,
-            mevent.clientY - pos.top,
-            mevent.currentTarget.style.left,
-            mevent.currentTarget.style.top,
-            mevent.currentTarget.style.transitionDuration
+            e.target,
+            e.pageX,
+            e.pageY,
+            e.target.style.left,
+            e.target.style.top,
+            e.target.style.transitionDuration
         );
     },
 
@@ -76,8 +88,8 @@ MultiDrag.prototype = {
 
     update: function(e) {
         for (let i = 0; i < this.drag.length && !this.del; i++) {
-            this.drag[i].e.style.left = e.clientX - this.drag[i].osx + "px";
-            this.drag[i].e.style.top = e.clientY - this.drag[i].osy + "px";
+            this.drag[i].e.style.left = e.pageX - this.drag[i].osx + "px";
+            this.drag[i].e.style.top = e.pageY - this.drag[i].osy + "px";
         }
     }
 };
\ No newline at end of file