Add files via upload

ZETRO2 · Jan 14, 2024 · c559b59 · c559b59
1 parent c321740
commit c559b59
Show file tree

Hide file tree

Showing 23 changed files with 525 additions and 0 deletions.
diff --git a/halloween1.png b/halloween1.png
diff --git a/hive.mp3 b/hive.mp3
diff --git a/images/10.png b/images/10.png
diff --git a/images/2.png b/images/2.png
diff --git a/images/3.png b/images/3.png
diff --git a/images/4.png b/images/4.png
diff --git a/images/5.png b/images/5.png
diff --git a/images/6.png b/images/6.png
diff --git a/images/7.png b/images/7.png
diff --git a/images/8.png b/images/8.png
diff --git a/images/9.png b/images/9.png
diff --git a/images/A.png b/images/A.png
diff --git a/images/J.png b/images/J.png
diff --git a/images/K.png b/images/K.png
diff --git a/images/Q.png b/images/Q.png
diff --git a/index.html b/index.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width">
+  <title>Blackjack</title>
+  <link href="style.css" rel="stylesheet" type="text/css" />
+</head>
+
+<body>
+  <audio src="./hive.mp3" autoplay loop></audio>
+  <div class="container">
+    <h1 class="message">
+      HALLOWIN <br />BLACK JACK
+    </h1>
+    <h2><span id="blackjack-result">Let's Play</span></h2>
+
+    <div class="flex-blackjack-row-1">
+      <table>
+        <tr>
+          <th id="win-header">Wins</th>
+          <th id="loss-header">Losses</th>
+          <th id="draw-header">Draws</th>
+        </tr>
+
+        <tr>
+          <td><span id="wins">0</span></td>
+          <td><span id="losses">0</span></td>
+          <td><span id="draws">0</span></td>
+        </tr>
+      </table>
+    </div>
+
+    <div class="flex-blackjack-row-2">
+      <div id="your-box">
+        <h2>You: <span id="your-blackjack-result">0</span></h2>
+      </div>
+
+      <div id="dealer-box">
+        <h2>Dealer: <span id="dealer-blackjack-result">0</span></h2>
+      </div>
+    </div>
+
+    <div class="flex-blackjack-row-3">
+      <div>
+        <button id="blackjack-hit-button">Hit</button>
+        <button id="blackjack-stand-button">Stand</button>
+        <button id="blackjack-deal-button">Deal</button>
+        <button id="blackjack-restart-button">Restart</button>
+      </div>
+    </div>
+  </div>
+  <script src="script.js"></script>
+</body>
+
+</html>
diff --git a/plasdrip.ttf b/plasdrip.ttf
diff --git a/replit.nix b/replit.nix
@@ -0,0 +1,6 @@
+{ pkgs }: {
+  deps = [
+    pkgs.nodePackages.vscode-langservers-extracted
+    pkgs.nodePackages.typescript-language-server  
+  ];
+}
diff --git a/script.js b/script.js
@@ -0,0 +1,265 @@
+let blackjackGame = {
+  you: {
+    scoreSpan: "#your-blackjack-result",
+    div: "#your-box",
+    boxSize: ".flex-blackjack-row-2 div",
+    score: 0,
+  },
+
+  dealer: {
+    scoreSpan: "#dealer-blackjack-result",
+    div: "#dealer-box",
+    boxSize: ".flex-blackjack-row-2 div",
+    score: 0,
+  },
+
+  cards: ["2","3","4","5","6","7","8","9","10","K","J","Q","A"],
+
+  cardsMap: {
+    2: 2,
+    3: 3,
+    4: 4,
+    5: 5,
+    6: 6,
+    7: 7,
+    8: 8,
+    9: 9,
+    10: 10,
+    K: 10,
+    J: 10,
+    Q: 10,
+    A: [1,11],
+  },
+
+  wins: 0,
+  losses: 0,
+  draws: 0,
+  isStand: false,
+  isTurnsOver: false,
+  pressOnce: false,
+};
+
+const YOU = blackjackGame["you"];
+const DEALER = blackjackGame["dealer"];
+
+const hitSound = new Audio("sounds/swish.m4a");
+const winSound = new Audio("sounds/cash.mp3");
+const loseSound = new Audio("sounds/aww.mp3");
+
+let windowWidth = window.screen.width;
+let windowHeight = window.screen.height;
+let winner;
+
+//Button Event Listeners
+document
+  .querySelector("#blackjack-hit-button")
+  .addEventListener("click", blackjackHit);
+
+document
+  .querySelector("#blackjack-stand-button")
+  .addEventListener("click", blackjackStand);
+
+document
+  .querySelector("#blackjack-deal-button")
+  .addEventListener("click", blackjackDeal);
+
+document
+  .querySelector("#blackjack-restart-button")
+  .addEventListener("click", blackjackRestart);
+
+
+function blackjackHit(){
+  if(blackjackGame["isStand"] === false){
+    let card = randomCard();
+    showCard(card, YOU);
+    updateScore(card,YOU);
+    showScore(YOU);
+  }
+}
+
+function randomCard(){
+  let randomIndex = Math.floor(Math.random() * 13);
+  return blackjackGame["cards"][randomIndex];
+}
+
+function showCard(card, activePlayer){
+  if (activePlayer["score"] <= 21) {
+    let cardImage = document.createElement("img");
+    cardImage.src = `images/${card}.png`;
+    cardImage.style = `width: ${widthSize()}; height:${heightSize()};`;
+    document.querySelector(activePlayer["div"]).appendChild(cardImage);
+    hitSound.play();
+  } 
+}
+
+function widthSize() {
+  if (windowWidth > 1000){
+    let newWidthSize = window.screen.width * 0.1;
+    return newWidthSize;
+  } else{
+    return window.screen.width * 0.18;
+  }
+}
+
+function heightSize(){
+  if(windowHeight > 700){
+    let newHeightSize = window.screen.height * 0.18;
+    return newHeightSize;
+  } else{
+    return window.screen.height * 0.15;
+  }
+}
+
+function updateScore(card, activePlayer){
+  if(card === 'A'){
+    if( activePlayer["score"] + blackjackGame["cardsMap"][card][1] <= 21){
+      activePlayer["score"] += blackjackGame["cardsMap"][card][1];
+    }
+    else{
+      activePlayer["score"] += blackjackGame["cardsMap"][card][0];
+    }
+  }
+  else{
+    activePlayer["score"] += blackjackGame["cardsMap"][card];
+  }
+}
+
+function showScore(activePlayer){
+  if (activePlayer["score"] > 21){
+    document.querySelector(activePlayer["scoreSpan"]).textContent = "BUST!";
+    document.querySelector(activePlayer["scoreSpan"]).style.color = "red";
+  } else{
+    document.querySelector(activePlayer["scoreSpan"]).textContent = activePlayer["score"];
+  }
+}
+
+function blackjackStand(){
+  if (blackjackGame.pressOnce === false) {
+    blackjackGame["isStand"] = true;
+    let yourImages = document
+      .querySelector("#your-box")
+      .querySelectorAll("img");
+
+
+    for (let i = 0; i < yourImages.length; i++) {
+      let card = randomCard();
+      showCard(card, DEALER);
+      updateScore(card, DEALER);
+      showScore(DEALER);
+    }
+
+    blackjackGame["isTurnsOver"] = true;
+
+    computeWinner();
+    showWinner(winner);
+
+  }
+
+
+  blackjackGame.pressOnce = true;
+}
+
+function computeWinner()
+  {
+  if (YOU['score'] <= 21){
+    if(YOU['score'] > DEALER['score'] || DEALER['score'] > 21)
+    {
+      winner = YOU;
+    }
+
+    else if (YOU['score'] < DEALER['score']){
+      winner = DEALER;
+    }
+
+    else if(YOU['score'] === DEALER['score']){
+      winner = "Draw"
+    }
+  }
+
+  else if(YOU['score'] > 21 && DEALER['score'] <= 21){
+    winner = DEALER;
+  }
+
+  else if(YOU['score'] > 21 && DEALER['score'] >21){
+    winner = "None"
+  }
+
+  return winner;
+}
+
+function showWinner(){
+  let message , messageColor;
+
+  if(winner === YOU){
+    message = 'You Won!';
+    messageColor = '#00e676';
+    document.querySelector('#wins').textContent = blackjackGame['wins']+=1;
+    winSound.play();
+  }
+
+  if(winner === DEALER){
+    message = 'You Lost!';
+    messageColor = 'red';
+    document.querySelector('#losses').textContent = blackjackGame['losses']+=1;
+    loseSound.play();
+  }
+
+  if(winner === 'Draw'){
+    message = 'You Drew!';
+    messageColor = 'yellow';
+    document.querySelector('#draws').textContent = blackjackGame['draws']+=1;
+    loseSound.play();
+  }
+
+  if(winner === 'None'){
+    message = 'You Both Busted!';
+    messageColor = 'orange';
+    loseSound.play();
+  }
+
+  document.querySelector('#blackjack-result').textContent = message;
+  document.querySelector('#blackjack-result').style.color = messageColor;
+}
+
+
+function blackjackDeal(){
+
+  if(blackjackGame['isTurnsOver'] === true)
+  {
+
+    let yourImages = document.querySelector('#your-box').querySelectorAll('img');
+    let dealerImages = document.querySelector('#dealer-box').querySelectorAll('img');
+
+    YOU['score'] = DEALER['score'] = 0;
+    document.querySelector('#your-blackjack-result').textContent = 0;
+    document.querySelector('#dealer-blackjack-result').textContent = 0;
+
+    document.querySelector('#your-blackjack-result').style.color = 'white';
+    document.querySelector('#dealer-blackjack-result').style.color = 'white';
+
+    document.querySelector('#blackjack-result').textContent = "Let's Play";
+    document.querySelector("#blackjack-result").style.color = 'white';
+
+    for(let i = 0; i < yourImages.length; i++){
+      yourImages[i].remove();
+      dealerImages[i].remove();
+    }
+
+    blackjackGame["isStand"] = false;
+    blackjackGame.pressOnce = false;
+    blackjackGame["isTurnsOver"] = false;
+  }
+}
+
+function blackjackRestart(){
+
+  blackjackDeal();
+  document.querySelector('#wins').textContent=0;
+  document.querySelector('#losses').textContent=0;
+  document.querySelector('#draws').textContent=0;
+
+  blackjackGame.wins = 0;
+  blackjackGame.losses = 0;
+  blackjackGame.draws = 0;
+
+}
diff --git a/sounds/aww.mp3 b/sounds/aww.mp3
diff --git a/sounds/cash.mp3 b/sounds/cash.mp3
diff --git a/sounds/swish.m4a b/sounds/swish.m4a