import React, { useEffect, useRef, useState } from 'react'; import { ThreeScene } from 'ThreeScene'; // Time formatting helper const formatTime = (seconds) => { const minutes = Math.floor(seconds / 60); const remainingSeconds = Math.floor(seconds % 60); return `${minutes}:${remainingSeconds.toString().padStart(2, '0')}`; }; export const App = () => { const mountRef = useRef(null); const threeSceneRef = useRef(null); const [currentTime, setCurrentTime] = useState(0); const [duration, setDuration] = useState(0); // Update timeline useEffect(() => { let interval; if (threeSceneRef.current) { // Initial update setCurrentTime(threeSceneRef.current.getCurrentTime()); setDuration(threeSceneRef.current.getDuration()); // Continuous updates interval = setInterval(() => { if (threeSceneRef.current) { setCurrentTime(threeSceneRef.current.getCurrentTime()); setDuration(threeSceneRef.current.getDuration()); } }, 100); } return () => { if (interval) { clearInterval(interval); } }; }, [threeSceneRef.current]); const [brightness, setBrightness] = useState(1.0); const [contrast, setContrast] = useState(1.0); const [inverted, setInverted] = useState(false); const [gameState, setGameState] = useState('menu'); // 'menu', 'game', 'credits', 'disclaimer' const [fadeOpacity, setFadeOpacity] = useState(0); useEffect(() => { if (gameState === 'game') { threeSceneRef.current = new ThreeScene(mountRef); let cleanup; const initScene = async () => { cleanup = await threeSceneRef.current.init(); }; initScene(); return () => { if (cleanup) cleanup(); }; } }, [gameState]); useEffect(() => { if (threeSceneRef.current) { threeSceneRef.current.adjustScreen(brightness, contrast, inverted); } }, [brightness, contrast, inverted]); const [isPlaying, setIsPlaying] = useState(true); useEffect(() => { if (threeSceneRef.current && gameState === 'game') { threeSceneRef.current.playVideo(); } }, [gameState]); const handlePlayPause = () => { if (threeSceneRef.current) { const playing = threeSceneRef.current.toggleVideo(); setIsPlaying(playing); } }; const handleRewind = () => { if (threeSceneRef.current) { threeSceneRef.current.rewindVideo(); } }; // Add font face declaration useEffect(() => { const font = new FontFace('VT323', 'url(https://play.rosebud.ai/assets/VT323-Regular.ttf?aGfv)'); font.load().then(font => { document.fonts.add(font); }); }, []); const renderMenu = () => (

CURSED EDITOR

); const renderCredits = () => (

CREDITS

Created by Plasmator Games

All assets made with three.js geometries

Ghost model by Meshy AI

All SFX made by Plasmator Games

); return (

{gameState === 'menu' && renderMenu()} {gameState === 'credits' && renderCredits()} {gameState === 'disclaimer' && (

⚠️ WARNING ⚠️

This experience contains:

• Flashing/Flickering Lights

• Sudden Loud Noises

• Horror Elements

• Jump Scares

• Distorted/Reversed Audio

• Disturbing Sound Effects

If you are sensitive to any of these elements, please exercise caution or avoid playing.

Recommended: Use headphones at a moderate volume level.

)}

BRIGHTNESS: [{brightness.toFixed(1)}] setBrightness(parseFloat(e.target.value))} style={{ display: 'block', width: '200px', marginTop: '5px', accentColor: '#fff', background: '#fff', }} />

CONTRAST: [{contrast.toFixed(1)}] setContrast(parseFloat(e.target.value))} style={{ display: 'block', width: '200px', marginTop: '5px', accentColor: '#fff', background: '#fff', }} />

setInverted(e.target.checked)} style={{ marginRight: '8px', width: '18px', height: '18px', accentColor: '#fff', }} /> [X] INVERT COLORS

VOLUME: [{Math.round(threeSceneRef.current?.videoElement?.volume * 100 || 100)}%] { const newVolume = parseFloat(e.target.value); if (threeSceneRef.current?.videoElement) { threeSceneRef.current.videoElement.volume = newVolume; } }} style={{ display: 'block', width: '200px', marginTop: '5px', accentColor: '#fff', background: '#fff', }} />

TIMELINE: [{formatTime(currentTime)} / {formatTime(duration)}] { const newTime = parseFloat(e.target.value); if (threeSceneRef.current) { threeSceneRef.current.setVideoTime(newTime); setCurrentTime(newTime); } }} style={{ display: 'block', width: '200px', marginTop: '5px', accentColor: '#fff', background: '#fff', }} />

PLAYBACK SPEED:

); };