From 42e092e747c1bffe53961ecd9cc7c4e3a9046e80 Mon Sep 17 00:00:00 2001
From: efim <efim.nefedov@nordigy.ru>
Date: Sat, 22 Apr 2023 00:38:27 +0400
Subject: [PATCH] some absolute positioning for other players

---
 .../industries/sunshine/planningpoker/Models.scala |  5 +++--
 .../sunshine/planningpoker/RoomView.scala          | 14 +++++++++-----
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/main/scala/industries/sunshine/planningpoker/Models.scala b/src/main/scala/industries/sunshine/planningpoker/Models.scala
index a6a829b..c3f074a 100644
--- a/src/main/scala/industries/sunshine/planningpoker/Models.scala
+++ b/src/main/scala/industries/sunshine/planningpoker/Models.scala
@@ -38,11 +38,12 @@ object RoomStateView {
     val me = Player("wormy", PlayerID())
     val pony = Player("pony", PlayerID())
     val birdy = Player("birdy", PlayerID())
+    val horsey = Player("horsey", PlayerID())
     RoomStateView(
-      players = List(me, birdy, pony),
+      players = List(me, birdy, pony, horsey),
       me = me.id,
       allowedCards = List("xs", "s", "m", "l", "xl"),
-      round = ViewingRound(Map( me.id -> "xs", pony.id -> "l", birdy.id -> "s" )),
+      round = ViewingRound(Map( me.id -> "xs", pony.id -> "l", birdy.id -> "s", horsey.id -> "m" )),
       canCloseRound = true
     )
   }
diff --git a/src/main/scala/industries/sunshine/planningpoker/RoomView.scala b/src/main/scala/industries/sunshine/planningpoker/RoomView.scala
index f42e2d4..11268cd 100644
--- a/src/main/scala/industries/sunshine/planningpoker/RoomView.scala
+++ b/src/main/scala/industries/sunshine/planningpoker/RoomView.scala
@@ -10,15 +10,16 @@ object RoomView {
   // NOTE i guess "other players" would have to be in circle with 'me' as empty space in the bottom
   def renderRoom(state: RoomStateView): Element = {
     val roomStateSignal = Var(state).signal
+    // i want to number other players, for the star arrangement
     val otherPlayers = roomStateSignal.map { state =>
-      state.players.filterNot(_.id == state.me)
+      state.players.filterNot(_.id == state.me).zipWithIndex
     }
 
     div(
       className := "w-full h-full border-4 border-amber-900 flex flex-col",
       div(
         className := "flex flex-row",
-        children <-- otherPlayers.split(_.id) { (id, initial, playerSignal) =>
+        children <-- otherPlayers.split(_._1.id) { (id, initial, playerSignal) =>
           renderPlayer(playerSignal, roomStateSignal.map(_.allowedCards.size))
         }
       ),
@@ -26,10 +27,13 @@ object RoomView {
     )
   }
 
-  def renderPlayer(p: Signal[Player], cardsAmount: Signal[Int]): Element = {
+  def renderPlayer(p: Signal[(Player, Int)], cardsAmount: Signal[Int]): Element = {
+    val xOffsetStyleSignal = p.map(_._2)
     div(
-      className := "w-20 h-20 border-2 border-amber-400 m-2",
-      child.text <-- p.map(_.name),
+      className := "w-20 h-20 border-2 border-amber-400 m-2 absolute",
+      // left <-- p.map(tuple => ((1 + tuple._2) * 10000).toString()),
+      styleAttr <-- p.map(tuple => s"left: ${(1 + tuple._2) * 100}px"),
+      child.text <-- p.map(_._1.name),
       renderHandCardBacks(cardsAmount)
     )
   }