From 50bb13fb563c6dac25830a0755abba57707d4c19 Mon Sep 17 00:00:00 2001 From: ditam Date: Mon, 26 Apr 2021 03:17:17 +0200 Subject: [PATCH] add swap action --- main.js | 42 +++++++++++++++++++++++++++++++++++++++++- styles.css | 4 ++++ 2 files changed, 45 insertions(+), 1 deletion(-) diff --git a/main.js b/main.js index e309f05..b28ba92 100644 --- a/main.js +++ b/main.js @@ -6,7 +6,9 @@ const decks = { cards: [ { type: 'pickaxe' }, { type: 'pickaxe' }, - { type: 'lantern' } + { type: 'pickaxe' }, + { type: 'pickaxe' }, + { type: 'sieve' } ] }, player2: { @@ -650,6 +652,13 @@ function playCard(cardElement, handIndex) { el.removeClass('visible'); }, 4000); break; + case 'sieve': + if (decks.shaft.revealedCount < 2) { + showError('Needs at least 2 revealed cards.'); + return; + } + $('.card.treasure:not(.face-down)').addClass('swappable'); + break; default: console.assert(false, 'playCard unknown card type:' + type) break; @@ -680,6 +689,37 @@ $(document).ready(function() { playCard(card, indexInHand); }); + const swapPair = []; + playArea.on('click', '.card:not(.face-down).swappable', function() { + const card = $(this); + // note that all the shaft cards are generated, so we can count index amongst them directly + const cardIndex = card.index('.card.treasure'); + card.addClass('swap-selected'); + swapPair.push(cardIndex); + console.log('swap select:', card, cardIndex); + if ($('.swap-selected').length === 2) { + // swap on UI + const first = $('.swap-selected').first(); + const last = $('.swap-selected').last(); + const firstLeft = first.css('left'); + first.css('left', last.css('left')); + last.css('left', firstLeft); + // swap in shaft + const i = swapPair[0]; + const j = swapPair[1]; + const tmp = { + type: decks.shaft.cards[i].type, + domElement: decks.shaft.cards[i].domElement + }; + decks.shaft.cards[i] = decks.shaft.cards[j]; + decks.shaft.cards[j] = tmp; + // cleanup + swapPair.pop(); + swapPair.pop(); + $('.card').removeClass('swap-selected'); + } + }); + playArea.on('click', '.card.treasure:not(.face-down):not(.unavailable):not(.forbidden)', function() { const card = $(this); // note that all the shaft cards are generated, so we can count index amongst them directly diff --git a/styles.css b/styles.css index be2cbc6..4bd6321 100644 --- a/styles.css +++ b/styles.css @@ -207,6 +207,10 @@ body { opacity: 0.99; } +.card.swap-selected { + box-shadow: 6px 3px 10px green; +} + .card .cost { position: absolute; top: 5px;