You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
107 lines
2.2 KiB
JavaScript
107 lines
2.2 KiB
JavaScript
import Vue from 'vue'
|
|
import VueRouter from 'vue-router'
|
|
import App from './App.vue'
|
|
import login from './views/login.vue'
|
|
import chat from './views/chat.vue'
|
|
|
|
Vue.config.productionTip = false
|
|
Vue.use(VueRouter)
|
|
|
|
const router = new VueRouter({
|
|
routes: [
|
|
{
|
|
path: '/',
|
|
name: 'home',
|
|
component: login
|
|
},
|
|
{
|
|
path: '/login',
|
|
name: 'login',
|
|
component: login
|
|
},
|
|
{
|
|
path: '/chat',
|
|
name: 'chat',
|
|
component: chat
|
|
}
|
|
]
|
|
})
|
|
|
|
new Vue({
|
|
el: '#app',
|
|
router,
|
|
template: '<App/>',
|
|
components: {App}
|
|
}).$mount('#app')
|
|
|
|
export default {
|
|
mounted() {
|
|
sendMessage()
|
|
},
|
|
methods: {
|
|
sendMessage(message){
|
|
let msg = {
|
|
type: "message",
|
|
time: Date.now(),
|
|
content: {
|
|
message: message
|
|
}
|
|
}
|
|
socket.send(JSON.stringify(msg))
|
|
},
|
|
sendWebSocket(msg){
|
|
socket.send(JSON.stringify(msg))
|
|
}
|
|
}
|
|
}
|
|
|
|
const wsurl = 'ws://127.0.0.1:8090'
|
|
const socket = new WebSocket(wsurl)
|
|
|
|
function element(id){ return document.getElementById(id)}
|
|
|
|
socket.onopen = () => {
|
|
let msg = {
|
|
type: "info",
|
|
time: Date.now(),
|
|
content: "new session"
|
|
}
|
|
socket.send(JSON.stringify(msg))
|
|
}
|
|
socket.onerror = (error) => {
|
|
console.log(`WebSocket error: ${error}`)
|
|
}
|
|
socket.onclose = () => show_error('session ended (refresh)')
|
|
socket.onmessage = (e) => {
|
|
console.log(`data received => ${e.data}`)
|
|
let msg = JSON.parse(e.data)
|
|
if (msg.type === 'error') show_error(msg.content)
|
|
else if (msg.type === 'message'){
|
|
//just for now, ik it's dirty
|
|
element('messages').innerHTML +=
|
|
`<div class="messageContainer" data-v-032da2b2="">
|
|
<div class="message" data-v-032da2b2="">
|
|
${msg.content.text}
|
|
</div>
|
|
</div>`;
|
|
}
|
|
}
|
|
|
|
function show_error(msg) {
|
|
let error_style = element('errorBox').style
|
|
element('errorMessage').innerText = msg
|
|
error_style.display = "block"
|
|
error_style.animation = "slide-from-left alternate 0.2s"
|
|
setTimeout(() => {error_style.animation = ""}, 200)
|
|
}
|
|
|
|
function sendMessage(message){
|
|
let msg = {
|
|
type: "message",
|
|
time: Date.now(),
|
|
content: {
|
|
message: message
|
|
}
|
|
}
|
|
socket.send(JSON.stringify(msg))
|
|
} |