compute angle differently for num_seats % 4 === 0 to avoid obscuring the table

diff --git a/site/modules/poker.js b/site/modules/poker.js
index 171af01835cc96a01154fe8b71e257d96fa2e57b..48750ecc76ab5678261e18191751f36d7b4137e2 100644 (file)
--- a/site/modules/poker.js
+++ b/site/modules/poker.js
@@ -307,6 +307,21 @@ export class TexasHoldEm {
         this.set_text("game-error", text);
     }
 
+    player_angle(seat) {
+        const rel_seat = this.my_seat > seat ? this.num_seats + seat - this.my_seat : seat - this.my_seat;
+        if (this.num_seats % 4 === 0) {
+            if (rel_seat < this.num_seats / 4) {
+                return rel_seat * 2 * Math.PI / (this.num_seats + 2);
+            } else if (rel_seat >= this.num_seats / 4 && rel_seat <= 3 * this.num_seats / 4) {
+                return (rel_seat + 1) * 2 * Math.PI / (this.num_seats + 2);
+            } else {
+                return (rel_seat + 2) * 2 * Math.PI / (this.num_seats + 2);
+            }
+        } else {
+            return rel_seat * 2 * Math.PI / this.num_seats;
+        }
+    }
+
     redraw_players() {
         this.fold_control.classList.toggle("active", this.active === this.username && this.chips_to_call() > 0);
         this.call_control.classList.toggle("active", this.active === this.username);
@@ -327,7 +342,7 @@ export class TexasHoldEm {
                 this.user_icons.delete(username);
             } else {
                 const seat = this.seats.get(username);
-                const angle = ((seat - this.my_seat) % this.num_seats) * 2 * Math.PI / this.num_seats;
+                const angle = this.player_angle(seat);
                 const x = 240 - 180 * Math.sin(angle);
                 const y = 240 + 120 * Math.cos(angle) + 60 * (Math.sign(Math.cos(angle)) || 1);
                 user.setAttribute("x", x);
@@ -348,7 +363,7 @@ export class TexasHoldEm {
                 const user = document.createElementNS(svgns, "text");
                 const text = document.createTextNode(username);
                 user.append(text);
-                const angle = ((seat - this.my_seat) % this.num_seats) * 2 * Math.PI / this.num_seats;
+                const angle = this.player_angle(seat);
                 const x = 240 - 180 * Math.sin(angle);
                 const y = 240 + 120 * Math.cos(angle) + 60 * (Math.sign(Math.cos(angle)) || 1);
                 user.setAttribute("x", x);
@@ -385,7 +400,7 @@ export class TexasHoldEm {
     redraw_cards() {
         for (const [username, cards] of this.hands) {
             const seat = this.seats.get(username);
-            const angle = ((seat - this.my_seat) % this.num_seats) * 2 * Math.PI / this.num_seats;
+            const angle = this.player_angle(seat);
             const offset = cards.length * 10;
             let x = 227.5 + offset - 180 * Math.sin(angle);
             const y = 210 + 120 * Math.cos(angle);

diff --git a/site/modules/whist.js b/site/modules/whist.js
index 6a38b99ea4abdacf5ed44587efd54a789dac7bad..0a3170d35936d610e41856ac8b7f850f7654fc1a 100644 (file)
--- a/site/modules/whist.js
+++ b/site/modules/whist.js
@@ -177,6 +177,21 @@ export class KnockOutWhist {
         this.set_text("game-error", text);
     }
 
+    player_angle(seat) {
+        const rel_seat = this.my_seat > seat ? this.num_seats + seat - this.my_seat : seat - this.my_seat;
+        if (this.num_seats % 4 === 0) {
+            if (rel_seat < this.num_seats / 4) {
+                return rel_seat * 2 * Math.PI / (this.num_seats + 2);
+            } else if (rel_seat >= this.num_seats / 4 && rel_seat <= 3 * this.num_seats / 4) {
+                return (rel_seat + 1) * 2 * Math.PI / (this.num_seats + 2);
+            } else {
+                return (rel_seat + 2) * 2 * Math.PI / (this.num_seats + 2);
+            }
+        } else {
+            return rel_seat * 2 * Math.PI / this.num_seats;
+        }
+    }
+
     redraw_players() {
         const active_player = this.call || this.active;
         for (const [username, [icon, tricks, active]] of this.user_icons) {
@@ -187,7 +202,7 @@ export class KnockOutWhist {
                 this.user_icons.delete(username);
             } else {
                 const seat = this.seats.get(username);
-                const angle = ((seat - this.my_seat) % this.num_seats) * 2 * Math.PI / this.num_seats;
+                const angle = this.player_angle(seat);
                 const x = 240 - 180 * Math.sin(angle);
                 const y = 250 + 120 * Math.cos(angle) + 50 * Math.sign(Math.cos(angle));
                 icon.setAttribute("x", x);
@@ -205,7 +220,7 @@ export class KnockOutWhist {
                 const icon = document.createElementNS(svgns, "text");
                 const text = document.createTextNode(username);
                 icon.append(text);
-                const angle = ((seat - this.my_seat) % this.num_seats) * 2 * Math.PI / this.num_seats;
+                const angle = this.player_angle(seat);
                 const x = 240 - 180 * Math.sin(angle);
                 const y = 250 + 120 * Math.cos(angle) + 50 * (Math.sign(Math.cos(angle)) || 1);
                 icon.setAttribute("x", x);
@@ -234,7 +249,7 @@ export class KnockOutWhist {
     redraw_cards() {
         for (const [username, cards] of this.hands) {
             const seat = this.seats.get(username);
-            const angle = ((seat - this.my_seat) % this.num_seats) * 2 * Math.PI / this.num_seats;
+            const angle = this.player_angle(seat);
             const offset = cards.length * 10;
             let x = 227.5 + offset - 180 * Math.sin(angle);
             const y = 210 + 120 * Math.cos(angle);