Home > database >  Javascript card game: once card is used, never use card again?
Javascript card game: once card is used, never use card again?

Time:10-13

I am creating a card game using Javascript. I got this far with the code and everything works perfectly, but I am having trouble figuring out a way to make sure that once a card is selected it is never picked again.

Preview: https://natialollie.github.io/javascript-card-game/

    // function 2: generate and show random card

function generateNumber() {
 
    // combine all card arrays  
    let allCards = cardArray.concat(acesArray).concat(jackArray).concat(kingArray).concat(queenArray);

    // select a random letter within the array
    let cardLetter = allCards[Math.floor(Math.random() * allCards.length)];  

    // generate a random number between 2 and 10
    let randomNumber = Math.floor(Math.random() * 9)   2;

    // if generic card is choosen, concatenate letter with random number  
    if ((cardArray).indexOf(cardLetter) !==-1) {
        var genericCard = randomNumber   cardLetter;
        var cardToShow = "PNG/"   genericCard   ".png"

    } // OR if special card is choosen, leave as is
    else {
        var specialCard = cardLetter;
        cardToShow = "PNG/"   specialCard   ".png"

    } 
    
    console.log('The card slot with id: '   "'"   selectedSlot   "'"   ' was selected! The new card file path to show is: '   cardToShow);
    
    // change the current file path of the card, to the newly generated one
    let changeImgSrc = document.getElementById(selectedSlot)
    changeImgSrc.src = cardToShow;

    // remove file path from cardToShow and store the result
    let pathRemoved = cardToShow.replace("PNG/", '').replace(".png", '');

    // take the result and append to array, each time a card is shown
    usedCard.push(pathRemoved);
    console.log(usedCard);

    //for cards inside the usedCard array, when you run the function dont include this as a file path option 
 

}

CodePudding user response:

How about this. Filter out all the cards who are found in the usedCards array.

let allCards = cardArray.concat(acesArray).concat(jackArray).concat(kingArray).concat(queenArray);
allCards = allCards.filter(card => usedCards.indexOf(card) === -1)

Alternatively you could keep track of the remaining cards (instead of the used cards) and remove from that list when you use a card.

CodePudding user response:

One method is to use a fixed number table — your cards need to be mapped to an array and removed when picked. Here's a working example I built for a "use-all-numbers" random number generator:

function rand(min, max) {
  return Math.floor(Math.random() * (max - min)   min);
}
var array = [],
  output = document.getElementById("output");
function generatelist() {
  for (i = 0; i < 10; i  ) {
    array.push(i   1);
  }
  output.innerHTML  = "<br>List is: "   array;
}
generatelist();

function selectnumber() {
  x = rand(0, array.length);
  output.innerHTML  = "<br>Number is: "   array[x];
  array.splice(x, 1);
  output.innerHTML  = "<br>List is: "   array;
  if (array.length == 0) {
    output.innerHTML  = "<br>There are no more numbers! Regenerating list.";
    generatelist();
  }
}
<button onclick="selectnumber()">Select a number from list</button>
<div id="output"></div>

  • Related