Skip to content

Commit

Permalink
Add more player view
Browse files Browse the repository at this point in the history
  • Loading branch information
@klydra
klydra committed Mar 1, 2023
1 parent 2c072a3 commit 00d780e
Show file tree
Hide file tree
Showing 5 changed files with 452 additions and 209 deletions.
12 changes: 6 additions & 6 deletions server/main.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -515,14 +515,14 @@ func main() {

game.Set("globals", globalsUpdated)
}
}

// Remove player from ongoing game
index, err := playerIndexByName(player.GetString("name"), players)
if err != nil {
return err
}
players = append(players[:index], players[index+1:]...)
// Remove player from ongoing game
index, err := playerIndexByName(player.GetString("name"), players)
if err != nil {
return err
}
players = append(players[:index], players[index+1:]...)

// Save players to game
playersUpdated, err := playersFromStruct(players)
Expand Down
215 changes: 147 additions & 68 deletions src/components/game/session/rows/RowLeft.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,85 +25,164 @@ export default function RowLeft(props: {
enemy!.cards < 2 &&
enemy!.name === sessionLast(props.session)
: null;
const divide = !full
? Array.from(
{ length: Math.round(props.session.enemies.length / 3) },
(_, i) => i + 1
)
: null;

return (
<div className="fixed w-44 h-[80%] inset-y-[10%] left-[1%] rotate-180 flex flex-col gap-y-3 justify-center items-start">
{full ? (
<>
<div className="w-full mb-6 h-20 flex justify-end drop-shadow-2xl">
if (full)
return (
<div className="fixed w-44 h-[80%] inset-y-[10%] left-[1%] rotate-180 flex flex-col gap-y-3 justify-center items-start">
<div className="w-full mb-6 h-20 flex justify-end drop-shadow-2xl">
<div
className="h-20 w-20 rounded-xl"
style={{
cursor: swapping || callable! ? "pointer" : "",
}}
onClick={
swapping
? async () => {
const swap = await gameSwitch(enemy!.name);
if (swap["code"] !== 200) {
showNotification({
autoClose: API_NOTIFICATION_GAME_TIMEOUT,
message:
swap["message"] ?? "An unknown error occurred.",
color: "red",
icon: <SwapHoriz />,
});
}
}
: callable!
? async () => {
const appeal = await gameAppeal(enemy!.name);
if (appeal["code"] !== 200) {
showNotification({
autoClose: API_NOTIFICATION_GAME_TIMEOUT,
message:
appeal["message"] ?? "An unknown error occurred.",
color: "red",
icon: <SwapHoriz />,
});
}
}
: undefined
}
>
<div
className="h-20 w-20 rounded-xl"
style={{
cursor: swapping || callable! ? "pointer" : "",
className="h-20 w-20 rounded-xl overflow-hidden absolute z-10 rotate-180"
dangerouslySetInnerHTML={{
__html: enemy!.called
? calledAvatar(enemy!.avatar)
: enemy!.avatar,
}}
onClick={
swapping
? async () => {
const swap = await gameSwitch(enemy!.name);
if (swap["code"] !== 200) {
showNotification({
autoClose: API_NOTIFICATION_GAME_TIMEOUT,
message:
swap["message"] ?? "An unknown error occurred.",
color: "red",
icon: <SwapHoriz />,
});
}
}
></div>
<div
className="m-2 h-16 w-16 rounded-xl bg-contrast duration-300 absolute animate-ping"
style={{
display: enemy!.live || swapping || callable! ? "" : "none",
backgroundColor: enemy!.called
? "gold"
: swapping
? "orange"
: callable!
? async () => {
const appeal = await gameAppeal(enemy!.name);
if (appeal["code"] !== 200) {
showNotification({
autoClose: API_NOTIFICATION_GAME_TIMEOUT,
message:
appeal["message"] ?? "An unknown error occurred.",
color: "red",
icon: <SwapHoriz />,
});
}
}
: undefined
}
? "red"
: "",
}}
></div>
</div>
</div>
{[...Array(enemy!.cards)].map((_, index) => {
return (
<div
style={{
zIndex: index,
maxHeight: (1 / enemy!.cards) * props.scale + "rem",
}}
className=""
>
<div
className="h-20 w-20 rounded-xl overflow-hidden absolute z-10 rotate-180"
dangerouslySetInnerHTML={{
__html: enemy!.called
? calledAvatar(enemy!.avatar)
: enemy!.avatar,
}}
></div>
<div
className="m-2 h-16 w-16 rounded-xl bg-contrast duration-300 absolute animate-ping"
style={{
display: enemy!.live || swapping || callable! ? "" : "none",
backgroundColor: enemy!.called
? "gold"
: swapping
? "orange"
: callable!
? "red"
: "",
}}
></div>
<EnemyCardRotated />
</div>
</div>
{[...Array(enemy!.cards)].map((_, index) => {
return (
);
})}
</div>
);

return (
<div className="fixed w-44 h-[80%] inset-y-[10%] left-[1%] flex flex-col gap-y-4 justify-center items-start">
{divide!.map((index) => {
console.log(divide);
const enemy = props.session.enemies.find((item) => item.spot === index);

return (
<div className="ml-2 flex justify-center items-center">
<div className="w-full h-16 mr-3.5 flex justify-end drop-shadow-2xl">
<div
className="h-16 w-16 rotate-180 rounded-xl"
style={{
zIndex: index,
maxHeight: (1 / enemy!.cards) * props.scale + "rem",
cursor: swapping || callable! ? "pointer" : "",
}}
className=""
onClick={
swapping
? async () => {
const swap = await gameSwitch(enemy!.name);
if (swap["code"] !== 200) {
showNotification({
autoClose: API_NOTIFICATION_GAME_TIMEOUT,
message:
swap["message"] ?? "An unknown error occurred.",
color: "red",
icon: <SwapHoriz />,
});
}
}
: callable!
? async () => {
const appeal = await gameAppeal(enemy!.name);
if (appeal["code"] !== 200) {
showNotification({
autoClose: API_NOTIFICATION_GAME_TIMEOUT,
message:
appeal["message"] ?? "An unknown error occurred.",
color: "red",
icon: <SwapHoriz />,
});
}
}
: undefined
}
>
<EnemyCardRotated />
<div
className="h-16 w-16 rounded-xl overflow-hidden absolute z-10 rotate-180"
dangerouslySetInnerHTML={{
__html: enemy!.called
? calledAvatar(enemy!.avatar)
: enemy!.avatar,
}}
></div>
<div
className="m-2 h-12 w-12 rounded-xl bg-contrast duration-300 absolute animate-ping"
style={{
display: enemy!.live || swapping || callable! ? "" : "none",
backgroundColor: enemy!.called
? "gold"
: swapping
? "orange"
: callable!
? "red"
: "",
}}
></div>
</div>
);
})}
</>
) : null}
</div>
<div className="flex justify-center items-center rounded-[50%] w-10 h-10 p-2 font-bold text-background font-[1.1rem] aspect-square bg-contrast">
{enemy!.cards}
</div>
</div>
);
})}
</div>
);
}
Loading

0 comments on commit 00d780e

Please sign in to comment.