import React, { useState, useEffect, useRef } from 'react'; import { Card, CardContent, CardHeader, CardTitle } from '/components/ui/card'; import { Button } from '/components/ui/button'; export default function UndertalePage() { const [isPlaying, setIsPlaying] = useState(false); const [currentTrack, setCurrentTrack] = useState(0); const audioRef = useRef(null); const [showHearts, setShowHearts] = useState(false); const tracks = [ { name: "Once Upon a Time", url: "https://www.soundjay.com/misc/sounds/magic-chime-02.mp3" }, { name: "Your Best Friend", url: "https://www.soundjay.com/misc/sounds/magic-chime-02.mp3" }, { name: "Fallen Down", url: "https://www.soundjay.com/misc/sounds/magic-chime-02.mp3" } ]; const toggleMusic = () => { if (audioRef.current) { if (isPlaying) { audioRef.current.pause(); } else { audioRef.current.play(); } setIsPlaying(!isPlaying); } }; const nextTrack = () => { setCurrentTrack((prev) => (prev + 1) % tracks.length); }; useEffect(() => { const interval = setInterval(() => { setShowHearts(prev => !prev); }, 2000); return () => clearInterval(interval); }, []); return (
{/* Animated Background Elements */}
{/* Stars */}
{/* Floating Hearts */} {showHearts && ( <>
♥
♥
♥
)} {/* Pixel Grid Pattern */}
{/* Audio Element */}
); }