feat(api): Implemented card played event via websocket (#85)
Reviewed-on: #85 Reviewed-by: lq64 <lq@blackhole.local> Co-authored-by: Janis <janis.e.20@gmx.de> Co-committed-by: Janis <janis.e.20@gmx.de>
This commit is contained in:
@@ -45,6 +45,45 @@ function receiveGameStateChange(eventData) {
|
||||
|
||||
exchangeBody(content, title);
|
||||
}
|
||||
function receiveCardPlayedEvent(eventData) {
|
||||
const firstCard = eventData.firstCard;
|
||||
const playedCards = eventData.playedCards;
|
||||
|
||||
const trickCardsContainer = $('#trick-cards-container');
|
||||
const firstCardContainer = $('#first-card-container')
|
||||
|
||||
let trickHTML = '';
|
||||
playedCards.forEach(cardCombo => {
|
||||
trickHTML += `
|
||||
<div class="col-auto">
|
||||
<div class="card text-center shadow-sm border-0 bg-transparent" style="width: 7rem; backdrop-filter: blur(4px);">
|
||||
<div class="p-2">
|
||||
<img src="/assets/images/cards/${cardCombo.cardId}.png" width="100%" alt="${cardCombo.cardId}"/>
|
||||
</div>
|
||||
<div class="card-body p-2 bg-transparent">
|
||||
<small class="fw-semibold text-secondary">${cardCombo.player}</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
trickCardsContainer.html(trickHTML);
|
||||
|
||||
let altText;
|
||||
let imageSrc;
|
||||
if (firstCard === "BLANK") {
|
||||
imageSrc = "/assets/images/cards/1B.png";
|
||||
altText = "Blank Card";
|
||||
} else {
|
||||
imageSrc = `/assets/images/cards/${firstCard}.png`;
|
||||
altText = `Card ${firstCard}`;
|
||||
}
|
||||
|
||||
const newFirstCardHTML = `
|
||||
<img src="${imageSrc}" alt="${altText}" width="80px" style="border-radius: 6px"/>
|
||||
`;
|
||||
firstCardContainer.html(newFirstCardHTML);
|
||||
}
|
||||
onEvent("ReceivedHandEvent", receiveHandEvent)
|
||||
onEvent("GameStateChangeEvent", receiveGameStateChange)
|
||||
onEvent("GameStateChangeEvent", receiveGameStateChange)
|
||||
onEvent("CardPlayedEvent", receiveCardPlayedEvent)
|
||||
Reference in New Issue
Block a user