Merge pull request #2475 from vivekvardhan2810/Pokergame

Poker Game Extension
Sulagna-Dutta-Roy · Jul 21, 2024 · 6cf68e9 · 6cf68e9
2 parents 1fb1abf + e9703ef
commit 6cf68e9
Show file tree

Hide file tree

Showing 5 changed files with 127 additions and 0 deletions.
diff --git a/Poker Game Extension/icon.png b/Poker Game Extension/icon.png
diff --git a/Poker Game Extension/index.html b/Poker Game Extension/index.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Simple Poker Game</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div class="game-container">
+        <div class="player">
+            <h2>Player 1</h2>
+            <div class="hand" id="player1-hand"></div>
+        </div>
+        <div class="player">
+            <h2>Player 2</h2>
+            <div class="hand" id="player2-hand"></div>
+        </div>
+        <div class="community">
+            <h2>Community Cards</h2>
+            <div class="hand" id="community-cards"></div>
+        </div>
+        <button id="deal-button">Deal</button>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Poker Game Extension/manifest.json b/Poker Game Extension/manifest.json
@@ -0,0 +1,15 @@
+{
+    "manifest_version": 3,
+    "name": "Simple Poker Game",
+    "version": "1.0",
+    "description": "A simple poker game extension that combines strategy, skill, and luck.",
+    "action": {
+      "default_popup": "index.html",
+      "default_icon": {
+        "16": "icon.png",
+        "48": "icon.png",
+        "128": "icon.png"
+      }
+    },
+    "permissions": []
+  }  
diff --git a/Poker Game Extension/script.js b/Poker Game Extension/script.js
@@ -0,0 +1,47 @@
+document.getElementById('deal-button').addEventListener('click', dealCards);
+
+function createDeck() {
+    const suits = ['♠', '♥', '♦', '♣'];
+    const ranks = ['2', '3', '4', '5', '6', '7', '8', '9', '10', 'J', 'Q', 'K', 'A'];
+    let deck = [];
+    for (let suit of suits) {
+        for (let rank of ranks) {
+            deck.push(rank + suit);
+        }
+    }
+    return deck;
+}
+
+function shuffleDeck(deck) {
+    for (let i = deck.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [deck[i], deck[j]] = [deck[j], deck[i]];
+    }
+    return deck;
+}
+
+function dealCards() {
+    const deck = shuffleDeck(createDeck());
+    const player1Hand = deck.slice(0, 2);
+    const player2Hand = deck.slice(2, 4);
+    const communityCards = deck.slice(4, 9);
+
+    renderCards('player1-hand', player1Hand);
+    renderCards('player2-hand', player2Hand);
+
+    document.getElementById('community-cards').innerHTML = '';
+    setTimeout(() => renderCards('community-cards', communityCards.slice(0, 3)), 1000);
+    setTimeout(() => renderCards('community-cards', communityCards.slice(0, 4)), 2000);
+    setTimeout(() => renderCards('community-cards', communityCards.slice(0, 5)), 3000);
+}
+
+function renderCards(elementId, cards) {
+    const handElement = document.getElementById(elementId);
+    handElement.innerHTML = '';
+    for (let card of cards) {
+        const cardElement = document.createElement('div');
+        cardElement.className = 'card';
+        cardElement.innerText = card;
+        handElement.appendChild(cardElement);
+    }
+}
diff --git a/Poker Game Extension/styles.css b/Poker Game Extension/styles.css
@@ -0,0 +1,38 @@
+body {
+    font-family: Arial, sans-serif;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    background-color: #2d2d2d;
+    color: #ffffff;
+    margin: 0;
+}
+
+.game-container {
+    text-align: center;
+}
+
+.player, .community {
+    margin-bottom: 20px;
+}
+
+.hand {
+    display: flex;
+    justify-content: center;
+    margin-top: 10px;
+}
+
+.card {
+    width: 60px;
+    height: 90px;
+    background-color: #ffffff;
+    color: #000000;
+    border: 1px solid #000000;
+    border-radius: 5px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 0 5px;
+    font-size: 20px;
+}