From 00d476a0e51629f06407aed035fbc001d3f6b114 Mon Sep 17 00:00:00 2001 From: Pinapelz Date: Fri, 26 Jun 2026 21:55:46 -0700 Subject: initial guess MV mode --- src/components/Game/index.tsx | 54 +++++++++++++++++++++++++++++++------------ 1 file changed, 39 insertions(+), 15 deletions(-) (limited to 'src/components/Game/index.tsx') diff --git a/src/components/Game/index.tsx b/src/components/Game/index.tsx index 8afa516..8e16d46 100644 --- a/src/components/Game/index.tsx +++ b/src/components/Game/index.tsx @@ -3,8 +3,9 @@ import React from "react"; import { GuessType } from "../../types/guess"; import { Song } from "../../types/song"; import { playTimes } from "../../constants"; +import { musicVideos } from "../../../server/data/mvs"; -import { Button, Guess, YTPlayer, Search, Result, Player } from "../"; +import { Button, Guess, YTPlayer, Search, Result, Player, MVPlayer } from "../"; import * as Styled from "./index.styled"; @@ -17,7 +18,7 @@ interface Props { setSelectedSong: React.Dispatch>; skip: () => void; guess: () => void; - mode?: "daily" | "unlimited"; + mode?: "daily" | "unlimited" | "dailyMV"; onPlayAgain?: () => void; isSubmitting?: boolean; } @@ -39,27 +40,36 @@ export function Game({ onPlayAgain, isSubmitting = false, }: Props) { - const recentFinishedPlay = localStorage.getItem("recentFinishedPlay"); + const recentFinishedPlay = + mode === "dailyMV" + ? localStorage.getItem("recentFinishedPlayMV") + : localStorage.getItem("recentFinishedPlay"); const hasFinishedCurrentRound = didGuess || currentTry >= guesses.length; const hasFinishedResponseDaily = - mode === "daily" && !!dailyDate && recentFinishedPlay === dailyDate; - const isGameOver = hasFinishedCurrentRound || hasFinishedResponseDaily; + (mode === "daily" || mode === "dailyMV") && + !!dailyDate && + recentFinishedPlay === dailyDate; const isBlocked = - mode === "daily" && + (mode === "daily" || mode === "dailyMV") && !!dailyDate && !hasFinishedResponseDaily && new Date(getUtcDate()) > new Date(dailyDate); const sessionDate = dailyDate ?? getUtcDate(); React.useEffect(() => { - if (mode !== "daily") return; + if (mode !== "daily" && mode !== "dailyMV") return; if (!hasFinishedCurrentRound) return; - localStorage.setItem("recentFinishedPlay", sessionDate); - const historicalPlayData = localStorage.getItem("historicalPlayData"); + const storageKey = + mode === "dailyMV" ? "recentFinishedPlayMV" : "recentFinishedPlay"; + localStorage.setItem(storageKey, sessionDate); + + const historicalKey = + mode === "dailyMV" ? "historicalPlayDataMV" : "historicalPlayData"; + const historicalPlayData = localStorage.getItem(historicalKey); if (historicalPlayData === null) { localStorage.setItem( - "historicalPlayData", + historicalKey, JSON.stringify({ sessionDates: [sessionDate], guesses: [currentTry], @@ -70,7 +80,7 @@ export function Game({ const parsedData = JSON.parse(historicalPlayData); if (parsedData.sessionDates.includes(sessionDate)) return; localStorage.setItem( - "historicalPlayData", + historicalKey, JSON.stringify({ sessionDates: [...parsedData.sessionDates, sessionDate], guesses: [...parsedData.guesses, currentTry], @@ -81,17 +91,23 @@ export function Game({ }, [mode, hasFinishedCurrentRound, sessionDate, currentTry, didGuess]); if (isBlocked) { - return

Daily MIXX is not available yet. Check back soon!

; + return ( +

+ {mode === "dailyMV" + ? "Daily MV is not available yet. Check back soon!" + : "Daily MIXX is not available yet. Check back soon!"} +

+ ); } - if (isGameOver) { + if (hasFinishedCurrentRound || hasFinishedResponseDaily) { return ( @@ -105,17 +121,25 @@ export function Game({ ))} {mode === "unlimited" ? ( + ) : mode === "dailyMV" ? ( + ) : ( )} - +