39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
import { createSignal, useContext } from "solid-js";
|
|
import { playerColor, profile } from "~/profile";
|
|
import { TableContext } from "./Table";
|
|
import { Stylable } from "./toolbox";
|
|
import { createObservable, createObservableWithInit } from "~/fn";
|
|
import { GameContext } from "./Game";
|
|
|
|
export default (props: { playerKey: string } & Stylable) => {
|
|
const table = useContext(TableContext);
|
|
const playerReady =
|
|
table?.wsEvents
|
|
.filter((evt) => evt.playersReady != null)
|
|
.map((evt) => evt.playersReady![props.playerKey])
|
|
.thru((Evt) => createObservableWithInit(Evt, false)) ??
|
|
createSignal(false)[0];
|
|
|
|
const game = useContext(GameContext);
|
|
|
|
return (
|
|
<div
|
|
id={`player-${props.playerKey}`}
|
|
style={{
|
|
...props.style,
|
|
"background-color": playerColor(props.playerKey),
|
|
...(playerReady() && table?.view() == null
|
|
? {
|
|
border: "10px solid green",
|
|
}
|
|
: {}),
|
|
}}
|
|
class={`${props.class} w-20 h-20 rounded-full flex justify-center items-center`}
|
|
>
|
|
<p style={{ "font-size": "1em" }}>
|
|
{profile(props.playerKey)()?.name}
|
|
</p>
|
|
</div>
|
|
);
|
|
};
|