warlock/dino_landing_page
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

practice mode

Browse Source
This commit is contained in:
Sewmina 2025-08-19 13:31:50 +05:30
parent ecb761a942
commit a27c31ce03
1 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
app/page.tsx
View File

@ -29,6 +29,7 @@ export default function Home() {
const [dashboardError, setDashboardError] = useState<string | null>(null); const [dashboardError, setDashboardError] = useState<string | null>(null);
const [isRefreshing, setIsRefreshing] = useState(false); const [isRefreshing, setIsRefreshing] = useState(false);
const [refreshCounter, setRefreshCounter] = useState(0); const [refreshCounter, setRefreshCounter] = useState(0);
const [isPracticeMode, setIsPracticeMode] = useState(false);
const headerRef = useRef<HeaderRef>(null); const headerRef = useRef<HeaderRef>(null);
// Poll for available tickets every 5 seconds (only when no ticket is available) // Poll for available tickets every 5 seconds (only when no ticket is available)
@ -161,6 +162,7 @@ export default function Home() {
console.log("game_close_signal", status); console.log("game_close_signal", status);
setHasTicket(false); setHasTicket(false);
setTicketTxHash(null); setTicketTxHash(null);
setIsPracticeMode(false);
}; };
// Auto-hide payment success panel after 5 seconds // Auto-hide payment success panel after 5 seconds
@ -315,11 +317,15 @@ export default function Home() {
<div className="min-h-screen"> <div className="min-h-screen">
<Header ref={headerRef} /> <Header ref={headerRef} />
{/* Game iframe - shown when user has a ticket */} {/* Game iframe - shown when user has a ticket or in practice mode */}
{hasTicket && ( {(hasTicket || isPracticeMode) && (
<div className="w-full h-screen flex justify-center items-center bg-white" style={{ marginTop: '80px' }}> <div className="w-full h-screen flex justify-center items-center bg-white" style={{ marginTop: '80px' }}>
<iframe <iframe
src={`/Build/index.html?tx=${ticketTxHash}&highscore=${highscore}`} src={isPracticeMode
? `/Build/index.html?isPractice=1&highscore=${highscore}`
: `/Build/index.html?tx=${ticketTxHash}&highscore=${highscore}`
}
className="w-full h-full" className="w-full h-full"
title="Dino Game" title="Dino Game"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
@ -328,8 +334,8 @@ export default function Home() {
</div> </div>
)} )}
{/* Main content - only shown when no ticket */} {/* Main content - only shown when no ticket and not in practice mode */}
{!hasTicket && ( {!hasTicket && !isPracticeMode && (
<main className="pt-20"> <main className="pt-20">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12"> <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<div className="text-center"> <div className="text-center">
@ -364,6 +370,14 @@ export default function Home() {
} }
</button> </button>
{/* Practice Button */}
<button
onClick={() => setIsPracticeMode(true)}
className="px-8 py-3 text-lg font-semibold rounded-xl shadow-lg transition-all duration-300 transform hover:scale-105 hover:-translate-y-1 bg-gradient-to-r from-blue-600 to-indigo-600 hover:from-blue-700 hover:to-indigo-700 text-white shadow-blue-500/25 hover:shadow-xl hover:shadow-blue-500/30"
>
Practice Mode (Free)
</button>
{/* Status Messages */} {/* Status Messages */}
{error && ( {error && (
<div className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-lg max-w-md"> <div className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-lg max-w-md">