kawkab-frontend
Version:
Kawkab frontend is a frontend library for the Kawkab framework
79 lines (78 loc) • 2.64 kB
JavaScript
export class SocketClient {
url;
socket = null;
eventListeners = new Map();
constructor(url) {
this.url = url;
}
connect() {
if (this.socket && this.socket.readyState === WebSocket.OPEN) {
console.warn('WebSocket is already connected.');
return;
}
this.socket = new WebSocket(this.url);
this.socket.onopen = () => {
console.log('WebSocket connection established.');
this.triggerEvent('open', null);
};
this.socket.onmessage = (event) => {
try {
const parsedData = JSON.parse(event.data);
const { event: eventName, data } = parsedData;
if (eventName) {
this.triggerEvent(eventName, data);
}
else {
this.triggerEvent('message', parsedData);
}
}
catch (e) {
console.error('Failed to parse WebSocket message:', event.data);
}
};
this.socket.onerror = (error) => {
console.error('WebSocket error:', error);
this.triggerEvent('error', error);
};
this.socket.onclose = (event) => {
console.log('WebSocket connection closed:', event.reason);
this.triggerEvent('close', { code: event.code, reason: event.reason });
this.socket = null;
};
}
disconnect() {
if (this.socket) {
this.socket.close();
}
}
on(eventName, handler) {
if (!this.eventListeners.has(eventName)) {
this.eventListeners.set(eventName, []);
}
this.eventListeners.get(eventName).push(handler);
}
emit(eventName, data) {
if (!this.socket || this.socket.readyState !== WebSocket.OPEN) {
console.error('WebSocket is not connected. Cannot emit event.');
return;
}
const payload = JSON.stringify({ event: eventName, data });
this.socket.send(payload);
}
triggerEvent(eventName, data) {
const handlers = this.eventListeners.get(eventName);
if (handlers) {
handlers.forEach(handler => handler(data));
}
}
get isConnected() {
return !!this.socket && this.socket.readyState === WebSocket.OPEN;
}
off(eventName, handler) {
const handlers = this.eventListeners.get(eventName);
if (handlers) {
const newHandlers = handlers.filter(h => h !== handler);
this.eventListeners.set(eventName, newHandlers);
}
}
}