<?php snippet("header", ['title' => "Game"]) ?>
<body class="xoi">
<main>
<d-renderer :stack="stack"></d-renderer>
<!-- <component :is="state.view"></component> -->
</main>
<script type="module">
import { createApp, onMounted, reactive } from "vue";
import { vIndex, vAutofocus, EnterHandler } from "<?= asset("assets/js/handlers.js") ?>";
import { xoiHandler, initXoiView } from "<?= asset("assets/js/views/xoi/main.js") ?>";
import initComponents from "<?= asset("assets/js/components/init.js") ?>";
import { renderer, overlayAndGet } from "<?= asset("assets/js/componentPromise.js") ?>";
const app = createApp({
setup() {
const stack = reactive([]);
const mounted = onMounted(async () => {
document.addEventListener("keydown", EnterHandler);
await xoiHandler(stack, "<?= $page->id() ?>");
})
return { stack }
}
}).directive("index", vIndex).directive("autofocus", vAutofocus);
initComponents(app);
initXoiView(app);
app.component("d-renderer", renderer);
app.mount('main')
</script>
<!-- <script type="module">
import { connect } from "<?= asset("assets/js/websocket.js") ?>";
connect("<?= $page->id() ?>", (event) => {
console.log("Message from server ", JSON.parse(event.data));
});
</script> -->
<?php snippet("footer") ?>