display pot size

diff --git a/site/modules/poker.js b/site/modules/poker.js
index fedc9a0d62be2015db31e6cc0fb80398f3730075..171af01835cc96a01154fe8b71e257d96fa2e57b 100644 (file)
--- a/site/modules/poker.js
+++ b/site/modules/poker.js
@@ -72,6 +72,14 @@ export class TexasHoldEm {
         felt.setAttribute("fill", "green");
         this.svg.append(felt);
 
+        const pot_size = document.createElementNS(svgns, "text");
+        pot_size.setAttribute("x", "400");
+        pot_size.setAttribute("y", "250");
+        pot_size.classList.add("pot-size");
+        this.pot_size_text = document.createTextNode("");
+        pot_size.append(this.pot_size_text);
+        this.svg.append(pot_size);
+
         const controls = document.createElementNS(svgns, "rect");
         controls.setAttribute("x", "310");
         controls.setAttribute("y", "410");
@@ -309,6 +317,7 @@ export class TexasHoldEm {
         this.bet_slider.classList.toggle("active", can_bet);
         this.bet_size_text.textContent = this.min_bet();
         this.bet_slider_thumb.setAttribute("x", 360);
+        this.pot_size_text.textContent = this.pot || "";
         for (const [username, [user, stack, active, bet]] of this.user_icons) {
             if (!this.seats.has(username)) {
                 this.svg.removeChild(user);

diff --git a/site/style/poker.css b/site/style/poker.css
index beb9a58d3e271687a847c1460652334cb11e0088..cfa37acb002640692836a4884e33432b301c5f46 100644 (file)
--- a/site/style/poker.css
+++ b/site/style/poker.css
@@ -32,6 +32,12 @@
     text-anchor: middle;
 }
 
+.pot-size {
+    pointer-events: none;
+    text-anchor: middle;
+    font-size: 14pt;
+}
+
 .bet-size {
     pointer-events: none;
     text-anchor: middle;