diff --git a/back-end.js b/back-end.js index c5bbfc9..374daf1 100644 --- a/back-end.js +++ b/back-end.js @@ -81,22 +81,6 @@ io.on('connection', (socket) => { socket.on('viewDeck', (data) => { socket.broadcast.to(data.roomId).emit('viewDeck', data); }); - - - socket.on('discardAndDraw', (id, discardAmount, drawAmount) => { - socket.broadcast.to(id).emit('discardAndDraw', discardAmount, drawAmount); - }); - socket.on('shuffleAndDraw', (id, shuffleAmount, drawAmount, indices) => { - socket.broadcast.to(id).emit('shuffleAndDraw', shuffleAmount, drawAmount, indices); - }); - socket.on('shuffleBottomAndDraw', (id, shuffleAmount, drawAmount, indices) => { - socket.broadcast.to(id).emit('shuffleBottomAndDraw', shuffleAmount, drawAmount, indices); - }); - - - socket.on('discardAll', (id, user, discardAmount) => { - socket.broadcast.to(id).emit('discardAll', user, discardAmount); - }); }); // Start the server diff --git a/iframe-containers/opp-containers.html b/iframe-containers/opp-containers.html index 52526e8..9d3ba91 100644 --- a/iframe-containers/opp-containers.html +++ b/iframe-containers/opp-containers.html @@ -4,7 +4,7 @@
(0)
- +
diff --git a/iframe-containers/self-containers.html b/iframe-containers/self-containers.html index 6593bd9..bf94349 100644 --- a/iframe-containers/self-containers.html +++ b/iframe-containers/self-containers.html @@ -4,7 +4,7 @@
(0)
- +
diff --git a/index.html b/index.html index 949d71b..f73e96b 100644 --- a/index.html +++ b/index.html @@ -94,8 +94,8 @@
  • Hide
  • Hand
    • -
  • Reveal
    • -
  • Hide
    • +
  • Reveal
    • +
  • Hide
  • Discard
  • Shuffle into deck
  • Shuffle to bottom
    • diff --git a/resources/css/opp-containers.css b/resources/css/opp-containers.css index 454efce..4bab96b 100644 --- a/resources/css/opp-containers.css +++ b/resources/css/opp-containers.css @@ -233,7 +233,14 @@ height: 24%; margin: 0.5%; } -.circle { +.self-circle { + position: absolute; + border-radius: 50%; + background-color: rgb(255, 98, 0); + color: white; + text-align: center; +} +.opp-circle { position: absolute; border-radius: 50%; background-color: rgb(255, 98, 0); @@ -247,7 +254,7 @@ top: 50%; left: 50%; transform: translate(-50%, -50%); - background-color: rgba(169, 169, 169, 0.5); /* Transparent dark grey */ + background-color: rgba(169, 169, 169, 0.5); border: 1px solid #ccc; border-radius: 0 0 15px 15px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); diff --git a/resources/css/self-containers.css b/resources/css/self-containers.css index b06537f..24fff9f 100644 --- a/resources/css/self-containers.css +++ b/resources/css/self-containers.css @@ -234,13 +234,21 @@ height: 24%; margin: 0.5%; } -.circle { +.self-circle { position: absolute; border-radius: 50%; background-color: rgb(255, 98, 0); color: white; text-align: center; } +.opp-circle { + position: absolute; + border-radius: 50%; + background-color: rgb(255, 98, 0); + color: white; + text-align: center; + transform: scaleX(-1) scaleY(-1); +} #attachedCardPopup_html { display: none; position: fixed; diff --git a/resources/js/front-end/actions/container/discard-all.js b/resources/js/front-end/actions/container/discard-all.js deleted file mode 100644 index a525821..0000000 --- a/resources/js/front-end/actions/container/discard-all.js +++ /dev/null @@ -1,7 +0,0 @@ -import { moveCard } from '../general/move-card.js'; - -export const discardAll = (user, discardAmount) => { - for (let i = 0; i < discardAmount; i++){ - moveCard(user, 'attachedCardPopup', 'attachedCardPopup_html', 'discard', 'discard_html', 0, false, true); - }; -}; \ No newline at end of file diff --git a/resources/js/front-end/actions/container/general.js b/resources/js/front-end/actions/container/general.js new file mode 100644 index 0000000..72f0d3c --- /dev/null +++ b/resources/js/front-end/actions/container/general.js @@ -0,0 +1,74 @@ +import { selfContainersDocument } from "../../front-end.js"; +import { containerIdToLocation } from "../../setup/containers/container-reference.js"; +import { stringToVariable, variableToString } from "../../setup/containers/string-to-variable.js"; +import { moveCard } from "../general/move-card.js"; +import { shuffleContainer } from "./shuffle-container.js"; + +export const shuffleAll = (event) => { + const containerId = event.target.parentElement.parentElement.id; + const user = selfContainersDocument.contains(event.target) ? 'self' : 'opp'; + const location = containerIdToLocation(user, containerId); + const locationAsString = variableToString(user, location); + const count = location.count; + + for (let i = 0; i < count; i++) { + moveCard(user, locationAsString, containerId, 'deck', 'deck_html', 0) + }; + + shuffleContainer(user, 'deck', 'deck_html'); + + const container_html = stringToVariable(user, containerId); + container_html.style.display = 'none'; +} + +export const discardAll = (event) => { + const containerId = event.target.parentElement.parentElement.id; + const user = selfContainersDocument.contains(event.target) ? 'self' : 'opp'; + const location = containerIdToLocation(user, containerId); + const locationAsString = variableToString(user, location); + const count = location.count; + + for (let i = 0; i < count; i++) { + moveCard(user, locationAsString, containerId, 'discard', 'discard_html', 0) + }; + + const container_html = stringToVariable(user, containerId); + container_html.style.display = 'none'; +} + +export const lostzoneAll = (event) => { + const containerId = event.target.parentElement.parentElement.id; + const user = selfContainersDocument.contains(event.target) ? 'self' : 'opp'; + const location = containerIdToLocation(user, containerId); + const locationAsString = variableToString(user, location); + const count = location.count; + + for (let i = 0; i < count; i++) { + moveCard(user, locationAsString, containerId, 'lostzone', 'lostzone_html', 0) + }; + + const container_html = stringToVariable(user, containerId); + container_html.style.display = 'none'; +} + +export const handAll = (event) => { + const containerId = event.target.parentElement.parentElement.id; + const user = selfContainersDocument.contains(event.target) ? 'self' : 'opp'; + const location = containerIdToLocation(user, containerId); + const locationAsString = variableToString(user, location); + const count = location.count; + + for (let i = 0; i < count; i++) { + moveCard(user, locationAsString, containerId, 'hand', 'hand_html', 0) + }; + + const container_html = stringToVariable(user, containerId); + container_html.style.display = 'none'; +} + +export const closeDisplay = (event) => { + const containerId = event.target.parentElement.parentElement.id; + const user = selfContainersDocument.contains(event.target) ? 'self' : 'opp'; + const container_html = stringToVariable(user, containerId); + container_html.style.display = 'none'; +} \ No newline at end of file diff --git a/resources/js/front-end/actions/container/hand-actions.js b/resources/js/front-end/actions/container/hand-actions.js index d5935ab..4baffa5 100644 --- a/resources/js/front-end/actions/container/hand-actions.js +++ b/resources/js/front-end/actions/container/hand-actions.js @@ -1,4 +1,4 @@ -import { deck, socket } from '../../front-end.js'; +import { deck, hand, oppDeck, oppHand, socket } from '../../front-end.js'; import { shuffleIndices } from '../../setup/general/shuffle.js'; import { moveCard } from '../general/move-card.js'; import { shuffleContainer } from './shuffle-container.js'; @@ -13,49 +13,75 @@ export const drawHand = (user) => { }; } -export const discardAndDraw = (user, discardAmount, drawAmount) => { - for (let i = 0; i < discardAmount; i++){ - moveCard(user, 'hand', 'hand_html', 'discard', 'discard_html', 0, false, true); - }; +export const discardAndDraw = (user) => { + let drawAmount; + const userInput = window.prompt('Draw how many cards?', '0'); + drawAmount = parseInt(userInput); + const deckCount = user === 'self' ? deck.count : oppDeck.count; + const discardAmount = user === 'self' ? hand.count : oppHand.count; + + if (!isNaN(drawAmount) && drawAmount >= 0){ + drawAmount = Math.min(drawAmount, deckCount); - for (let i = 0; i < drawAmount; i++){ - moveCard(user, 'deck', 'deck_html', 'hand', 'hand_html', 0, false, true); + for (let i = 0; i < discardAmount; i++){ + moveCard(user, 'hand', 'hand_html', 'discard', 'discard_html', 0); + }; + for (let i = 0; i < drawAmount; i++){ + moveCard(user, 'deck', 'deck_html', 'hand', 'hand_html', 0); + }; + } else { + window.alert('Please enter a valid number for the draw amount.'); }; } -export const shuffleAndDraw = (user, shuffleAmount, drawAmount, indices) => { - for (let i = 0; i < shuffleAmount; i++){ - moveCard(user, 'hand', 'hand_html', 'deck', 'deck_html', 0, false, true); - }; - if (user === 'self'){ - indices = shuffleIndices(deck.cards.length); - }; - shuffleContainer(user, 'deck', 'deck_html', indices); +export const shuffleAndDraw = (user) => { - for (let i = 0; i < drawAmount; i++){ - moveCard(user, 'deck', 'deck_html', 'hand', 'hand_html', 0, false, true); - }; + let drawAmount; + const userInput = window.prompt('Draw how many cards?', '0'); + drawAmount = parseInt(userInput); + const deckCount = user === 'self' ? deck.count : oppDeck.count; + const shuffleAmount = user === 'self' ? hand.count : oppHand.count; + + if (!isNaN(drawAmount) && drawAmount >= 0){ + drawAmount = Math.min(drawAmount, (deckCount + shuffleAmount)); - if (user === 'self'){ - socket.emit('shuffleAndDraw', roomId, shuffleAmount, drawAmount, indices); + for (let i = 0; i < shuffleAmount; i++){ + moveCard(user, 'hand', 'hand_html', 'deck', 'deck_html', 0); + }; + + shuffleContainer(user, 'deck', 'deck_html'); + + for (let i = 0; i < drawAmount; i++){ + moveCard(user, 'deck', 'deck_html', 'hand', 'hand_html', 0); + }; + + } else { + window.alert('Please enter a valid number for the draw amount.'); }; } -export const shuffleBottomAndDraw = (user, shuffleAmount, drawAmount, indices) => { - if (user === 'self'){ - indices = shuffleIndices(hand.cards.length); - }; - shuffleContainer(user, 'hand', 'hand_html', indices); +export const shuffleBottomAndDraw = (user) => { + + let drawAmount; + const userInput = window.prompt('Draw how many cards?', '0'); + drawAmount = parseInt(userInput); + const deckCount = user === 'self' ? deck.count : oppDeck.count; + const shuffleAmount = user === 'self' ? hand.count : oppHand.count; + + if (!isNaN(drawAmount) && drawAmount >= 0){ + drawAmount = Math.min(drawAmount, (deckCount + shuffleAmount)); - for (let i = 0; i < shuffleAmount; i++){ - moveCard(user, 'hand', 'hand_html', 'deck', 'deck_html', 0, false, true); - }; + shuffleContainer(user, 'hand', 'hand_html'); - for (let i = 0; i < drawAmount; i++){ - moveCard(user, 'deck', 'deck_html', 'hand', 'hand_html', 0, false, true); - }; + for (let i = 0; i < shuffleAmount; i++){ + moveCard(user, 'hand', 'hand_html', 'deck', 'deck_html', 0); + }; + + for (let i = 0; i < drawAmount; i++){ + moveCard(user, 'deck', 'deck_html', 'hand', 'hand_html', 0); + }; - if (user === 'self'){ - socket.emit('shuffleBottomAndDraw', roomId, shuffleAmount, drawAmount, indices); + } else { + window.alert('Please enter a valid number for the draw amount.'); }; } \ No newline at end of file diff --git a/resources/js/front-end/actions/counters/damage-counter.js b/resources/js/front-end/actions/counters/damage-counter.js index b416f35..8be4360 100644 --- a/resources/js/front-end/actions/counters/damage-counter.js +++ b/resources/js/front-end/actions/counters/damage-counter.js @@ -1,5 +1,5 @@ import { stringToVariable } from '../../setup/containers/string-to-variable.js'; -import { sCard, socket, selfContainersDocument, oppContainersDocument, p1, roomId } from '../../front-end.js'; +import { sCard, socket, selfContainersDocument, oppContainersDocument, p1, roomId, POV } from '../../front-end.js'; export const addDamageCounter = (user, location, container, index, received = false) => { @@ -25,10 +25,11 @@ export const addDamageCounter = (user, location, container, index, received = fa } else { if (user === 'self'){ damageCounter = selfContainersDocument.createElement('div'); + damageCounter.className = POV.user === 'self' ? 'self-circle' : 'opp-circle'; } else { damageCounter = oppContainersDocument.createElement('div'); + damageCounter.className = POV.user === 'self' ? 'opp-circle' : 'self-circle'; }; - damageCounter.className = 'circle'; damageCounter.contentEditable = 'true'; damageCounter.textContent = '10'; }; diff --git a/resources/js/front-end/actions/counters/special-condition.js b/resources/js/front-end/actions/counters/special-condition.js index da2d5ac..40b732b 100644 --- a/resources/js/front-end/actions/counters/special-condition.js +++ b/resources/js/front-end/actions/counters/special-condition.js @@ -1,5 +1,5 @@ import { stringToVariable } from '../../setup/containers/string-to-variable.js'; -import { roomId, selfContainersDocument, oppContainersDocument, socket, p1, sCard } from '../../front-end.js'; +import { roomId, selfContainersDocument, oppContainersDocument, socket, p1, sCard, POV } from '../../front-end.js'; export const addSpecialCondition = (user, location, container, index, received = false) => { @@ -26,10 +26,11 @@ export const addSpecialCondition = (user, location, container, index, received = } else { if (user === 'self'){ specialCondition = selfContainersDocument.createElement('div'); + specialCondition.className = POV.user === 'self' ? 'self-circle' : 'opp-circle'; } else { specialCondition = oppContainersDocument.createElement('div'); + specialCondition.className = POV.user === 'self' ? 'opp-circle' : 'self-circle'; }; - specialCondition.className = 'circle'; specialCondition.contentEditable = 'true'; specialCondition.textContent = 'P'; specialCondition.style.backgroundColor = 'green'; diff --git a/resources/js/front-end/actions/general/flip-board.js b/resources/js/front-end/actions/general/flip-board.js index 8336a7d..965ae75 100644 --- a/resources/js/front-end/actions/general/flip-board.js +++ b/resources/js/front-end/actions/general/flip-board.js @@ -13,12 +13,12 @@ export const flipBoard = () => { oppResizer.addEventListener('mousedown', oppHandleMouseDown); selfResizer.removeEventListener('mousedown', flippedSelfHandleMouseDown); oppResizer.removeEventListener('mousedown', flippedOppHandleMouseDown); - } + }; const toggleClasses = (element, class1, class2) => { element.classList.toggle(class1); element.classList.toggle(class2); - } + }; toggleClasses(selfResizer, 'selfColour', 'oppColour'); toggleClasses(oppResizer, 'oppColour', 'selfColour'); @@ -32,7 +32,7 @@ export const flipBoard = () => { const textIds = ['deckText', 'discardText', 'lostzoneText']; const containerIds = ['deck_html', 'discard_html', 'lostzone_html', 'attachedCardPopup_html', 'viewCards_html']; const buttonIds = ['viewCardsButtonContainer', 'attachedCardPopupButtonContainer']; - const headerIds = ['attachedCardPopupHeader', 'viewCardsHeader'] + const headerIds = ['attachedCardPopupHeader', 'viewCardsHeader']; for (const user of users) { const document = user === 'self' ? selfContainersDocument : oppContainersDocument; @@ -41,17 +41,17 @@ export const flipBoard = () => { const text = document.getElementById(textId); text.classList.toggle('self-text'); text.classList.toggle('opp-text'); - } + }; for (const containerId of containerIds) { const container = document.getElementById(containerId); container.classList.toggle('self-view'); container.classList.toggle('opp-view'); - } + }; for (const buttonId of buttonIds) { const button = document.getElementById(buttonId); button.classList.toggle('self-button-container'); button.classList.toggle('opp-button-container'); - } + }; for (const headerId of headerIds) { const header = document.getElementById(headerId); header.classList.toggle('self-header'); @@ -62,8 +62,19 @@ export const flipBoard = () => { header.textContent = 'Move attached cards'; }; }; - } - + }; + + const selfCircleElements = selfContainersDocument.querySelectorAll('.self-circle, .opp-circle'); + const oppCircleElements = oppContainersDocument.querySelectorAll('.self-circle, .opp-circle'); + + selfCircleElements.forEach(element => { + element.classList.toggle('self-circle'); + element.classList.toggle('opp-circle'); + }); + oppCircleElements.forEach(element => { + element.classList.toggle('self-circle'); + element.classList.toggle('opp-circle'); + }); // Swap heights let tempHeight = selfContainers.style.height; diff --git a/resources/js/front-end/actions/general/move-card.js b/resources/js/front-end/actions/general/move-card.js index 57df3a3..cc99ed2 100644 --- a/resources/js/front-end/actions/general/move-card.js +++ b/resources/js/front-end/actions/general/move-card.js @@ -5,13 +5,14 @@ import { updateCount } from './update-count.js'; import { makeLostzoneCover } from '../make-cover/lostzone-cover.js'; import { makeDiscardCover } from '../make-cover/discard-cover.js'; import { makeDeckCover } from '../make-cover/deck-cover.js'; -import { hideIfEmpty } from './close-popups.js'; +import { deselectCard, hideIfEmpty } from './close-popups.js'; import { hideCard, revealCard } from './reveal-and-hide.js'; import { stringToVariable } from '../../setup/containers/string-to-variable.js'; import { addDamageCounter } from '../counters/damage-counter.js'; import { addSpecialCondition } from '../counters/special-condition.js'; export const moveCard = (user, oLocation, oLocation_html, mLocation, mLocation_html, index, targetIndex, received = false) => { + deselectCard(); //remove highlight from all images before it's moved const _oLocation = oLocation; const _oLocation_html = oLocation_html; const _mLocation = mLocation; diff --git a/resources/js/front-end/actions/general/reveal-and-hide.js b/resources/js/front-end/actions/general/reveal-and-hide.js index ab7661f..ec1854a 100644 --- a/resources/js/front-end/actions/general/reveal-and-hide.js +++ b/resources/js/front-end/actions/general/reveal-and-hide.js @@ -30,7 +30,7 @@ export const hideCards = (user, container, container_html) => { } export const revealCards = (user, container, container_html) => { container = stringToVariable(user, container); - container_html = stringToVariable(user, container); + container_html = stringToVariable(user, container_html); removeImages(container_html); container.cards.forEach(card => { revealCard(card); diff --git a/resources/js/front-end/event-listeners/context-menu/hand-buttons.js b/resources/js/front-end/event-listeners/context-menu/hand-buttons.js index c45f753..08847a3 100644 --- a/resources/js/front-end/event-listeners/context-menu/hand-buttons.js +++ b/resources/js/front-end/event-listeners/context-menu/hand-buttons.js @@ -1,47 +1,13 @@ -revealOppHandButton.addEventListener('click', () => revealCards(oppHand, oppHand_html)); -hideOppHandButton.addEventListener('click', () => hideCards(oppHand, oppHand_html)); -discardHandButton.addEventListener('click', () => { - let drawAmount; +import { discardAndDraw, shuffleAndDraw, shuffleBottomAndDraw } from '../../actions/container/hand-actions.js'; +import { hideCards, revealCards } from '../../actions/general/reveal-and-hide.js'; +import { discardHandButton, hideHandButton, revealHandButton, sCard, shuffleHandBottomButton, shuffleHandButton } from '../../front-end.js' - const userInput = window.prompt('Draw how many cards?', '0'); +revealHandButton.addEventListener('click', () => revealCards(sCard.user, 'hand', 'hand_html')); - drawAmount = parseInt(userInput); +hideHandButton.addEventListener('click', () => hideCards(sCard.user, 'hand', 'hand_html')); - if (!isNaN(drawAmount) && drawAmount >= 0){ - drawAmount = Math.min(drawAmount, deck.count); - socket.emit('discardAndDraw', roomId, hand.count, drawAmount); - discardAndDraw('self', hand.count, drawAmount); - } else { - window.alert('Please enter a valid number for the draw amount.'); - }; -}); +discardHandButton.addEventListener('click', () => discardAndDraw(sCard.user)); -shuffleHandButton.addEventListener('click', () => { - let drawAmount; - - const userInput = window.prompt('Draw how many cards?', '0'); - - drawAmount = parseInt(userInput); - - if (!isNaN(drawAmount) && drawAmount >= 0){ - drawAmount = Math.min(drawAmount, (deck.count + hand.count)); - shuffleAndDraw('self', hand.count, drawAmount); - } else { - window.alert('Please enter a valid number for the draw amount.'); - }; -}); - -shuffleHandBottomButton.addEventListener('click', () => { - let drawAmount; - - const userInput = window.prompt('Draw how many cards?', '0'); - - drawAmount = parseInt(userInput); - - if (!isNaN(drawAmount) && drawAmount >= 0){ - drawAmount = Math.min(drawAmount, (deck.count + hand.count)); - shuffleBottomAndDraw('self', hand.count, drawAmount); - } else { - window.alert('Please enter a valid number for the draw amount.'); - }; -}); \ No newline at end of file +shuffleHandButton.addEventListener('click', () => shuffleAndDraw(sCard.user)); + +shuffleHandBottomButton.addEventListener('click', () => shuffleBottomAndDraw(sCard.user)); diff --git a/resources/js/front-end/event-listeners/context-menu/prizes-buttons.js b/resources/js/front-end/event-listeners/context-menu/prizes-buttons.js index 27fcc5d..7684f14 100644 --- a/resources/js/front-end/event-listeners/context-menu/prizes-buttons.js +++ b/resources/js/front-end/event-listeners/context-menu/prizes-buttons.js @@ -1,11 +1,10 @@ +import { shuffleContainer } from "../../actions/container/shuffle-container.js"; +import { hideCards, revealCards } from "../../actions/general/reveal-and-hide.js"; +import { hidePrizesButton, revealPrizesButton, sCard, shufflePrizesButton } from "../../front-end.js"; -shufflePrizesButton.addEventListener('click', function(){ - let prizesCount = sCard.user === 'self' ? prizes.count : oppPrizes.count; - const indices = shuffleIndices(prizesCount); - shuffleContainer(sCard.user, 'prizes', 'prizes_html', indices); - socket.emit('shuffleContainer', roomId, sCard.oUser, 'prizes', 'prizes_html', indices); -}); +shufflePrizesButton.addEventListener('click', () => shuffleContainer(sCard.user, 'prizes', 'prizes_html')); -revealPrizesButton.addEventListener('click', function(){revealCards(prizes, prizes_html)}); -hidePrizesButton.addEventListener('click', function(){hideCards(prizes, prizes_html)}); +revealPrizesButton.addEventListener('click', () => revealCards(sCard.user, 'prizes', 'prizes_html')); + +hidePrizesButton.addEventListener('click', () => hideCards(sCard.user, 'prizes', 'prizes_html')); diff --git a/resources/js/front-end/event-listeners/p2/room-buttons.js b/resources/js/front-end/event-listeners/p2/room-buttons.js index aa8d5ec..50d70b3 100644 --- a/resources/js/front-end/event-listeners/p2/room-buttons.js +++ b/resources/js/front-end/event-listeners/p2/room-buttons.js @@ -1,5 +1,5 @@ import { reset } from '../../actions/general/reset.js'; -import { connectedRoom, copyButton, generateIdButton, joinRoomButton, leaveRoomButton, lobby, nameInput, p1, p2Chatbox, p2SelfUsername, roomHeaderCopyButton, roomHeaderText, roomId, roomIdInput, socket } from '../../front-end.js'; +import { chatbox, connectedRoom, copyButton, generateIdButton, joinRoomButton, leaveRoomButton, lobby, nameInput, p1, p2Chatbox, p2SelfUsername, roomHeaderCopyButton, roomHeaderText, roomId, roomIdInput, socket } from '../../front-end.js'; copyButton.addEventListener('click', () => { navigator.clipboard.writeText(roomIdInput.value) @@ -17,6 +17,7 @@ joinRoomButton.addEventListener('click', () => { p2SelfUsername[0] = nameInput.value.trim() !== '' ? nameInput.value : 'Anonymous'; roomId[0] = roomIdInput.value; roomHeaderText.textContent = 'id: ' + roomId; + chatbox.innerHTML = ''; socket.emit('joinGame', roomId[0], p2SelfUsername[0]); }); diff --git a/resources/js/front-end/event-listeners/table/container-buttons.js b/resources/js/front-end/event-listeners/table/container-buttons.js index 9e7cd68..09a97ec 100644 --- a/resources/js/front-end/event-listeners/table/container-buttons.js +++ b/resources/js/front-end/event-listeners/table/container-buttons.js @@ -1,39 +1,57 @@ -import { deck_html, discard_html, lostzone_html, oppCloseDeckDisplayButton, oppCloseDiscardDisplayButton, oppCloseLostzoneDisplayButton, oppDeck_html, oppDiscard_html, oppLostzone_html, selfAttachedCardDiscardButton, selfCloseDeckDisplayButton, selfCloseDiscardDisplayButton, selfCloseLostzoneDisplayButton, selfDiscardShuffleButton } from '../../front-end.js'; - -selfAttachedCardDiscardButton.addEventListener('click', () => { - const viewCount = sCard.user === 'self' ? viewCards.count : oppViewCards.count; - for (let i = 0; i < viewCount; i++){ - moveCard(sCard.user, sCard.locationAsString, sCard.containerId, 'deck', 'deck_html', 0, false, true); - socket.emit('moveCard', roomId, sCard.oUser, sCard.locationAsString, sCard.containerId, 'deck', 'deck_html', 0); - }; - const deckCount = sCard.user === 'self' ? deck.count : oppDeck.count; - const indices = shuffleIndices(deckCount); - shuffleContainer(sCard.user, 'deck', 'deck_html', indices); - socket.emit('shuffleContainer', roomId, sCard.oUser, 'deck', 'deck_html', indices); -}); - -selfDiscardShuffleButton.addEventListener('click', () => { - const discardAmount = sCard.user === 'self' ? attachedCardPopup.count : oppAttachedCardPopup.count; - socket.emit('discardAll', roomId, sCard.oUser, discardAmount); - discardAll(sCard.user, discardAmount); -}); - -// Function to close the modal -selfCloseDeckDisplayButton.addEventListener('click', () => { - deck_html.style.display = 'none'; -}); -selfCloseLostzoneDisplayButton.addEventListener('click', () => { - lostzone_html.style.display = 'none'; -}); -selfCloseDiscardDisplayButton.addEventListener('click', () => { - discard_html.style.display = 'none'; -}); -oppCloseDeckDisplayButton.addEventListener('click', () => { - oppLostzone_html.style.display = 'none'; -}); -oppCloseLostzoneDisplayButton.addEventListener('click', () => { - oppDiscard_html.style.display = 'none'; -}); -oppCloseDiscardDisplayButton.addEventListener('click', () => { - oppDeck_html.style.display = 'none'; -}); +import { closeDisplay, discardAll, handAll, lostzoneAll, shuffleAll } from '../../actions/container/general.js'; +import { oppAttachedCardDiscardButton, oppAttachedCardHandButton, oppAttachedCardLostzoneButton, oppAttachedCardShuffleButton, oppCloseDeckDisplayButton, oppCloseDiscardDisplayButton, oppCloseLostzoneDisplayButton, oppDiscardShuffleButton, oppShuffleDeckButton, oppViewCardsDiscardButton, oppViewCardsHandButton, oppViewCardsLostzoneButton, oppViewCardsShuffleButton, selfAttachedCardDiscardButton, selfAttachedCardHandButton, selfAttachedCardLostzoneButton, selfAttachedCardShuffleButton, selfCloseDeckDisplayButton, selfCloseDiscardDisplayButton, selfCloseLostzoneDisplayButton, selfDiscardShuffleButton, selfShuffleDeckButton, selfViewCardsDiscardButton, selfViewCardsHandButton, selfViewCardsLostzoneButton, selfViewCardsShuffleButton } from '../../front-end.js'; + +//self buttons +selfShuffleDeckButton.addEventListener('click', (event) => shuffleAll(event)); + +selfDiscardShuffleButton.addEventListener('click', (event) => shuffleAll(event)); + +selfAttachedCardDiscardButton.addEventListener('click', (event) => discardAll(event)); + +selfAttachedCardShuffleButton.addEventListener('click', (event) => shuffleAll(event)); + +selfAttachedCardLostzoneButton.addEventListener('click', (event) => lostzoneAll(event)); + +selfAttachedCardHandButton.addEventListener('click', (event) => handAll(event)); + +selfViewCardsDiscardButton.addEventListener('click', (event) => discardAll(event)); + +selfViewCardsShuffleButton.addEventListener('click', (event) => shuffleAll(event)); + +selfViewCardsLostzoneButton.addEventListener('click', (event) => lostzoneAll(event)); + +selfViewCardsHandButton.addEventListener('click', (event) => handAll(event)); + +selfCloseDeckDisplayButton.addEventListener('click', (event) => closeDisplay(event)); + +selfCloseDiscardDisplayButton.addEventListener('click', (event) => closeDisplay(event)); + +selfCloseLostzoneDisplayButton.addEventListener('click', (event) => closeDisplay(event)); + +//opp buttons +oppShuffleDeckButton.addEventListener('click', (event) => shuffleAll(event)); + +oppDiscardShuffleButton.addEventListener('click', (event) => shuffleAll(event)); + +oppAttachedCardDiscardButton.addEventListener('click', (event) => discardAll(event)); + +oppAttachedCardShuffleButton.addEventListener('click', (event) => shuffleAll(event)); + +oppAttachedCardLostzoneButton.addEventListener('click', (event) => lostzoneAll(event)); + +oppAttachedCardHandButton.addEventListener('click', (event) => handAll(event)); + +oppViewCardsDiscardButton.addEventListener('click', (event) => discardAll(event)); + +oppViewCardsShuffleButton.addEventListener('click', (event) => shuffleAll(event)); + +oppViewCardsLostzoneButton.addEventListener('click', (event) => lostzoneAll(event)); + +oppViewCardsHandButton.addEventListener('click', (event) => handAll(event)); + +oppCloseDeckDisplayButton.addEventListener('click', (event) => closeDisplay(event)); + +oppCloseDiscardDisplayButton.addEventListener('click', (event) => closeDisplay(event)); + +oppCloseLostzoneDisplayButton.addEventListener('click', (event) => closeDisplay(event)); + diff --git a/resources/js/front-end/event-listeners/table/containers-and-documents.js b/resources/js/front-end/event-listeners/table/containers-and-documents.js index 8f030f8..44650ac 100644 --- a/resources/js/front-end/event-listeners/table/containers-and-documents.js +++ b/resources/js/front-end/event-listeners/table/containers-and-documents.js @@ -1,5 +1,5 @@ -import { closePopups } from '../../actions/general/close-popups.js'; import { oppContainersDocument, selfContainersDocument } from '../../front-end.js'; +import { closePopups } from '../../actions/general/close-popups.js'; import { dragLeave, dragOver, drop } from '../../image-logic/drag.js'; import { keyToggle } from '../../key-toggles/key-toggles.js'; diff --git a/resources/js/front-end/event-listeners/update/update-hand.js b/resources/js/front-end/event-listeners/update/update-hand.js index 7aab5d1..5c6eb99 100644 --- a/resources/js/front-end/event-listeners/update/update-hand.js +++ b/resources/js/front-end/event-listeners/update/update-hand.js @@ -4,9 +4,8 @@ import { adjustAlignment } from '../../setup/sizing/adjust-alignment.js'; const handObserver = new MutationObserver((mutations) => { mutations.forEach((mutation) => { if (mutation.type === 'childList') { - // Call adjustAlignment for each target [hand_html, oppHand_html].forEach(adjustAlignment); - } + }; }); }); diff --git a/resources/js/front-end/event-listeners/update/update-stadium.js b/resources/js/front-end/event-listeners/update/update-stadium.js index c9b0738..f1430bf 100644 --- a/resources/js/front-end/event-listeners/update/update-stadium.js +++ b/resources/js/front-end/event-listeners/update/update-stadium.js @@ -19,8 +19,8 @@ const checkDisplayAndUpdateZIndex = () => { if (containers[i].style.display === 'block') { stadium_html.style.zIndex = '-1'; return; // Exit the function if a container is displayed - } - } + }; + }; // If none of the containers are displayed, set the z-index to 0 stadium_html.style.zIndex = '0'; } diff --git a/resources/js/front-end/image-logic/click-events.js b/resources/js/front-end/image-logic/click-events.js index 5a04548..bbf487e 100644 --- a/resources/js/front-end/image-logic/click-events.js +++ b/resources/js/front-end/image-logic/click-events.js @@ -73,8 +73,8 @@ export const openCardContextMenu = (event) => { 'shufflePrizesButton': [[selfView, 'prizes_html']], 'revealPrizesButton': [[selfView, 'prizes_html']], 'hidePrizesButton': [[selfView, 'prizes_html']], - 'revealOppHandButton': [[oppView, 'hand_html']], - 'hideOppHandButton': [[oppView, 'hand_html']], + 'revealHandButton': [[oppView, 'hand_html']], + 'hideHandButton': [[oppView, 'hand_html']], 'shuffleDeckButton': [[selfView, 'deckDisplay_html'], [oppView, 'deckDisplay_html']], 'drawButton': [[selfView, 'deckDisplay_html']], 'viewTopButton': [[selfView, 'deckDisplay_html'], [oppView, 'deckDisplay_html']], diff --git a/resources/js/front-end/initialization/html-elements/buttons.js b/resources/js/front-end/initialization/html-elements/buttons.js index 8b18d38..58801e9 100644 --- a/resources/js/front-end/initialization/html-elements/buttons.js +++ b/resources/js/front-end/initialization/html-elements/buttons.js @@ -37,6 +37,7 @@ export const p2ResetButton = document.getElementById('p2ResetButton'); export const leaveRoomButton = document.getElementById('leaveRoomButton'); //selfContainers +export const selfShuffleDeckButton = selfContainersDocument.getElementById('selfShuffleDeckButton'); export const selfDiscardShuffleButton = selfContainersDocument.getElementById('discardShuffleButton'); export const selfAttachedCardDiscardButton = selfContainersDocument.getElementById('attachedCardDiscardButton'); export const selfAttachedCardShuffleButton = selfContainersDocument.getElementById('attachedCardShuffleButton'); @@ -52,6 +53,7 @@ export const selfCloseDiscardDisplayButton = selfContainersDocument.getElementBy export const selfCloseLostzoneDisplayButton = selfContainersDocument.getElementById('closeLostzoneDisplayButton'); //oppContainers +export const oppShuffleDeckButton = oppContainersDocument.getElementById('oppShuffleDeckButton') export const oppDiscardShuffleButton = oppContainersDocument.getElementById('discardShuffleButton'); export const oppAttachedCardDiscardButton = oppContainersDocument.getElementById('attachedCardDiscardButton'); export const oppAttachedCardShuffleButton = oppContainersDocument.getElementById('attachedCardShuffleButton'); diff --git a/resources/js/front-end/initialization/html-elements/context-menu.js b/resources/js/front-end/initialization/html-elements/context-menu.js index 087d392..e6549a0 100644 --- a/resources/js/front-end/initialization/html-elements/context-menu.js +++ b/resources/js/front-end/initialization/html-elements/context-menu.js @@ -7,8 +7,8 @@ export const shufflePrizesButton = document.getElementById('shufflePrizesButton' export const revealPrizesButton = document.getElementById('revealPrizesButton'); export const hidePrizesButton = document.getElementById('hidePrizesButton'); -export const revealOppHandButton = document.getElementById('revealOppHandButton'); -export const hideOppHandButton = document.getElementById('hideOppHandButton'); +export const revealHandButton = document.getElementById('revealHandButton'); +export const hideHandButton = document.getElementById('hideHandButton'); export const discardHandButton = document.getElementById('discardHandButton'); export const shuffleHandButton = document.getElementById('shuffleHandButton'); export const shuffleHandBottomButton = document.getElementById('shuffleHandBottomButton'); diff --git a/resources/js/front-end/setup/sizing/adjust-alignment.js b/resources/js/front-end/setup/sizing/adjust-alignment.js index 177818e..ad2bbb0 100644 --- a/resources/js/front-end/setup/sizing/adjust-alignment.js +++ b/resources/js/front-end/setup/sizing/adjust-alignment.js @@ -8,5 +8,5 @@ export const adjustAlignment = (element) => { element.style.justifyContent = 'flex-start'; } else { element.style.justifyContent = 'center'; - } + }; } \ No newline at end of file diff --git a/resources/js/front-end/setup/sizing/resizer.js b/resources/js/front-end/setup/sizing/resizer.js index 4f17629..0f60b7b 100644 --- a/resources/js/front-end/setup/sizing/resizer.js +++ b/resources/js/front-end/setup/sizing/resizer.js @@ -101,7 +101,6 @@ export const oppResize = (e) => { oppResizer.style.bottom = (100 - (clientY / window.innerHeight) * 100) + '%'; oppContainers.style.height = Math.max(1, newOppHeight) + '%'; oppContainers.style.bottom = (100 - 1 - (clientY / window.innerHeight) * 100) + '%'; - console.log(oppContainers.style.bottom); const _newOppHeight = parseInt(oppContainers.offsetHeight); const oppRatio = _newOppHeight/oldOppHeight; adjustCards('opp', 'bench', 'bench_html', oppRatio); diff --git a/resources/js/front-end/socket/event-listeners.js b/resources/js/front-end/socket/event-listeners.js index bcdbf26..74a70da 100644 --- a/resources/js/front-end/socket/event-listeners.js +++ b/resources/js/front-end/socket/event-listeners.js @@ -112,20 +112,6 @@ socket.on('viewDeck', (data) => { }); -socket.on('discardAll', (user, discardAmount) => { - discardAll(user, discardAmount); -}); -socket.on('discardAndDraw', (discardAmount, drawAmount) => { - discardAndDraw('opp', discardAmount, drawAmount); -}); -socket.on('shuffleAndDraw', (shuffleAmount, drawAmount, indices) => { - shuffleAndDraw('opp', shuffleAmount, drawAmount, indices); -}); -socket.on('shuffleBottomAndDraw', (shuffleAmount, drawAmount, indices) => { - shuffleBottomAndDraw('opp', shuffleAmount, drawAmount, indices); -}); - -