Reconnector.

This commit is contained in:
retoor 2025-01-28 20:41:24 +01:00
parent 14c59ba5c0
commit b2ca373081
4 changed files with 40 additions and 5 deletions

View File

@ -148,9 +148,17 @@ class Chat extends EventHandler {
const me = this const me = this
return new Promise(async (resolve, reject) => { return new Promise(async (resolve, reject) => {
me._wait_connect = resolve me._wait_connect = resolve
me._socket = new WebSocket(me._url)
console.debug("Connecting..") console.debug("Connecting..")
try {
me._socket = new WebSocket(me._url)
}catch(e){
console.warning(e)
setTimeout(()=>{
me.ensureConnection()
},1000)
}
me._socket.onconnect = () => { me._socket.onconnect = () => {
me._connected() me._connected()
me._wait_socket(me) me._wait_socket(me)
@ -210,6 +218,7 @@ class Socket extends EventHandler {
isConnecting = null isConnecting = null
url = null url = null
connectPromises = [] connectPromises = []
ensureTimer = null
constructor() { constructor() {
super() super()
this.url = window.location.hostname == 'localhost' ? 'ws://localhost:8081/rpc.ws' : 'wss://' + window.location.hostname + '/rpc.ws' this.url = window.location.hostname == 'localhost' ? 'ws://localhost:8081/rpc.ws' : 'wss://' + window.location.hostname + '/rpc.ws'
@ -236,6 +245,14 @@ class Socket extends EventHandler {
return proxy return proxy
} }
ensureConnection() { ensureConnection() {
if(this.ensureTimer)
return this.connect()
const me = this
this.ensureTimer = setInterval(()=>{
if (me.isConnecting)
me.isConnecting = false
me.connect()
},5000)
return this.connect() return this.connect()
} }
generateUniqueId() { generateUniqueId() {
@ -256,9 +273,11 @@ class Socket extends EventHandler {
} }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
me.connectPromises.push(resolve) me.connectPromises.push(resolve)
console.debug("Connecting..")
const ws = new WebSocket(this.url) const ws = new WebSocket(this.url)
ws.onopen = (event) => {
ws.onopen = (event) => {
me.ws = ws me.ws = ws
me.isConnected = true me.isConnected = true
me.isConnecting = false me.isConnecting = false
@ -269,6 +288,9 @@ class Socket extends EventHandler {
me.onClose() me.onClose()
} }
ws.onerror = (event)=>{
me.onClose()
}
me.connectPromises.forEach(resolve => { me.connectPromises.forEach(resolve => {
resolve(me) resolve(me)
}) })
@ -290,6 +312,7 @@ class Socket extends EventHandler {
api.ws.send(JSON.stringify(data)) api.ws.send(JSON.stringify(data))
}) })
} }
async call(method, ...args) { async call(method, ...args) {
const call = { const call = {
callId: this.generateUniqueId(), callId: this.generateUniqueId(),

View File

@ -125,9 +125,9 @@ message-list {
align-items: flex-start; align-items: flex-start;
margin-bottom: 15px; margin-bottom: 15px;
padding: 10px; padding: 10px;
background: #222; /*background: #222;*/
border-radius: 8px; border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); /* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);*/
} }
.chat-messages .message .avatar { .chat-messages .message .avatar {

View File

@ -22,6 +22,16 @@ class ChatWindowElement extends HTMLElement {
const chatHeader = document.createElement("div") const chatHeader = document.createElement("div")
chatHeader.classList.add("chat-header") chatHeader.classList.add("chat-header")
let installPrompt = null
window.addEventListener("beforeinstallprompt", async(event) => {
event.preventDefault();
installPrompt = event;
const result = await installPrompt.prompt()
console.info(result.outcome)
//installButton.removeAttribute("hidden");
});
const chatTitle = document.createElement('h2') const chatTitle = document.createElement('h2')
chatTitle.classList.add("chat-title") chatTitle.classList.add("chat-title")
chatTitle.innerText = "Loading..." chatTitle.innerText = "Loading..."

View File

@ -12,6 +12,8 @@
<script src="/chat-input.js"></script> <script src="/chat-input.js"></script>
<script src="/chat-window.js"></script> <script src="/chat-window.js"></script>
<link rel="stylesheet" href="base.css"> <link rel="stylesheet" href="base.css">
<link rel="manifest" href="manifest.json" />
</head> </head>
<body> <body>
<header> <header>