Spaces:
Running
Running
File size: 2,530 Bytes
794cf6c bc7e9cd 794cf6c dd99b77 db9635c dd99b77 bc7e9cd 794cf6c dd99b77 db9635c dd99b77 db9635c dd99b77 db9635c dd99b77 db9635c dd99b77 794cf6c dd99b77 794cf6c bc7e9cd 794cf6c bc7e9cd 794cf6c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 |
<script lang="ts">
import { onMount, onDestroy } from 'svelte';
import { uiStore } from '../../stores/ui';
import { gameStore } from '../../stores/game';
import { contentManager } from '../../services/content-manager';
import { gameEngine } from '../../services/game-engine';
import GameError from './GameError.svelte';
let reloadTimer: any;
let previousContent = '';
let isInitialized = false;
let lastRestartTime = 0;
let reloadInProgress = false;
$: if ($contentManager.content !== previousContent && $gameStore.isAutoRunning && isInitialized) {
previousContent = $contentManager.content;
clearTimeout(reloadTimer);
const now = Date.now();
// Ensure minimum time between reloads and no overlapping reloads
if (now - lastRestartTime >= 2000 && !reloadInProgress) {
reloadTimer = setTimeout(async () => {
const currentTime = Date.now();
if (currentTime - lastRestartTime < 2000 || $gameStore.isStarting || reloadInProgress) {
return;
}
lastRestartTime = currentTime;
reloadInProgress = true;
try {
await gameEngine.startFromDocument($contentManager.content);
} finally {
// Ensure we always reset the flag
reloadInProgress = false;
}
}, 1500);
}
}
onMount(async () => {
previousContent = $contentManager.content;
setTimeout(async () => {
if (!$gameStore.instance && $gameStore.isAutoRunning && $contentManager.content) {
await gameEngine.startFromDocument($contentManager.content);
}
isInitialized = true;
}, 400);
});
onDestroy(() => {
clearTimeout(reloadTimer);
gameEngine.stop();
});
</script>
<div class="game-section">
{#if $uiStore.error}
<GameError error={$uiStore.error} />
{/if}
<div id="world-container" style="display: none;"></div>
<div class="canvas-container">
<canvas id="game-canvas"></canvas>
</div>
</div>
<style>
.game-section {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
min-height: 0;
}
.canvas-container {
flex: 1;
position: relative;
background: radial-gradient(ellipse at center, rgba(124, 152, 133, 0.02) 0%, transparent 70%);
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
#game-canvas {
width: 100%;
height: 100%;
display: block;
object-fit: contain;
pointer-events: auto;
user-select: none;
}
</style> |