just need to fix the map to clue function.

This commit is contained in:
bobbert committed 2025-03-16 21:02:10 +00:00
1 parent ea836179d6
commit d675b228c6
3 files changed
+72 -9

No files matched your search

+45 -8
View File
@@ -12,7 +12,7 @@ export default function LeaderboardPage() {
const searchParams = useSearchParams(); const searchParams = useSearchParams();
const huntJustEnded = searchParams.get("huntEnded") === "true"; const huntJustEnded = searchParams.get("huntEnded") === "true";
const router = useRouter(); const router = useRouter();
const { status } = useSession(); const { data: session, status } = useSession(); // Fix: Properly destructure session from useSession()
// Function to fetch leaderboard data // Function to fetch leaderboard data
const fetchLeaderboard = async () => { const fetchLeaderboard = async () => {
@@ -70,7 +70,9 @@ export default function LeaderboardPage() {
<div className="leaderboard-page"> <div className="leaderboard-page">
<div className="page-header"> <div className="page-header">
<div className="back-button"></div> <div className="back-button"></div>
<div className="page-title">Leaderboard</div> <div className="page-title">
{huntJustEnded ? "Final Results" : "Leaderboard"}
</div>
</div> </div>
{huntJustEnded && ( {huntJustEnded && (
@@ -156,7 +158,8 @@ export default function LeaderboardPage() {
<div className="no-data">No teams on the leaderboard yet</div> <div className="no-data">No teams on the leaderboard yet</div>
)} )}
{/* Navigation Bar */} {/* Only show navigation bar when the hunt hasn't ended */}
{!huntJustEnded && (
<div className="nav-bar"> <div className="nav-bar">
<Link href="/map" className="nav-item"> <Link href="/map" className="nav-item">
<div className="nav-icon">🗺️</div> <div className="nav-icon">🗺️</div>
@@ -168,7 +171,7 @@ export default function LeaderboardPage() {
</Link> </Link>
<Link <Link
href={ href={
teams.length > 0 && session?.user?.teamId session?.user?.teamId
? `/${session.user.teamId}` ? `/${session.user.teamId}`
: "/team-selection" : "/team-selection"
} }
@@ -182,6 +185,19 @@ export default function LeaderboardPage() {
<div className="nav-label">Leaderboard</div> <div className="nav-label">Leaderboard</div>
</Link> </Link>
</div> </div>
)}
{/* Add a "back to home" button when the hunt has ended */}
{huntJustEnded && (
<div className="hunt-ended-actions">
<button
onClick={() => (window.location.href = "/team-selection")}
className="back-to-home-button"
>
Back to Home
</button>
</div>
)}
<style jsx>{` <style jsx>{`
.leaderboard-page { .leaderboard-page {
@@ -189,7 +205,7 @@ export default function LeaderboardPage() {
flex-direction: column; flex-direction: column;
min-height: 100vh; min-height: 100vh;
background-color: #f4f4f4; background-color: #f4f4f4;
padding-bottom: 70px; padding-bottom: ${huntJustEnded ? "0" : "70px"};
} }
.page-header { .page-header {
@@ -339,14 +355,35 @@ export default function LeaderboardPage() {
color: #721c24; color: #721c24;
border: 1px solid #f5c6cb; border: 1px solid #f5c6cb;
border-radius: 8px; border-radius: 8px;
padding: 15px; padding: 20px;
margin: 20px; margin: 20px;
text-align: center; text-align: center;
} }
.hunt-ended-icon { .hunt-ended-icon {
font-size: 36px; font-size: 46px;
margin-bottom: 10px; margin-bottom: 15px;
}
.hunt-ended-actions {
display: flex;
justify-content: center;
margin: 30px 0;
}
.back-to-home-button {
background-color: #68543c;
color: white;
border: none;
border-radius: 8px;
padding: 12px 24px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s;
}
.back-to-home-button:hover {
background-color: #53402d;
} }
/* Navigation Bar Styles */ /* Navigation Bar Styles */
+27 -1
View File
@@ -282,10 +282,23 @@ export default function MapPage() {
console.log("Hunt has ended, redirecting to leaderboard"); console.log("Hunt has ended, redirecting to leaderboard");
clearHuntTimer(); // Clean up all timer data clearHuntTimer(); // Clean up all timer data
// Use the appropriate redirect method // Show a brief message before redirecting
const huntEndedMessage = document.createElement("div");
huntEndedMessage.innerHTML = `
<div style="position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.8); color:white; display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:9999">
<div style="font-size:32px; margin-bottom:20px">🎯 Hunt Complete!</div>
<div style="font-size:24px; margin-bottom:20px">The treasure hunt has ended.</div>
<div style="font-size:18px">Redirecting to results...</div>
</div>
`;
document.body.appendChild(huntEndedMessage);
// Use the appropriate redirect method after a short delay
setTimeout(() => {
if (isMounted.current) { if (isMounted.current) {
hardRedirect("/leaderboard?huntEnded=true"); hardRedirect("/leaderboard?huntEnded=true");
} }
}, 2000);
return; return;
} }
@@ -302,8 +315,21 @@ export default function MapPage() {
console.log("Timer expired, redirecting to leaderboard"); console.log("Timer expired, redirecting to leaderboard");
clearHuntTimer(); // Clean up all timer data clearHuntTimer(); // Clean up all timer data
// Show a brief message before redirecting
const timerEndedMessage = document.createElement("div");
timerEndedMessage.innerHTML = `
<div style="position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.8); color:white; display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:9999">
<div style="font-size:32px; margin-bottom:20px">⏰ Time's Up!</div>
<div style="font-size:24px; margin-bottom:20px">The treasure hunt has ended.</div>
<div style="font-size:18px">Redirecting to results...</div>
</div>
`;
document.body.appendChild(timerEndedMessage);
if (isMounted.current) { if (isMounted.current) {
setTimeout(() => {
hardRedirect("/leaderboard?huntEnded=true"); hardRedirect("/leaderboard?huntEnded=true");
}, 2000);
} }
return; return;
} }
BIN
View File
Binary file not shown.