45 lines
1.3 KiB
Scala
45 lines
1.3 KiB
Scala
package industries.sunshine.planningpoker
|
|
|
|
import scala.scalajs.js
|
|
import com.raquo.laminar.api.L.{*, given}
|
|
import industries.sunshine.planningpoker.common.Models.*
|
|
|
|
object OtherPlayers {
|
|
def render(roomStateSignal: Signal[RoomStateView]): Element = {
|
|
val otherPlayers = roomStateSignal.map { state =>
|
|
state.players.filterNot(_.id == state.me).zipWithIndex
|
|
}
|
|
|
|
div(
|
|
className := "flex flex-row",
|
|
children <-- otherPlayers.split(_._1.id) { (id, initial, playerSignal) =>
|
|
renderPlayer(playerSignal, roomStateSignal.map(_.allowedCards.size))
|
|
}
|
|
)
|
|
}
|
|
|
|
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 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)
|
|
)
|
|
}
|
|
|
|
def renderHandCardBacks(amountSignal: Signal[Int]): Element = {
|
|
def renderCard(index: Int): Element =
|
|
div(
|
|
className := "w-4 h-8 m-1 rounded bg-gray-600 text-yellow"
|
|
)
|
|
|
|
div(
|
|
className := "flex flex-row",
|
|
children <-- amountSignal.map { amount => (1 to amount).map(renderCard) }
|
|
)
|
|
}
|
|
|
|
}
|