Add component for inputting the websocket URL
This commit is contained in:
parent
31a8315590
commit
1b9ba8ef8d
1 changed files with 51 additions and 0 deletions
51
src/components/WebsocketURL.vue
Normal file
51
src/components/WebsocketURL.vue
Normal file
|
|
@ -0,0 +1,51 @@
|
||||||
|
<template>
|
||||||
|
<div id="websocket_entry">
|
||||||
|
<h2>
|
||||||
|
Enter a websocket URL:
|
||||||
|
</h2>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
name="Websocket URL"
|
||||||
|
v-model="ws_url"
|
||||||
|
@keyup.enter="submit_ws_url()"
|
||||||
|
>
|
||||||
|
<br>
|
||||||
|
<button
|
||||||
|
@onclick.stop="submit_ws_url()"
|
||||||
|
>
|
||||||
|
Confirm URL
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'WebsocketEntry',
|
||||||
|
components: {},
|
||||||
|
data() {return {
|
||||||
|
ws_url: ``,
|
||||||
|
}},
|
||||||
|
methods: {
|
||||||
|
submit_ws_url() {
|
||||||
|
if (this.ws_url.length > 0 && this.ws_url.match(/^wss?:\/\//)) {
|
||||||
|
this.$emit(`set-ws-url`, this.ws_url);
|
||||||
|
} else {
|
||||||
|
alert(`Invalid websocket URL, it must begin with "wss://" in order to connect.`)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="stylus">
|
||||||
|
#websocket_entry {
|
||||||
|
text-align: center
|
||||||
|
height: 100vh
|
||||||
|
width: 33vw
|
||||||
|
margin: 0 auto
|
||||||
|
|
||||||
|
@media screen and (max-width: 600px) {
|
||||||
|
width: 90vw
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Add table
Add a link
Reference in a new issue