updated packages, updated websocket to socket.io, moved login styling to its own scss file
This commit is contained in:
parent
79e1525345
commit
1631f1b9ca
103
package-lock.json
generated
103
package-lock.json
generated
@ -9,7 +9,9 @@
|
||||
"version": "0.0.0",
|
||||
"dependencies": {
|
||||
"@vueuse/core": "^10.9.0",
|
||||
"phaser": "^3.80.1",
|
||||
"pinia": "^2.1.7",
|
||||
"socket.io-client": "^4.7.5",
|
||||
"vue": "^3.4.21"
|
||||
},
|
||||
"devDependencies": {
|
||||
@ -17,7 +19,6 @@
|
||||
"@tsconfig/node20": "^20.1.2",
|
||||
"@types/jsdom": "^21.1.6",
|
||||
"@types/node": "^20.11.28",
|
||||
"@types/ws": "^8.5.10",
|
||||
"@vitejs/plugin-vue": "^5.0.4",
|
||||
"@vue/eslint-config-prettier": "^8.0.0",
|
||||
"@vue/eslint-config-typescript": "^12.0.0",
|
||||
@ -28,7 +29,6 @@
|
||||
"eslint-plugin-vue": "^9.17.0",
|
||||
"jsdom": "^24.0.0",
|
||||
"npm-run-all2": "^6.1.2",
|
||||
"phaser": "^3.80.1",
|
||||
"phaser3-rex-plugins": "^1.80.2",
|
||||
"phavuer": "^0.15.7",
|
||||
"prettier": "^3.0.3",
|
||||
@ -37,8 +37,7 @@
|
||||
"vite": "^5.1.6",
|
||||
"vite-plugin-vue-devtools": "^7.0.18",
|
||||
"vitest": "^1.4.0",
|
||||
"vue-tsc": "^2.0.6",
|
||||
"ws": "^8.17.0"
|
||||
"vue-tsc": "^2.0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/@ampproject/remapping": {
|
||||
@ -1598,6 +1597,11 @@
|
||||
"integrity": "sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@socket.io/component-emitter": {
|
||||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz",
|
||||
"integrity": "sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA=="
|
||||
},
|
||||
"node_modules/@tsconfig/node20": {
|
||||
"version": "20.1.4",
|
||||
"resolved": "https://registry.npmjs.org/@tsconfig/node20/-/node20-20.1.4.tgz",
|
||||
@ -1653,15 +1657,6 @@
|
||||
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
|
||||
"integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow=="
|
||||
},
|
||||
"node_modules/@types/ws": {
|
||||
"version": "8.5.10",
|
||||
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.10.tgz",
|
||||
"integrity": "sha512-vmQSUcfalpIq0R9q7uTo2lXs6eGIpt9wtnLdMv9LVpIjCA/+ufZRozlVoVelIYixx1ugCBKDhn89vnsEGOCx9A==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@typescript-eslint/eslint-plugin": {
|
||||
"version": "6.21.0",
|
||||
"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.21.0.tgz",
|
||||
@ -2877,7 +2872,6 @@
|
||||
"version": "4.3.4",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
|
||||
"integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"ms": "2.1.2"
|
||||
},
|
||||
@ -3056,6 +3050,46 @@
|
||||
"integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/engine.io-client": {
|
||||
"version": "6.5.3",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.5.3.tgz",
|
||||
"integrity": "sha512-9Z0qLB0NIisTRt1DZ/8U2k12RJn8yls/nXMZLn+/N8hANT3TcYjKFKcwbw5zFQiN4NTde3TSY9zb79e1ij6j9Q==",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.1",
|
||||
"engine.io-parser": "~5.2.1",
|
||||
"ws": "~8.11.0",
|
||||
"xmlhttprequest-ssl": "~2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-client/node_modules/ws": {
|
||||
"version": "8.11.0",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
|
||||
"integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"bufferutil": "^4.0.1",
|
||||
"utf-8-validate": "^5.0.2"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"bufferutil": {
|
||||
"optional": true
|
||||
},
|
||||
"utf-8-validate": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-parser": {
|
||||
"version": "5.2.2",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.2.tgz",
|
||||
"integrity": "sha512-RcyUFKA93/CXH20l4SoVvzZfrSDMOTUS3bWVpTt2FuFP+XYrL8i8oonHP7WInRyVHXh0n/ORtoeiE1os+8qkSw==",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/entities": {
|
||||
"version": "4.5.0",
|
||||
"resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
|
||||
@ -3371,8 +3405,7 @@
|
||||
"node_modules/eventemitter3": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
|
||||
"integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==",
|
||||
"dev": true
|
||||
"integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA=="
|
||||
},
|
||||
"node_modules/execa": {
|
||||
"version": "8.0.1",
|
||||
@ -4437,8 +4470,7 @@
|
||||
"node_modules/ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
|
||||
"dev": true
|
||||
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
|
||||
},
|
||||
"node_modules/muggle-string": {
|
||||
"version": "0.4.1",
|
||||
@ -4843,7 +4875,6 @@
|
||||
"version": "3.80.1",
|
||||
"resolved": "https://registry.npmjs.org/phaser/-/phaser-3.80.1.tgz",
|
||||
"integrity": "sha512-VQGAWoDOkEpAWYkI+PUADv5Ql+SM0xpLuAMBJHz9tBcOLqjJ2wd8bUhxJgOqclQlLTg97NmMd9MhS75w16x1Cw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"eventemitter3": "^5.0.1"
|
||||
}
|
||||
@ -5458,6 +5489,32 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-client": {
|
||||
"version": "4.7.5",
|
||||
"resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.7.5.tgz",
|
||||
"integrity": "sha512-sJ/tqHOCe7Z50JCBCXrsY3I2k03iOiUe+tj1OmKeD2lXPiGH/RUCdTZFoqVyN7l1MnpIzPrGtLcijffmeouNlQ==",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.2",
|
||||
"engine.io-client": "~6.5.2",
|
||||
"socket.io-parser": "~4.2.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/socket.io-parser": {
|
||||
"version": "4.2.4",
|
||||
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.4.tgz",
|
||||
"integrity": "sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==",
|
||||
"dependencies": {
|
||||
"@socket.io/component-emitter": "~3.1.0",
|
||||
"debug": "~4.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-js": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
|
||||
@ -6435,6 +6492,14 @@
|
||||
"integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/xmlhttprequest-ssl": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz",
|
||||
"integrity": "sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==",
|
||||
"engines": {
|
||||
"node": ">=0.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/yallist": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
|
||||
|
||||
@ -16,14 +16,15 @@
|
||||
"dependencies": {
|
||||
"@vueuse/core": "^10.9.0",
|
||||
"pinia": "^2.1.7",
|
||||
"vue": "^3.4.21"
|
||||
"socket.io-client": "^4.7.5",
|
||||
"vue": "^3.4.21",
|
||||
"phaser": "^3.80.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rushstack/eslint-patch": "^1.3.3",
|
||||
"@tsconfig/node20": "^20.1.2",
|
||||
"@types/jsdom": "^21.1.6",
|
||||
"@types/node": "^20.11.28",
|
||||
"@types/ws": "^8.5.10",
|
||||
"@vitejs/plugin-vue": "^5.0.4",
|
||||
"@vue/eslint-config-prettier": "^8.0.0",
|
||||
"@vue/eslint-config-typescript": "^12.0.0",
|
||||
@ -34,7 +35,6 @@
|
||||
"eslint-plugin-vue": "^9.17.0",
|
||||
"jsdom": "^24.0.0",
|
||||
"npm-run-all2": "^6.1.2",
|
||||
"phaser": "^3.80.1",
|
||||
"phaser3-rex-plugins": "^1.80.2",
|
||||
"phavuer": "^0.15.7",
|
||||
"prettier": "^3.0.3",
|
||||
@ -43,7 +43,6 @@
|
||||
"vite": "^5.1.6",
|
||||
"vite-plugin-vue-devtools": "^7.0.18",
|
||||
"vitest": "^1.4.0",
|
||||
"vue-tsc": "^2.0.6",
|
||||
"ws": "^8.17.0"
|
||||
"vue-tsc": "^2.0.6"
|
||||
}
|
||||
}
|
||||
|
||||
20
src/App.vue
20
src/App.vue
@ -1,20 +1,18 @@
|
||||
<template>
|
||||
<Login />
|
||||
<Login v-if="screen === 'login'" />
|
||||
<!-- <Register v-if="screen === 'register'" />-->
|
||||
<Game v-if="screen === 'game'" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Game from '@/components/Game.vue'
|
||||
import Login from '@/components/screens/Login.vue'
|
||||
import { useWebSocket } from '@vueuse/core'
|
||||
import config from '@/config'
|
||||
import { onMounted, type Ref, ref } from 'vue'
|
||||
const screen:Ref<string> = ref('login');
|
||||
|
||||
const { status, data, close } = useWebSocket(config.websocket_url, {
|
||||
autoReconnect: {
|
||||
retries: 3,
|
||||
delay: 1000,
|
||||
onFailed() {
|
||||
alert('Failed to connect WebSocket after 3 retries')
|
||||
},
|
||||
},
|
||||
})
|
||||
import SocketioService from '@/services/socketio.service';
|
||||
onMounted(() => {
|
||||
SocketioService.setupSocketConnection();
|
||||
});
|
||||
</script>
|
||||
102
src/assets/login.scss
Normal file
102
src/assets/login.scss
Normal file
@ -0,0 +1,102 @@
|
||||
#bg-img {
|
||||
height: 100vh;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
.login-form {
|
||||
position: absolute;
|
||||
bottom: 9rem;
|
||||
width: 100%;
|
||||
|
||||
form {
|
||||
display: grid;
|
||||
gap: 1.5rem;
|
||||
width: inherit;
|
||||
|
||||
.form-field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
border-radius: 3px;
|
||||
width: 30%;
|
||||
margin: 0 auto;
|
||||
|
||||
label {
|
||||
color: #000;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
padding: 0.25rem 0.5rem;
|
||||
}
|
||||
input {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
padding: 0.5rem 0.25rem;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.row-buttons {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
position: absolute;
|
||||
bottom: 5rem;
|
||||
|
||||
.button {
|
||||
padding: 1.2rem 0;
|
||||
min-width: 6rem;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
font-size: 12px;
|
||||
|
||||
&.button-1 {
|
||||
background-image: url('/assets/Button_1.png');
|
||||
}
|
||||
&.button-2 {
|
||||
background-image: url('/assets/Button_2.png');
|
||||
}
|
||||
&.button-3 {
|
||||
background-image: url('/assets/Button_3.png');
|
||||
}
|
||||
&.button-4 {
|
||||
background-image: url('/assets/Button_4.png');
|
||||
}
|
||||
|
||||
background-color: transparent;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
outline: none;
|
||||
color:white;
|
||||
|
||||
&:hover {
|
||||
filter: brightness(60%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-title {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 40%;
|
||||
font-size: 3rem;
|
||||
color: #FFF;
|
||||
text-shadow: -1px -1px 0 gray, 1px -1px 0 gray, -1px 1px 0 gray, 1px 1px 0 gray;
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<audio ref="bgm" id="bgm" src="/assets/music/bgm.mp3" loop autoplay></audio>
|
||||
<!-- <audio ref="bgm" id="bgm" src="/assets/music/bgm.mp3" loop autoplay></audio>-->
|
||||
<img src="/assets/Leaf_BG_standalone.png" id="bg-img" alt="New Quest login background" />
|
||||
<div class="content-wrapper">
|
||||
<h1 class="main-title">NEW QUEST</h1>
|
||||
@ -18,21 +18,15 @@
|
||||
</div>
|
||||
|
||||
<div class="row-buttons">
|
||||
<a class="button button-1" href="/" id="submit">
|
||||
<button class="button button-1" id="submit">
|
||||
LOGIN
|
||||
</a>
|
||||
|
||||
<a class="button button-2" href="/">
|
||||
</button>
|
||||
<button class="button button-2">
|
||||
REGISTER
|
||||
</a>
|
||||
|
||||
<a class="button button-3" href="/">
|
||||
</button>
|
||||
<button class="button button-3">
|
||||
CREDITS
|
||||
</a>
|
||||
|
||||
<a class="button button-4" href="/">
|
||||
EXIT
|
||||
</a>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -40,113 +34,20 @@
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
|
||||
const bgm = ref('bgm');
|
||||
const bgmStart = () => bgm.value.play();
|
||||
|
||||
onMounted(() => {
|
||||
// check if bgm is playing already and do nothing
|
||||
if (bgm.value.paused) {
|
||||
window.addEventListener('click', () => bgm.value.play())
|
||||
window.addEventListener('keydown', () => bgm.value.play())
|
||||
}
|
||||
// const bgm = ref('bgm');
|
||||
// const bgmStart = () => bgm.value.play();
|
||||
|
||||
})
|
||||
// onMounted(() => {
|
||||
// // check if bgm is playing already and do nothing
|
||||
// if (bgm.value.paused) {
|
||||
// window.addEventListener('click', () => bgm.value.play())
|
||||
// window.addEventListener('keydown', () => bgm.value.play())
|
||||
// }
|
||||
//
|
||||
// })
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
#bg-img {
|
||||
height: 100vh;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
.login-form {
|
||||
position: absolute;
|
||||
bottom: 7rem;
|
||||
width: 100%;
|
||||
|
||||
form {
|
||||
display: grid;
|
||||
gap: 1.5rem;
|
||||
width: inherit;
|
||||
|
||||
.form-field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
border-radius: 3px;
|
||||
width: 30%;
|
||||
margin: 0 auto;
|
||||
|
||||
label {
|
||||
color: #000;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
padding: 0.25rem 0.5rem;
|
||||
}
|
||||
input {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
padding: 0.5rem 0.25rem;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.row-buttons {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
position: absolute;
|
||||
bottom: 2.5rem;
|
||||
|
||||
.button {
|
||||
padding: 1.2rem 0;
|
||||
min-width: 8.2rem;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
|
||||
&.button-1 {
|
||||
background-image: url('/assets/Button_1.png');
|
||||
}
|
||||
&.button-2 {
|
||||
background-image: url('/assets/Button_2.png');
|
||||
}
|
||||
&.button-3 {
|
||||
background-image: url('/assets/Button_3.png');
|
||||
}
|
||||
&.button-4 {
|
||||
background-image: url('/assets/Button_4.png');
|
||||
}
|
||||
background-position: center;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
&:hover {
|
||||
filter: brightness(60%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-title {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 40%;
|
||||
font-size: 3rem;
|
||||
color: #FFF;
|
||||
text-shadow: -1px -1px 0 gray, 1px -1px 0 gray, -1px 1px 0 gray, 1px 1px 0 gray;
|
||||
}
|
||||
|
||||
@import "@/assets/login";
|
||||
</style>
|
||||
@ -25,7 +25,6 @@ function onPointerClick(pointer: Phaser.Input.Pointer) {
|
||||
|
||||
pointer_tile.value = getTile(px, py, props.layer);
|
||||
if (pointer_tile.value) {
|
||||
|
||||
// Convert tile coordinates to world coordinates
|
||||
const worldPoint = props.layer.tileToWorldXY(pointer_tile.value.x, pointer_tile.value.y);
|
||||
x.value = worldPoint.x + config.tile_size.y;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
export default {
|
||||
name: 'New Quest',
|
||||
websocket_url: 'ws://localhost:3000',
|
||||
server_endpoint: 'http://localhost:3000',
|
||||
development: true,
|
||||
width: 960,
|
||||
height: 540,
|
||||
|
||||
13
src/services/socketio.service.ts
Normal file
13
src/services/socketio.service.ts
Normal file
@ -0,0 +1,13 @@
|
||||
import { io, Socket } from 'socket.io-client'
|
||||
import config from '@/config';
|
||||
|
||||
class SocketioService {
|
||||
socket: Socket | undefined;
|
||||
constructor() {}
|
||||
|
||||
setupSocketConnection(): void {
|
||||
this.socket = io(config.server_endpoint as string);
|
||||
}
|
||||
}
|
||||
|
||||
export default new SocketioService();
|
||||
Loading…
x
Reference in New Issue
Block a user