wn/home-automation
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

new ui 7

Browse Source
This commit is contained in:
Wolfgang Hottgenroth
2025-11-17 21:54:40 +01:00
parent ecf31c7f8b
commit a2c2ef7ddd
2 changed files with 17 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
apps/ui/templates/device.html
View File

@@ -301,9 +301,6 @@
let deviceState = {}; let deviceState = {};
let roomName = ''; let roomName = '';
// SSE connection
let eventSource = null;
// Device type icons // Device type icons
const deviceIcons = { const deviceIcons = {
'light': '💡', 'light': '💡',

53
apps/ui/templates/room.html
View File

@@ -227,9 +227,6 @@
// Device states // Device states
const deviceStates = {}; const deviceStates = {};
// SSE connection
let eventSource = null;
async function loadRoom() { async function loadRoom() {
const loading = document.getElementById('loading'); const loading = document.getElementById('loading');
const grid = document.getElementById('devices-grid'); const grid = document.getElementById('devices-grid');
@@ -411,43 +408,27 @@
function connectRealtime() { function connectRealtime() {
try { try {
eventSource = new EventSource(window.apiClient.api('/realtime')); // Use API client's connectRealtime method
window.apiClient.connectRealtime((event) => {
// Update device state
if (event.device_id && event.state) {
deviceStates[event.device_id] = event.state;
eventSource.onmessage = (event) => { // Update card if visible
try { const card = document.querySelector(`[data-device-id="${event.device_id}"]`);
const data = JSON.parse(event.data); if (card) {
const stateDiv = card.querySelector('.device-state');
// Update device state window.apiClient.getDevices().then(devices => {
if (data.device_id && data.payload) { const device = window.apiClient.findDevice(devices, event.device_id);
deviceStates[data.device_id] = data.payload; if (device) {
updateDeviceCardState(stateDiv, device);
// Update card if visible }
const card = document.querySelector(`[data-device-id="${data.device_id}"]`); });
if (card) {
const stateDiv = card.querySelector('.device-state');
window.apiClient.getDevices().then(devices => {
const device = window.apiClient.findDevice(devices, data.device_id);
if (device) {
updateDeviceCardState(stateDiv, device);
}
});
}
} }
} catch (e) {
console.warn('Failed to parse SSE event:', e);
} }
}; }, (error) => {
eventSource.onerror = (error) => {
console.error('SSE connection error:', error); console.error('SSE connection error:', error);
// Auto-reconnect after 5 seconds });
setTimeout(() => {
if (eventSource) {
eventSource.close();
connectRealtime();
}
}, 5000);
};
} catch (error) { } catch (error) {
console.error('Failed to connect to realtime events:', error); console.error('Failed to connect to realtime events:', error);