Skip to content

Commit

Permalink
Integrate Dark Shuffle Tournament (#290)
Browse files Browse the repository at this point in the history
* update

* update ds tournament config
  • Loading branch information
starknetdev authored Jan 22, 2025
1 parent 2d01c5f commit 31a9626
Show file tree
Hide file tree
Showing 12 changed files with 196 additions and 84 deletions.
2 changes: 1 addition & 1 deletion indexer/src/utils/encode.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { hash, num } from "https://esm.sh/starknet@5.19.5";
import { hash } from "https://esm.sh/starknet@6.16.0";

export function encodeIntAsBytes(n: bigint): string {
const arr = new Uint8Array(32);
Expand Down
2 changes: 1 addition & 1 deletion indexer/src/utils/events.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { hash } from "https://esm.sh/starknet@5.19.5";
import { hash } from "https://esm.sh/starknet@6.16.0";

import {
combineParsers,
Expand Down
5 changes: 4 additions & 1 deletion ui/.env
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
NEXT_PUBLIC_NETWORK="mainnet"
NEXT_PUBLIC_TOURNAMENT_ENDED="true"
NEXT_PUBLIC_SEASON_ACTIVE="false"
NEXT_PUBLIC_SEASON_ACTIVE="false"
NEXT_PUBLIC_DS_TOURNAMENT_ACTIVE="true"
NEXT_PUBLIC_DS_TOURNAMENT_ID=1
NEXT_PUBLIC_DS_TOURNAMENT_START_TIME=1737727200
6 changes: 6 additions & 0 deletions ui/public/ds-icon.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 8 additions & 0 deletions ui/public/ls-seal.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
67 changes: 3 additions & 64 deletions ui/src/app/components/navigation/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,10 @@ import useUIStore from "@/app/hooks/useUIStore";
import { soundSelector, useUiSounds } from "@/app/hooks/useUiSound";
import { checkCartridgeConnector } from "@/app/lib/connectors";
import { vitalityIncrease } from "@/app/lib/constants";
import { networkConfig } from "@/app/lib/networkConfig";
import {
displayAddress,
formatNumber,
getItemData,
getItemPrice,
indexAddress,
processItemName,
} from "@/app/lib/utils";
import {
Expand All @@ -39,9 +36,7 @@ import {
} from "@/app/types";
import CartridgeConnector from "@cartridge/connector/controller";
import { useConnect, useDisconnect } from "@starknet-react/core";
import Eth from "public/icons/eth.svg";
import Logo from "public/icons/logo.svg";
import Lords from "public/icons/lords.svg";
import { useCallback, useEffect, useRef, useState } from "react";
import { Contract } from "starknet";

Expand Down Expand Up @@ -78,7 +73,6 @@ export default function Header({
const setDisplayCart = useUIStore((state) => state.setDisplayCart);
const displayHistory = useUIStore((state) => state.displayHistory);
const setScreen = useUIStore((state) => state.setScreen);
const network = useUIStore((state) => state.network);
const setNetwork = useUIStore((state) => state.setNetwork);
const onMainnet = useUIStore((state) => state.onMainnet);
const onKatana = useUIStore((state) => state.onKatana);
Expand All @@ -95,10 +89,6 @@ export default function Header({
const displayCartButtonRef = useRef<HTMLButtonElement>(null);
const displayHistoryButtonRef = useRef<HTMLButtonElement>(null);

const [showLordsBuy, setShowLordsBuy] = useState(false);

const lordsGameCost = Number(costToPlay);

const checkCartridge = checkCartridgeConnector(connector);

const [notification, setNotification] = useState<any[]>([]);
Expand Down Expand Up @@ -361,58 +351,7 @@ export default function Header({
>
{onMainnet ? "Play on Testnet" : "Play on Mainnet"}
</Button>
{!onKatana && (
<div className="hidden sm:flex flex-row">
<Button
size={"xs"}
variant={"outline"}
className="self-center xl:px-5"
>
<span className="flex flex-row items-center justify-between w-full">
<Eth className="self-center sm:w-5 sm:h-5 h-3 w-3 fill-current mr-1" />
<p>
{formatNumber(parseInt(ethBalance.toString()) / 10 ** 18)}
</p>
</span>
</Button>
<Button
size={"xs"}
variant={"outline"}
className="self-center xl:px-5 hover:bg-terminal-green"
onClick={async () => {
if (onMainnet) {
const avnuLords = `https://app.avnu.fi/en?tokenFrom=${indexAddress(
networkConfig[network!].ethAddress ?? ""
)}&tokenTo=${indexAddress(
networkConfig[network!].lordsAddress ?? ""
)}&amount=0.001`;
window.open(avnuLords, "_blank");
} else {
await mintLords(lordsGameCost * 25);
}
}}
onMouseEnter={() => setShowLordsBuy(true)}
onMouseLeave={() => setShowLordsBuy(false)}
>
<span className="flex flex-row items-center justify-between w-full">
{!showLordsBuy ? (
<>
<Lords className="self-center sm:w-5 sm:h-5 h-3 w-3 fill-current mr-1" />
<p>
{formatNumber(
parseInt(lordsBalance.toString()) / 10 ** 18
)}
</p>
</>
) : (
<p className="text-black">
{onMainnet ? "Buy Lords" : "Mint Lords"}
</p>
)}
</span>
</Button>
</div>
)}

<Button
size={"xs"}
variant={"outline"}
Expand Down Expand Up @@ -529,7 +468,7 @@ export default function Header({
</Button>
<div className="relative">
<Button
variant={"outline"}
variant={account ? "token" : "outline"}
size={"sm"}
onClick={() => {
if (account) {
Expand Down Expand Up @@ -562,7 +501,7 @@ export default function Header({
)}
</Button>
{checkCartridge && (
<div className="absolute top-0 right-0">
<div className="absolute top-0 right-2">
<CartridgeIcon className="w-5 h-5 fill-current" />
</div>
)}
Expand Down
5 changes: 2 additions & 3 deletions ui/src/app/components/start/CreateAdventurer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,6 @@ export const CreateAdventurer = ({

useEffect(() => {
handleGetLordsValue();
console.log(lordsValue);
}, [lordsValue]);

return (
Expand Down Expand Up @@ -167,10 +166,10 @@ export const CreateAdventurer = ({
) : (
<div className="flex flex-col items-center w-full gap-2 sm:gap-5">
<h3 className="uppercase text-center 2xl:text-5xl m-0">
Season Ended
No Season Active
</h3>
<p className="sm:text-xl text-center uppercase">
The season has ended. Stay tuned for the next one.
The previous season has ended. Stay tuned for the next one.
</p>
</div>
)}
Expand Down
120 changes: 120 additions & 0 deletions ui/src/app/components/start/DSTournamentOverview.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,120 @@
import { Button } from "@/app/components/buttons/Button";
import useUIStore from "@/app/hooks/useUIStore";
import { networkConfig } from "@/app/lib/networkConfig";
import DS_ICON from "public/ds-icon.svg";
import LORDS from "public/icons/lords.svg";
import LS_SEAL from "public/ls-seal.svg";

interface DSTournamentOverviewProps {
lordsCost: bigint;
}

const DarkShuffleOverview = ({ lordsCost }: DSTournamentOverviewProps) => {
const { network } = useUIStore();

const tournamentStart = process.env.NEXT_PUBLIC_DS_TOURNAMENT_START_TIME;

const startDate = new Date(Number(tournamentStart) * 1000);

console.log(tournamentStart, startDate);

return (
<div className="flex flex-col w-full">
<div className="flex flex-row gap-5 w-full py-4 uppercase h-[525px]">
<div className="w-full flex flex-col gap-10">
<div className="flex flex-col gap-10 w-full h-full items-center">
<h1 className="text-4xl">Welcome to the Dark Shuffle Tournament</h1>
<div className="flex flex-row items-center justify-between w-1/3">
<span className="w-12">
<LS_SEAL />
</span>
<span className="text-8xl">X</span>
<span className="w-20">
<DS_ICON />
</span>
</div>
</div>
<div className="flex flex-row justify-center gap-10">
<div className="flex flex-col items-center w-1/4">
<span className="text-4xl uppercase">Prizes</span>
<div className="flex flex-col gap-2 items-center justify-center border border-terminal-green w-full h-40 p-5">
<div className="flex flex-col items-center">
<span className="text-xl">
1<sup className="text-sm">st</sup> - 3
<sup className="text-sm">rd</sup>
</span>
<div className="flex flex-row items-center gap-2">
<span className="text-xl uppercase">
Premium Prize pool
</span>
<span className="text-sm">(50%:30%:20%)</span>
</div>
</div>
<div className="flex flex-col items-center text-terminal-yellow">
<span className="text-xl">
1<sup className="text-sm">st</sup> - 20
<sup className="text-sm">th</sup>
</span>
<div className="flex flex-row items-center gap-2">
<span className="text-xl uppercase">
5 Dark Shuffle Games
</span>
<span className="text-sm">(Each)</span>
</div>
</div>
</div>
</div>
<div className="flex flex-col items-center w-1/2">
<span className="text-4xl uppercase">Details</span>
<div className="flex flex-col gap-2 border border-terminal-green w-full h-40 p-5">
<div className="flex flex-row justify-between text-2xl">
<span className="uppercase">Duration:</span>
<span>72 Hours</span>
</div>
<div className="flex flex-row justify-between text-2xl">
<span className="uppercase">Starts:</span>
<span>{startDate.toLocaleString()}</span>
</div>
<div className="flex flex-row justify-between text-2xl">
<span className="uppercase">Entry Fee:</span>
<div className="flex flex-row gap-2">
<span className="flex flex-row items-center gap-2 fill-current">
5
<span className="w-5 h-5">
<LORDS />
</span>
<sup className="text-sm">To Enter</sup>
</span>
+
<span className="flex flex-row items-center gap-2 fill-current">
{(lordsCost ? lordsCost! / 10n ** 18n : 0).toString()}
<span className="w-5 h-5">
<LORDS />
</span>
<sup className="text-sm">Game Cost</sup>
</span>
</div>
</div>
</div>
</div>
</div>
<div className="flex justify-center">
<Button
className="!w-60 !h-16 !text-2xl animate-pulse"
onClick={() => {
window.open(
`${networkConfig[network!].tournamentAppUrl}`,
"_blank"
);
}}
>
Register
</Button>
</div>
</div>
</div>
</div>
);
};

export default DarkShuffleOverview;
44 changes: 43 additions & 1 deletion ui/src/app/containers/AdventurerScreen.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { Button } from "@/app/components/buttons/Button";
import ButtonMenu from "@/app/components/menu/ButtonMenu";
import { AdventurersList } from "@/app/components/start/AdventurersList";
import { CreateAdventurer } from "@/app/components/start/CreateAdventurer";
import DSTournamentOverview from "@/app/components/start/DSTournamentOverview";
import useAdventurerStore from "@/app/hooks/useAdventurerStore";
import useNetworkAccount from "@/app/hooks/useNetworkAccount";
import { useQueriesStore } from "@/app/hooks/useQueryStore";
Expand Down Expand Up @@ -74,6 +75,9 @@ export default function AdventurerScreen({
const { account } = useNetworkAccount();
const owner = account?.address ? padAddress(account.address) : "";

const isDSTournamentActive =
process.env.NEXT_PUBLIC_DS_TOURNAMENT_ACTIVE === "true";

const menu = [
{
id: 1,
Expand All @@ -97,18 +101,56 @@ export default function AdventurerScreen({
},
];

const dsTournamentMenu = [
{
id: 1,
label: "Dark Shuffle Tournament",
value: "ds tournament",
action: () => {
setStartOption("ds tournament");
},
disabled: false,
},
{
id: 2,
label: "Create Adventurer",
value: "create adventurer",
action: () => {
setStartOption("create adventurer");
setAdventurer(NullAdventurer);
resetData("adventurerByIdQuery");
},
disabled: false,
},
{
id: 3,
label: "Choose Adventurer",
value: "choose adventurer",
action: () => {
setStartOption("choose adventurer");
},
disabled: false,
},
];

return (
<div className="flex flex-col sm:flex-row w-full h-full">
<div className="w-full sm:w-1/6 h-10">
<ButtonMenu
buttonsData={menu}
buttonsData={isDSTournamentActive ? dsTournamentMenu : menu}
onSelected={(value) => setStartOption(value)}
isActive={activeMenu == 0}
setActiveMenu={setActiveMenu}
className="sm:flex-col h-full"
/>
</div>

{startOption === "ds tournament" && (
<div className="w-5/6 h-full">
<DSTournamentOverview lordsCost={costToPlay} />
</div>
)}

{startOption === "create adventurer" && (
<div className="flex flex-col w-5/6 h-full mx-auto sm:justify-center sm:flex-row gap-2">
<CreateAdventurer
Expand Down
Loading

0 comments on commit 31a9626

Please sign in to comment.