<?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, autodartsState } from "<?= asset("assets/js/websocket.js") ?>";
document.addEventListener("keydown", (event) => {
if (event.key == "F6"){
event.preventDefault();
fetch('http://localhost:3180/api/reset', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
})
}
if (event.key == "F7"){
event.preventDefault();
fetch('http://localhost:3180/api/start', {
method: 'PUT',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
})
}
if (event.key == "F8"){
event.preventDefault();
fetch('http://localhost:3180/api/stop', {
method: 'PUT',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
})
}
if (event.key == "u"){
event.preventDefault();
connect("ws://localhost:3180/api/events", (event) => {
let data = JSON.parse(event.data);
if(data.type == "state"){
autodartsState.status = data.data.status;
const evt = new CustomEvent("autodarts", {detail: data});
document.body.dispatchEvent(evt);
console.log("Message from server ", data);
console.log(autodartsState.status);
}
});
}
});
</script>
<?php snippet("footer") ?>