83 lines
2.5 KiB
TypeScript
83 lines
2.5 KiB
TypeScript
import { createRoot } from 'react-dom/client';
|
|
import { App } from './components/App';
|
|
import { Storage } from './Storage';
|
|
import { $appSettings } from './stores/appSettings';
|
|
import { setShaderCode } from './stores/shader';
|
|
import { useKeyboardShortcuts } from './hooks/useKeyboardShortcuts';
|
|
|
|
// Load initial state from storage
|
|
const savedSettings = Storage.getSettings();
|
|
$appSettings.set(savedSettings);
|
|
|
|
// Load URL hash if present
|
|
function loadFromURL() {
|
|
if (window.location.hash) {
|
|
try {
|
|
const hash = window.location.hash.substring(1);
|
|
console.log('Loading from URL hash:', hash);
|
|
|
|
const decoded = atob(hash);
|
|
console.log('Decoded data:', decoded);
|
|
|
|
try {
|
|
const shareData = JSON.parse(decoded);
|
|
console.log('Parsed share data:', shareData);
|
|
|
|
if (shareData.code) {
|
|
setShaderCode(shareData.code);
|
|
}
|
|
|
|
$appSettings.set({
|
|
resolution: shareData.resolution || savedSettings.resolution,
|
|
fps: shareData.fps || savedSettings.fps,
|
|
renderMode: shareData.renderMode || savedSettings.renderMode,
|
|
valueMode: shareData.valueMode || savedSettings.valueMode,
|
|
uiOpacity:
|
|
shareData.uiOpacity !== undefined
|
|
? shareData.uiOpacity
|
|
: savedSettings.uiOpacity,
|
|
hueShift:
|
|
shareData.hueShift !== undefined
|
|
? shareData.hueShift
|
|
: savedSettings.hueShift,
|
|
});
|
|
|
|
console.log('Settings updated from URL');
|
|
} catch (jsonError) {
|
|
console.log('JSON parse failed, falling back to old format');
|
|
// Fall back to old format (just code as string)
|
|
setShaderCode(decoded);
|
|
}
|
|
} catch (e) {
|
|
console.error('Failed to decode URL hash:', e);
|
|
}
|
|
} else {
|
|
// Load last shader code if no URL hash
|
|
setShaderCode(savedSettings.lastShaderCode ?? 'x^y');
|
|
}
|
|
}
|
|
|
|
// Main App component that includes keyboard shortcuts
|
|
function AppWithShortcuts() {
|
|
useKeyboardShortcuts();
|
|
return <App />;
|
|
}
|
|
|
|
// Set up hash change listener
|
|
window.addEventListener('hashchange', loadFromURL);
|
|
|
|
// Initialize the app
|
|
loadFromURL();
|
|
|
|
// Mount React app
|
|
const container = document.getElementById('app');
|
|
if (!container) {
|
|
// Create app container if it doesn't exist
|
|
const appDiv = document.createElement('div');
|
|
appDiv.id = 'app';
|
|
document.body.appendChild(appDiv);
|
|
}
|
|
|
|
const root = createRoot(container || document.getElementById('app')!);
|
|
root.render(<AppWithShortcuts />);
|