mirror of
https://github.com/MrEidam/Black-Jack.git
synced 2025-12-29 08:56:11 +00:00
Adding cards to player's hands
This commit is contained in:
@@ -12,7 +12,7 @@
|
||||
<body>
|
||||
<article class="cards cards1"><img src="./BlackJackCards/J-B.png" class="card" alt=""></article>
|
||||
<h2 id="playerScore">69</h2>
|
||||
<article class="cards cards2"><img src="./BlackJackCards/J-R.png" class="card" alt="" id="card"></article>
|
||||
<article id="playerHand" class="cards cards2"></article>
|
||||
<section>
|
||||
<button onclick="hit()">Hit</button>
|
||||
<button>Stand</button>
|
||||
|
||||
46
main.js
46
main.js
@@ -71,8 +71,17 @@ const emptyDeck = {
|
||||
Spades: []
|
||||
}
|
||||
|
||||
let currentDeck = Deck;
|
||||
let currentDeck = deepCopyDeck(Deck); // Initialize with a deep copy
|
||||
|
||||
// Function to deeply copy the deck
|
||||
function deepCopyDeck(deck){
|
||||
return {
|
||||
Clubs: [...deck.Clubs],
|
||||
Diamonds: [...deck.Diamonds],
|
||||
Hearts: [...deck.Hearts],
|
||||
Spades: [...deck.Spades]
|
||||
};
|
||||
}
|
||||
function cardsleft(){
|
||||
return [
|
||||
currentDeck.Clubs.length,
|
||||
@@ -88,7 +97,7 @@ function addScore(num){
|
||||
score = 0;
|
||||
playerCards.forEach(e => {
|
||||
if(e === 'A'){
|
||||
score += (score < 11) ? 10 : 1;
|
||||
score += (score < 11) ? 11 : 1;
|
||||
}else{
|
||||
score += isNaN(e) ? 10 : parseInt(e);
|
||||
}
|
||||
@@ -96,23 +105,34 @@ function addScore(num){
|
||||
|
||||
}
|
||||
|
||||
function reshuffle(){
|
||||
alert('Reshuffling ...')
|
||||
currentDeck = deepCopyDeck(Deck);
|
||||
setTimeout(200);
|
||||
}
|
||||
|
||||
function createCard(imgSource){
|
||||
let newCard = document.createElement('img');
|
||||
newCard.src = imgSource;
|
||||
newCard.classList.add('card');
|
||||
document.querySelector('.cards2').append(newCard);
|
||||
}
|
||||
|
||||
function cardAvail(num){
|
||||
// Filter available suits that still have cards left
|
||||
const availableCards = ['Clubs', 'Diamonds', 'Hearts', 'Spades'].filter((suit, idx) => num[idx] > 0);
|
||||
|
||||
// Check if there are any available cards
|
||||
if(availableCards.length === 0){
|
||||
console.log('No cards available. Deck is empty.');
|
||||
return; // Prevent further execution if no cards are left
|
||||
return;
|
||||
}
|
||||
|
||||
// Select a random suit from available suits
|
||||
const randomCard = availableCards[Math.floor(Math.random() * availableCards.length)];
|
||||
|
||||
// Ensure that currentDeck[randomCard] exists and has cards
|
||||
if(!currentDeck[randomCard] || currentDeck[randomCard].length === 0){
|
||||
console.log(`Error: ${randomCard} has no cards left.`);
|
||||
return; // Exit if there's an issue with the selected suit
|
||||
return;
|
||||
}
|
||||
|
||||
const cardIndex = Math.floor(Math.random() * currentDeck[randomCard].length);
|
||||
@@ -120,12 +140,16 @@ function cardAvail(num){
|
||||
|
||||
addScore(card);
|
||||
|
||||
document.getElementById('card').src = `./${randomCard}/${card}.png`;
|
||||
createCard(`./${randomCard}/${card}.png`);
|
||||
|
||||
/*document.querySelectorAll('.card').forEach(e => {
|
||||
e.src = `./${randomCard}/${card}.png`;
|
||||
});*/
|
||||
|
||||
currentDeck[randomCard].splice(cardIndex, 1);
|
||||
|
||||
console.log(`Card removed from ${randomCard}: ${card}`);
|
||||
console.log(currentDeck);
|
||||
console.log(`Card removed from ${randomCard}: ${card}`);
|
||||
console.log(currentDeck);
|
||||
}
|
||||
|
||||
function isDeckEmpty() {
|
||||
@@ -133,8 +157,8 @@ function isDeckEmpty() {
|
||||
}
|
||||
|
||||
function addCard(){
|
||||
if (isDeckEmpty()) {
|
||||
currentDeck = {...Deck}; // Reset to the original deck if empty
|
||||
if(isDeckEmpty()){
|
||||
reshuffle();
|
||||
}
|
||||
cardAvail(cardsleft());
|
||||
}
|
||||
|
||||
15
style.css
15
style.css
@@ -17,13 +17,21 @@ body{
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
img.card{
|
||||
img.card{ /* 726 : 500 */
|
||||
aspect-ratio: 1/1;
|
||||
object-fit: contain;
|
||||
height: 200px;
|
||||
margin: .2rem;
|
||||
width: 135px;
|
||||
margin: 0 2rem 0 0;
|
||||
cursor: context-menu;
|
||||
}
|
||||
img.card:last-child{
|
||||
margin: 0;
|
||||
}
|
||||
.cards{
|
||||
height: 200px;
|
||||
margin: .5rem 0;
|
||||
}
|
||||
|
||||
h2{
|
||||
margin-top: .5rem;
|
||||
}
|
||||
@@ -36,4 +44,5 @@ button{
|
||||
margin: .5rem;
|
||||
color: #fff;
|
||||
background: #6b6b6b;
|
||||
cursor: pointer;
|
||||
}
|
||||
Reference in New Issue
Block a user