'use strict'; const getCookie = name => { const row = document.cookie.split('; ').find(item => item.startsWith(`${name}=`)); return row ? decodeURIComponent(row.split('=').slice(1).join('=')) : ''; }; const setCookie = (name, value) => { document.cookie = `${name}=${encodeURIComponent(value)}; Max-Age=31536000; Path=/; SameSite=Lax`; }; const DEFAULT_LANGUAGE = 'en'; const preferredLanguage = getCookie('gree_controller_language') || DEFAULT_LANGUAGE; const preferredTheme = ['system', 'light', 'dark'].includes(getCookie('gree_controller_theme')) ? getCookie('gree_controller_theme') : 'system'; const app = { devices: [], zones: [], schedules: [], automations: [], accessTokens: [], settings: null, system: {}, outdoorTemperature: null, token: localStorage.getItem('gree_controller_token') || '', ws: null, wsTimer: null, currentView: 'dashboard', loading: false, language: preferredLanguage, theme: preferredTheme, connectionStatus: 'connecting', languages: [], translations: {}, locales: {}, historyTab: 'overview', historyData: {zones:[], devices:[], sensors:[]}, historyCounts: {}, historyZone: 'all', historyDevice: 'all', historySensor: 'all', historyLoading: false, customChartSeries: [], savedCharts: [], zoneControlSeq: {}, zoneTemperatureTimers: {}, controlPlan: null, controlPlanTimer: null, debugLines: [], debugBacklogLoaded: false, }; try { app.savedCharts = JSON.parse(localStorage.getItem('gree_controller_saved_charts') || '[]'); } catch (_) { app.savedCharts = []; } const $ = (selector, root = document) => root.querySelector(selector); const $$ = (selector, root = document) => [...root.querySelectorAll(selector)]; const clamp = (value, min, max) => Math.min(max, Math.max(min, value)); const esc = value => String(value ?? '').replace(/[&<>'"]/g, char => ({'&':'&','<':'<','>':'>',"'":''','"':'"'}[char])); const locale = () => app.locales[app.language] || app.locales[DEFAULT_LANGUAGE] || 'en-GB'; const tr = (key, params = {}) => { const template = app.translations[app.language]?.[key] ?? app.translations[DEFAULT_LANGUAGE]?.[key] ?? key; return String(template).replace(/\{([a-zA-Z0-9_]+)\}/g, (_, name) => params[name] ?? `{${name}}`); }; const fmtTemp = value => value !== null && value !== undefined && value !== '' && Number.isFinite(Number(value)) ? `${Number(value).toFixed(1)}°C` : '--'; const historyNumber = value => value === null || value === undefined || value === '' ? NaN : Number(value); const modeLabel = mode => tr(`mode.${mode}`) === `mode.${mode}` ? mode : tr(`mode.${mode}`); const fanLabel = value => ({0:'fan.auto',1:'fan.low',2:'fan.mediumLow',3:'fan.medium',4:'fan.mediumHigh',5:'fan.high'}[value] ? tr({0:'fan.auto',1:'fan.low',2:'fan.mediumLow',3:'fan.medium',4:'fan.mediumHigh',5:'fan.high'}[value]) : value); const dateTime = value => value ? new Intl.DateTimeFormat(locale(), {dateStyle:'short', timeStyle:'short'}).format(new Date(value)) : '—'; function applyTheme() { const resolved = app.theme === 'light' || app.theme === 'dark' ? app.theme : (window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark'); document.documentElement.dataset.theme = resolved; const meta = $('#themeColorMeta'); if (meta) meta.content = resolved === 'light' ? '#f8faf9' : '#151515'; const select = $('#themeSelect'); if (select) select.value = app.theme; drawCurrentChartIfVisible(); } function applyTranslations() { document.documentElement.lang = app.language; $$('[data-i18n]').forEach(node => { node.textContent = tr(node.dataset.i18n); }); $$('[data-i18n-placeholder]').forEach(node => { node.placeholder = tr(node.dataset.i18nPlaceholder); }); $$('[data-i18n-title]').forEach(node => { node.title = tr(node.dataset.i18nTitle); }); $$('[data-i18n-aria]').forEach(node => { node.setAttribute('aria-label', tr(node.dataset.i18nAria)); }); $$('[data-i18n-content]').forEach(node => { node.setAttribute('content', tr(node.dataset.i18nContent)); }); $$('[data-day]').forEach(node => { node.textContent = tr(`day.${node.dataset.day}`); }); $('#languageSelect').value = app.language; $('#themeSelect').value = app.theme; const connectionLabel = $('#connectionLabel'); if (connectionLabel) connectionLabel.textContent = tr(`status.${app.connectionStatus}`); renderAll(); if (app.currentView === 'logs') loadLogs(); if (app.currentView === 'history' && app.zones.length) loadHistory(); } function setLanguage(language) { const available = app.languages.some(item => item.code === language); app.language = available ? language : DEFAULT_LANGUAGE; setCookie('gree_controller_language', app.language); applyTranslations(); } function renderLanguageOptions() { const select = $('#languageSelect'); if (!select) return; select.innerHTML = app.languages.map(item => { const label = item.native_name || item.name || item.code.toUpperCase(); return ``; }).join(''); select.value = app.language; } async function loadLanguages() { try { const response = await fetch('/lang/index.json', {cache: 'no-cache'}); if (!response.ok) throw new Error(`Language index HTTP ${response.status}`); const manifest = await response.json(); const languages = Array.isArray(manifest.languages) ? manifest.languages : []; if (!languages.some(item => item.code === DEFAULT_LANGUAGE)) throw new Error('Default English language pack is missing'); const loaded = await Promise.all(languages.map(async item => { const packResponse = await fetch(item.path || `/lang/${encodeURIComponent(item.code)}.json`, {cache: 'no-cache'}); if (!packResponse.ok) throw new Error(`Language ${item.code} HTTP ${packResponse.status}`); const pack = await packResponse.json(); return {item, pack}; })); app.languages = loaded.map(({item}) => item); app.translations = Object.fromEntries(loaded.map(({item, pack}) => [item.code, pack.translations || {}])); app.locales = Object.fromEntries(loaded.map(({item, pack}) => [item.code, pack.meta?.locale || item.locale || item.code])); app.language = app.languages.some(item => item.code === preferredLanguage) ? preferredLanguage : (manifest.default || DEFAULT_LANGUAGE); if (!app.languages.some(item => item.code === app.language)) app.language = DEFAULT_LANGUAGE; renderLanguageOptions(); } catch (error) { console.error('Unable to load language packs:', error); app.languages = [{code: DEFAULT_LANGUAGE, name: 'English', native_name: 'English', locale: 'en-GB'}]; app.translations = {[DEFAULT_LANGUAGE]: {}}; app.locales = {[DEFAULT_LANGUAGE]: 'en-GB'}; app.language = DEFAULT_LANGUAGE; renderLanguageOptions(); } } function setTheme(theme) { app.theme = ['system', 'light', 'dark'].includes(theme) ? theme : 'system'; setCookie('gree_controller_theme', app.theme); applyTheme(); } async function api(path, options = {}) { const headers = new Headers(options.headers || {}); headers.set('Accept', 'application/json'); if (app.token) headers.set('Authorization', `Bearer ${app.token}`); let body = options.body; if (body !== undefined && body !== null && typeof body !== 'string') { headers.set('Content-Type', 'application/json'); body = JSON.stringify(body); } const response = await fetch(path, {...options, headers, body}); if (response.status === 401) { showTokenDialog(); throw new Error(tr('auth.invalid')); } if (!response.ok) { let message = tr('error.http', {status: response.status}); try { message = (await response.json()).error || message; } catch (_) {} throw new Error(message); } if (response.status === 204) return null; return response.json(); } function toast(message, error = false) { const host = $('#toastStack'); if (!host) return; const item = document.createElement('div'); item.className = `toast-item ${error ? 'error' : 'success'}`; item.innerHTML = `${error ? '!' : '✓'}
${esc(error ? tr('toast.errorTitle') : tr('toast.successTitle'))}${esc(message)}
`; host.appendChild(item); requestAnimationFrame(() => item.classList.add('show')); const remove = () => { item.classList.remove('show'); item.classList.add('leaving'); setTimeout(() => item.remove(), 220); }; item.querySelector('.toast-close').addEventListener('click', remove); item._timer = setTimeout(remove, error ? 5200 : 3600); } function showTokenDialog() { const dialog = $('#tokenDialog'); if (!dialog.open) dialog.showModal(); } async function loadBootstrap(showMessage = false) { if (app.loading) return; app.loading = true; try { const data = await api('/api/bootstrap'); app.devices = data.devices || []; app.zones = data.zones || []; app.schedules = data.schedules || []; app.automations = data.automations || []; app.accessTokens = data.access_tokens || []; app.settings = data.settings || null; app.system = data.system || {}; app.outdoorTemperature = Number.isFinite(Number(data.outdoor_temperature)) ? Number(data.outdoor_temperature) : null; renderAll(); loadControlPlan(); if (app.settings?.debug?.overlay_enabled) loadDebugBacklog(); if (showMessage) toast(tr('common.updated')); if ($('#tokenDialog').open) $('#tokenDialog').close(); connectWebSocket(); } catch (error) { if (!String(error.message).toLowerCase().includes('token')) toast(error.message, true); } finally { app.loading = false; } } function renderAll() { renderSummary(); renderHouseClimate(); renderControlPlan(); renderSimulationPage(); renderDevices(); renderZones(); renderSchedules(); renderAutomations(); renderAccessTokens(); fillSelects(); renderSettings(); renderDebugOverlay(); } function renderSummary() { const temperatures = app.devices.map(d => d.current_temperature).filter(Number.isFinite); const average = temperatures.length ? temperatures.reduce((a,b) => a+b, 0) / temperatures.length : null; const online = app.devices.filter(d => d.online).length; const active = app.devices.filter(d => d.power).length; const demand = app.zones.filter(z => z.enabled && z.demand).length; $('#heroTemperature').innerHTML = `${average === null ? '--' : average.toFixed(1)}°C`; const activeSuffix = active ? tr('dashboard.summaryActive', {count: active}) : ''; $('#summaryText').textContent = app.devices.length ? tr('dashboard.summary', {online, total: app.devices.length, active: activeSuffix}) : tr('dashboard.empty'); $('#metrics').innerHTML = [ [tr('dashboard.metricOnline'), `${online}/${app.devices.length}`], [tr('dashboard.metricActive'), active], [tr('dashboard.metricDemand'), demand], ].map(([label,value]) => `
${esc(label)}${esc(value)}
`).join(''); } function renderHouseClimate() { const node = $('#houseClimate'); if (!node || !app.settings) return; const mode = app.settings.house_mode || 'cool'; const outdoor = app.outdoorTemperature == null ? tr('common.unavailable') : fmtTemp(app.outdoorTemperature); node.innerHTML = `
${esc(tr('house.seasonMode'))}

${esc(tr('house.smartThermostat'))}

${esc(tr('house.setpointStrategy'))}

${esc(tr('house.outdoor'))}${esc(outdoor)}
${['auto','comfort','sleep','away'].map(p=>``).join('')}
`; } function planEventMarkup(event) { const when = event?.at ? new Date(event.at).toLocaleString(locale(), {weekday:'short', hour:'2-digit', minute:'2-digit'}) : '—'; const target = event?.target_temperature == null ? '' : ` · ${fmtTemp(event.target_temperature)}`; return `
  • ${esc(event?.label || event?.kind || tr('plan.event'))}${esc(target)}
    • `; } function automationTriggerLabel(item) { if (item.trigger_kind === 'time') return tr('automations.triggerAt', {time: item.at_time || '—'}); const key = item.trigger_kind === 'temperature_above' ? 'automations.triggerAbove' : 'automations.triggerBelow'; return tr(key, {temperature: fmtTemp(item.threshold)}); } function renderControlPlan() { const host = $('#controlPlan'); if (!host) return; const plan = app.controlPlan; if (!plan) { host.innerHTML = `
    ${esc(tr('plan.loading'))}
    `; return; } const houseEvents = (plan.next_events || []).slice(0, 5); const house = `
    ${esc(tr('plan.house'))}

    ${esc(modeLabel(plan.house_mode || 'off'))}

    ${esc(plan.control_strategy || 'setpoint')}

    ${esc(tr('plan.houseSummary', {zones:(plan.zones || []).filter(zone=>zone.enabled).length, demand:(plan.zones || []).filter(zone=>zone.enabled && zone.demand).length}))}

    `; const zones = (plan.zones || []).map(zone => { const events = (zone.next_events || []).slice(0, 3); const target = zone.target_temperature == null ? '--' : Number(zone.target_temperature).toFixed(1); return `
    ${esc(zone.device_name || tr('common.noDevice'))}

    ${esc(zone.zone_name)}

    ${esc(zone.enabled ? (zone.demand ? tr('zones.requesting') : tr('zones.satisfied')) : tr('common.disabled'))}
    ${fmtTemp(zone.current_temperature)}→${esc(target)}°C

    ${esc(modeLabel(zone.mode || 'off'))} · ${esc(zonePresetLabel(zone.preset))}${zone.current_schedule_name ? ` · ${esc(zone.current_schedule_name)}` : ''}

    `; }).join(''); const rules = (plan.rules || []).filter(rule => rule.enabled); const ruleCard = rules.length ? `
    ${esc(tr('plan.rules'))}

    ${esc(tr('plan.ruleCount', {count:rules.length}))}

    ` : ''; host.innerHTML = house + zones + ruleCard; } async function loadControlPlan() { try { app.controlPlan = await api('/api/control-plan'); renderControlPlan(); renderSimulationPage(); } catch (error) { console.warn('Unable to load control plan:', error); } } function simulationTime(value, options = {}) { if (!value) return '—'; const date = new Date(value); return date.toLocaleString(locale(), {weekday: options.withDay === false ? undefined : 'short', hour:'2-digit', minute:'2-digit'}).replace(',', ''); } function simulationNumeric(value) { const n = Number(value); return Number.isFinite(n) ? n : null; } function simulationOutdoorAssist(mode, outdoor, room, target) { if (outdoor == null || room == null || target == null) return 0; const roomError = Math.abs(room - target); const weather = mode === 'heat' ? clamp((5 - outdoor) / 15, 0, 1) : clamp((outdoor - 30) / 10, 0, 1); return clamp(weather * clamp(roomError, 0, 2) * 0.5, 0, 1); } function simulationRoundDeviceSetpoint(mode, demand, value) { const safe = clamp(Number(value) || 0, 16, 30); if (mode === 'heat' && demand) return Math.ceil(safe); if (mode === 'heat' && !demand) return Math.floor(safe); if (mode !== 'heat' && demand) return Math.floor(safe); return Math.ceil(safe); } function simulationSmartFanSpeed(mode, room, target, outdoor, demand) { if (!demand) return 1; const error = Math.abs(room - target); const extremeWeather = mode === 'heat' ? outdoor != null && outdoor <= 0 : outdoor != null && outdoor >= 32; if (error >= 2 || extremeWeather) return 3; if (error >= 1) return 2; return 0; } function simulationStatusInfo(status) { const map = { disabled: {label: tr('common.disabled'), badge: ''}, off: {label: tr('mode.off'), badge: ''}, waiting: {label: tr('simulation.waitingForData'), badge: ''}, demand: {label: tr('simulation.stateDemand'), badge: 'active'}, satisfied: {label: tr('simulation.stateSatisfied'), badge: ''}, }; return map[status] || {label: status, badge: ''}; } function buildZoneSimulation(zone, planZone) { const device = app.devices.find(item => item.id === (planZone?.device_id || zone?.device_id)); const mode = planZone?.mode || zone?.effective_mode || zone?.mode || app.settings?.house_mode || 'off'; const current = simulationNumeric(planZone?.current_temperature ?? zone?.current_temperature ?? zone?.device_temperature ?? device?.current_temperature); const target = simulationNumeric(planZone?.target_temperature ?? zone?.effective_setpoint ?? zone?.manual_setpoint ?? zone?.setpoint); const outdoor = simulationNumeric(app.outdoorTemperature ?? app.controlPlan?.outdoor_temperature); const hysteresis = Math.max(simulationNumeric(zone?.hysteresis) || 0.4, 0.1); const half = hysteresis / 2; let status = 'waiting'; let demand = false; if (!zone?.enabled || planZone?.enabled === false) status = 'disabled'; else if (mode === 'off') status = 'off'; else if (current == null || target == null) status = 'waiting'; else { if (mode === 'heat') { if (current <= target - half) demand = true; else if (current >= target + half) demand = false; else demand = !!zone?.demand; } else { if (current >= target + half) demand = true; else if (current <= target - half) demand = false; else demand = !!zone?.demand; } status = demand ? 'demand' : 'satisfied'; } const standbyOffset = Math.max(simulationNumeric(zone?.standby_offset_c) || 0.5, 0.5); const assist = current == null || target == null ? 0 : simulationOutdoorAssist(mode, outdoor, current, target); const activeTarget = current == null || target == null ? null : (mode === 'heat' ? target + assist : target - assist); const standbyTarget = target == null ? null : (mode === 'heat' ? target - standbyOffset : target + standbyOffset); const desiredDeviceTarget = current == null || target == null ? null : simulationRoundDeviceSetpoint(mode, demand, demand ? activeTarget : standbyTarget); const fanSpeed = zone?.smart_fan && current != null && target != null ? simulationSmartFanSpeed(mode, current, target, outdoor, demand) : simulationNumeric(device?.fan_speed); const quiet = zone?.smart_fan ? (!demand ? tr('simulation.quietIfSupported') : tr('common.off')) : tr('simulation.manual'); const reasoning = !zone?.enabled || planZone?.enabled === false ? tr('simulation.reasonDisabled') : mode === 'off' ? tr('simulation.reasonHouseOff') : current == null || target == null ? tr('simulation.reasonWaiting') : demand ? tr('simulation.reasonDemand', {mode: modeLabel(mode), target: target.toFixed(1), hysteresis: hysteresis.toFixed(1)}) : tr('simulation.reasonSatisfied', {target: target.toFixed(1), standby: standbyTarget.toFixed(1)}); return {device, mode, current, target, demand, status, outdoor, hysteresis, assist, activeTarget, standbyTarget, desiredDeviceTarget, fanSpeed, quiet, reasoning}; } function simulationRuleAction(rule) { const bits = []; if (rule.action?.power != null) bits.push(`${tr('common.power')}: ${rule.action.power ? tr('common.on') : tr('common.off')}`); if (rule.action?.mode) bits.push(`${tr('common.mode')}: ${modeLabel(rule.action.mode)}`); if (rule.action?.target_temperature != null) bits.push(`${tr('common.temperature')}: ${fmtTemp(rule.action.target_temperature)}`); return bits.length ? bits.join(' · ') : tr('simulation.noActionPreview'); } function renderSimulationPage() { const summaryHost = $('#simulationSummary'); const timelineHost = $('#simulationTimeline'); const zonesHost = $('#simulationZones'); const rulesHost = $('#simulationRules'); if (!summaryHost || !timelineHost || !zonesHost || !rulesHost) return; const plan = app.controlPlan; if (!plan) { summaryHost.innerHTML = `
    ${esc(tr('plan.loading'))}
    `; timelineHost.innerHTML = ''; zonesHost.innerHTML = ''; rulesHost.innerHTML = ''; return; } const enabledZones = (plan.zones || []).filter(zone => zone.enabled); const demandingZones = enabledZones.filter(zone => zone.demand); summaryHost.innerHTML = [ {label: tr('simulation.houseMode'), value: modeLabel(plan.house_mode || 'off'), note: tr('simulation.strategy', {strategy: plan.control_strategy || 'setpoint'})}, {label: tr('simulation.outdoor'), value: plan.outdoor_temperature == null ? '—' : fmtTemp(plan.outdoor_temperature), note: tr('simulation.generatedAt', {time: dateTime(plan.generated_at)})}, {label: tr('simulation.activeZones'), value: String(enabledZones.length), note: tr('simulation.requestingZones', {count: demandingZones.length})}, {label: tr('simulation.rulesLabel'), value: String((plan.rules || []).filter(rule => rule.enabled).length), note: tr('simulation.eventsQueued', {count: (plan.next_events || []).length})}, ].map(card => `
    ${esc(card.label)}${esc(card.value)}${esc(card.note)}
    `).join(''); const timelineItems = []; (plan.next_events || []).forEach(event => timelineItems.push({scope: tr('simulation.house'), event})); (plan.zones || []).forEach(zone => (zone.next_events || []).forEach(event => timelineItems.push({scope: zone.zone_name, event, device: zone.device_name}))); timelineItems.sort((a, b) => new Date(a.event.at) - new Date(b.event.at)); const unique = []; const seen = new Set(); for (const item of timelineItems) { const key = `${item.scope}|${item.event.at}|${item.event.label}`; if (seen.has(key)) continue; seen.add(key); unique.push(item); if (unique.length >= 16) break; } timelineHost.innerHTML = unique.length ? unique.map(item => { const target = item.event.target_temperature == null ? '' : ` · ${fmtTemp(item.event.target_temperature)}`; return `
    ${esc(item.scope)}

    ${esc(item.event.label)}${esc(target)}${item.device ? ` · ${esc(item.device)}` : ''}

    `; }).join('') : `
    ${esc(tr('plan.noEvents'))}
    `; zonesHost.innerHTML = (plan.zones || []).length ? plan.zones.map(planZone => { const zone = app.zones.find(item => item.id === planZone.zone_id); const sim = buildZoneSimulation(zone, planZone); const status = simulationStatusInfo(sim.status); const events = (planZone.next_events || []).slice(0, 4); const sourceLabel = zoneControlSourceLabel(planZone.control_source); const fanText = sim.fanSpeed == null ? '—' : fanLabel(sim.fanSpeed); const commandText = sim.desiredDeviceTarget == null ? tr('simulation.noCommand') : `${fmtTemp(sim.desiredDeviceTarget)} · ${fanText} · ${tr('devices.quiet')}: ${sim.quiet}`; return `
    ${esc(planZone.device_name || tr('common.noDevice'))}

    ${esc(planZone.zone_name)}

    ${esc(modeLabel(sim.mode))} · ${esc(zonePresetLabel(planZone.preset))}${planZone.current_schedule_name ? ` · ${esc(planZone.current_schedule_name)}` : ''}

    ${esc(status.label)}
    ${esc(tr('simulation.stepRoom'))}${esc(fmtTemp(sim.current))}${esc(sourceLabel)}
    ${esc(tr('simulation.stepTarget'))}${esc(sim.target == null ? '—' : `${sim.target.toFixed(1)}°C`)}${esc(tr('simulation.hysteresis', {value: sim.hysteresis.toFixed(1)}))}
    ${esc(tr('simulation.stepDecision'))}${esc(status.label)}${esc(sim.reasoning)}
    ${esc(tr('simulation.stepCommand'))}${esc(commandText)}${esc(sim.demand ? tr('simulation.activeTargetLabel', {value: sim.activeTarget == null ? '—' : sim.activeTarget.toFixed(1)}) : tr('simulation.standbyTargetLabel', {value: sim.standbyTarget == null ? '—' : sim.standbyTarget.toFixed(1)}))}
    ${esc(tr('simulation.deviceSetpoint'))}${esc(sim.desiredDeviceTarget == null ? '—' : fmtTemp(sim.desiredDeviceTarget))}
    ${esc(tr('common.fan'))}${esc(fanText)}
    ${esc(tr('devices.quiet'))}${esc(sim.quiet)}
    ${esc(tr('simulation.outdoor'))}${esc(sim.outdoor == null ? '—' : fmtTemp(sim.outdoor))}
    `; }).join('') : `
    ${esc(tr('zones.emptyText'))}
    `; const activeRules = (plan.rules || []).filter(rule => rule.enabled); rulesHost.innerHTML = activeRules.length ? activeRules.map(rule => `
    ${esc(tr('common.automation'))}

    ${esc(rule.name)}

    ${esc(automationTriggerLabel(rule))}

    ${esc(tr('simulation.ruleOnDevice', {device: rule.action_device_name || tr('common.noDevice')}))}

    ${esc(simulationRuleAction(rule))}
    ${esc(tr('automations.last'))}: ${esc(dateTime(rule.last_fired_at))}${esc(tr('simulation.nextReady'))}: ${esc(dateTime(rule.next_ready_at))}
    `).join('') : `
    ${esc(tr('simulation.noRules'))}
    `; } function scheduleControlPlanLoad() { clearTimeout(app.controlPlanTimer); app.controlPlanTimer = setTimeout(loadControlPlan, 180); } function deviceCard(device, detailed = false) { const modes = ['auto','cool','dry','fan','heat']; const fans = [0,1,3,5]; const error = device.last_error ? `${esc(device.last_error)}` : `${esc(device.ip)}:${esc(device.port)} · ${device.simulated ? tr('devices.simulator') : device.protocol_version === 2 ? 'V2 GCM' : device.protocol_version === 1 ? 'V1 ECB' : tr('devices.protocolAuto')}`; return `

    ${esc(device.name)}

    ${esc(tr(device.online ? 'status.online' : 'status.offline'))} · ${esc(device.model || device.mac)}

    ${Number(device.target_temperature).toFixed(1)}°C
    ${esc(tr('devices.currentTemperature'))}: ${fmtTemp(device.current_temperature)}${device.outdoor_temperature == null ? '' : ` · ${esc(tr('devices.outdoor'))} ${fmtTemp(device.outdoor_temperature)}`}
    ${modes.map(mode => ``).join('')}
    ${fans.map(fan => ``).join('')}
    ${detailed ? `
    ${error}
    ${device.simulated ? '' : ``}
    ` : ''}
    `; } function renderDevices() { const empty = `
    ${esc(tr('devices.emptyTitle'))}${esc(tr('devices.emptyText'))}
    `; $('#dashboardDevices').innerHTML = app.devices.length ? app.devices.map(d => deviceCard(d, false)).join('') : empty; $('#deviceList').innerHTML = app.devices.length ? app.devices.map(d => deviceCard(d, true)).join('') : empty; } function zoneStrategyLabel(zone) { if (zone.sensor_source === 'combined') return tr('zones.combinedSource'); if (zone.sensor_source === 'home_assistant') return tr('zones.externalSource'); return tr('zones.greeSource'); } function zoneControlSourceLabel(source) { return ({ device: tr('zones.sourceDevice'), external: tr('zones.sourceExternal'), combined: tr('zones.sourceCombined'), device_fallback: tr('zones.sourceFallback'), device_discrepancy_fallback: tr('zones.sourceDiscrepancy'), unavailable: tr('zones.sourceUnavailable'), })[source] || source || tr('zones.sourceUnavailable'); } function zonePresetLabel(preset) { const key = `preset.${preset || 'comfort'}`; return tr(key) === key ? (preset || 'comfort') : tr(key); } function zoneCard(zone, detailed = true) { const device = app.devices.find(d => d.id === zone.device_id); const state = zone.enabled ? tr('common.active') : tr('common.disabled'); const sensorDetails = zone.sensor_source === 'device' ? `${tr('zones.greeTemp')}: ${fmtTemp(zone.device_temperature ?? device?.current_temperature)}` : `${tr('zones.greeTemp')}: ${fmtTemp(zone.device_temperature)} · ${tr('zones.externalTemp')}: ${fmtTemp(zone.external_temperature)} · ${tr('zones.usedSource')}: ${zoneControlSourceLabel(zone.control_temperature_source)}`; const target = Number(zone.effective_setpoint ?? zone.setpoint); const manual = zone.manual_preset || 'auto'; const mode = zone.inherit_house_mode ? 'house' : zone.mode; const override = zone.manual_override_until ? `${tr('zones.overrideUntil')} ${new Date(zone.manual_override_until).toLocaleTimeString(locale(), {hour:'2-digit',minute:'2-digit'})}` : tr('zones.scheduleControl'); const enabledControl = detailed ? `${esc(state)}` : ``; return `

    ${esc(zone.name)}

    ${esc(device?.name || tr('common.noDevice'))} · ${esc(zonePresetLabel(zone.active_preset))}

    ${enabledControl}
    ${esc(tr('zones.measurement'))}${fmtTemp(zone.current_temperature)}
    ${Number.isFinite(target)?target.toFixed(1):'--'}°C
    ${esc(tr('zones.deviceTarget'))}${fmtTemp(zone.device_setpoint)}
    ${['auto','comfort','sleep','away'].map(preset=>``).join('')}
    ${zone.demand ? esc(tr('zones.requesting')) : esc(tr('zones.satisfied'))}${esc(override)}
    ${detailed ? `
    ${esc(sensorDetails)}
    ${esc(tr('zones.quickHintSmart'))}
    ` : ''}
    `; } function renderZones() { const empty = `
    ${esc(tr('zones.emptyTitle'))}${esc(tr('zones.emptyText'))}
    `; $('#zoneList').innerHTML = app.zones.length ? app.zones.map(zone => zoneCard(zone, true)).join('') : empty; const dashboard = $('#dashboardZones'); if (dashboard) dashboard.innerHTML = app.zones.length ? app.zones.map(zone => zoneCard(zone, false)).join('') : empty; } function renderSchedules() { const dayNames = Array.from({length:7}, (_, index) => tr(`day.${index + 1}`)); $('#scheduleList').innerHTML = app.schedules.length ? app.schedules.map(item => { const zone = app.zones.find(z => z.id === item.zone_id); const days = item.weekdays.map(day => dayNames[day-1]).join(', '); return `

    ${esc(item.name)}

    ${esc(zone?.name || tr('common.noZone'))} · ${esc(days)}

    ${esc(item.enabled ? tr('common.enabled') : tr('common.disabled'))}
    ${esc(tr('common.from'))}${esc(item.start_time)}
    ${esc(tr('common.to'))}${esc(item.end_time)}
    ${esc(tr('schedules.profile'))}${esc(item.preset === 'custom' ? fmtTemp(item.setpoint) : zonePresetLabel(item.preset))}
    ${esc(tr('schedules.crossMidnight'))}
    `; }).join('') : `
    ${esc(tr('schedules.emptyTitle'))}${esc(tr('schedules.emptyText'))}
    `; } function renderAutomations() { $('#automationList').innerHTML = app.automations.length ? app.automations.map(item => { const actionDevice = app.devices.find(d => d.id === item.action_device_id); return `

    ${esc(item.name)}

    ${esc(tr('automations.triggerSummary', {trigger: automationTriggerLabel(item), device: actionDevice?.name || tr('common.noDevice')}))}

    ${esc(item.enabled ? tr('common.active') : tr('common.disabled'))}
    ${esc(tr('common.power'))}${item.action.power == null ? '—' : item.action.power ? tr('common.on') : tr('common.off')}
    ${esc(tr('common.mode'))}${item.action.mode ? esc(modeLabel(item.action.mode)) : '—'}
    ${esc(tr('automations.last'))}${item.last_fired_at ? new Date(item.last_fired_at).toLocaleTimeString(locale(),{hour:'2-digit',minute:'2-digit'}) : '—'}
    ${esc(tr('common.cooldown'))} ${item.cooldown_seconds}s
    `; }).join('') : `
    ${esc(tr('automations.emptyTitle'))}${esc(tr('automations.emptyText'))}
    `; } function fillSelects() { const deviceOptions = app.devices.map(d => ``).join(''); const zoneOptions = app.zones.map(z => ``).join(''); ['#zoneForm [name=device_id]', '#automationForm [name=trigger_device_id]', '#automationForm [name=action_device_id]'].forEach(selector => { const select = $(selector); if (!select) return; const current = select.value; select.innerHTML = deviceOptions; if ([...select.options].some(o => o.value === current)) select.value = current; }); const zoneSelect = $('#scheduleForm [name=zone_id]'); if (zoneSelect) { const currentZone = zoneSelect.value; zoneSelect.innerHTML = zoneOptions; if ([...zoneSelect.options].some(o => o.value === currentZone)) zoneSelect.value = currentZone; } const presetZone = $('#schedulePresetZone'); if (presetZone) { const currentZone = presetZone.value; presetZone.innerHTML = zoneOptions; if ([...presetZone.options].some(o => o.value === currentZone)) presetZone.value = currentZone; } } function renderAccessTokens() { const list = $('#accessTokenList'); if (!list) return; list.innerHTML = app.accessTokens.length ? app.accessTokens.map(item => `
    ${esc(item.name)}${esc(item.token_prefix)}${esc(tr('settings.created'))}: ${esc(dateTime(item.created_at))}
    `).join('') : `
    ${esc(tr('settings.noTokens'))}${esc(tr('settings.noTokensHint'))}
    `; } function renderSettings() { if (!app.settings) return; const form = $('#settingsForm'); form.controller_id.value = app.settings.controller_id || ''; form.poll_interval_seconds.value = app.settings.poll_interval_seconds || 15; form.zone_interval_seconds.value = app.settings.zone_interval_seconds || 5; form.discovery_broadcast.value = app.settings.discovery_broadcast || '255.255.255.255:7000'; form.discovery_timeout_ms.value = app.settings.discovery_timeout_ms || 3000; form.simulator_enabled.checked = !!app.settings.simulator_enabled; form.history_retention_days.value = app.settings.history_retention_days || 30; form.history_compaction_enabled.checked = app.settings.history_compaction_enabled !== false; form.suppress_device_beep.checked = !!app.settings.suppress_device_beep; form.influx_enabled.checked = !!app.settings.influxdb?.enabled; form.influx_version.value = String(app.settings.influxdb?.version || '2'); form.influx_threshold_days.value = app.settings.influxdb?.history_threshold_days || 30; form.influx_url.value = app.settings.influxdb?.url || ''; form.influx_database.value = app.settings.influxdb?.database || 'gree_controller'; form.influx_username.value = app.settings.influxdb?.username || ''; form.influx_password.value = ''; form.influx_password.placeholder = app.settings.influxdb?.password_configured ? tr('settings.secretSaved') : tr('settings.secretKeep'); form.influx_org.value = app.settings.influxdb?.org || ''; form.influx_bucket.value = app.settings.influxdb?.bucket || 'gree_controller'; form.influx_token.value = ''; form.influx_token.placeholder = app.settings.influxdb?.token_configured ? tr('settings.secretSaved') : tr('settings.secretKeep'); form.debug_overlay_enabled.checked = !!app.settings.debug?.overlay_enabled; form.debug_gree_frames.checked = !!app.settings.debug?.gree_frames; form.ha_url.value = app.settings.home_assistant?.url || ''; form.ha_token.value = ''; form.ha_token.placeholder = app.settings.home_assistant?.token_configured ? tr('settings.haTokenSaved') : tr('settings.haLongLivedToken'); form.ha_entity_id.value = app.settings.home_assistant?.default_entity_id || ''; form.ha_outdoor_entity_id.value = app.settings.home_assistant?.outdoor_entity_id || ''; form.ha_allow_invalid_tls.checked = !!app.settings.home_assistant?.allow_invalid_tls; form.outdoor_assist_enabled.checked = !!app.settings.outdoor_assist_enabled; updateInfluxFields(); $('#systemInfo').innerHTML = `

    ${esc(tr('settings.systemState'))}

    ${esc(tr('settings.version'))}: ${esc(app.system.version || '—')}
    ${esc(tr('settings.uptime'))}: ${esc(formatDuration(app.system.uptime_seconds || 0))}
    ${esc(tr('settings.apiAuth'))}: ${esc(app.system.auth_required ? tr('settings.enabled') : tr('settings.disabled'))}
    `; } function updateInfluxFields() { const version = $('#settingsForm [name=influx_version]')?.value || '2'; $$('[data-influx-fields]').forEach(node => { node.hidden = node.dataset.influxFields !== version; }); } function debugLine(source, kind, message, timestamp = new Date().toISOString(), data = null) { app.debugLines.push({source, kind, message, timestamp, data}); if (app.debugLines.length > 160) app.debugLines.splice(0, app.debugLines.length - 160); renderDebugOverlay(); } function renderDebugOverlay() { const overlay = $('#debugOverlay'); if (!overlay) return; const enabled = !!app.settings?.debug?.overlay_enabled; overlay.hidden = !enabled; if (!enabled) return; const status = $('#debugOverlayStatus'); if (status) status.textContent = app.settings?.debug?.gree_frames ? tr('debug.apiAndGree') : tr('debug.apiOnly'); const host = $('#debugOverlayLines'); if (!host) return; host.innerHTML = app.debugLines.length ? app.debugLines.slice(-120).map(line => { const details = line.data == null ? '' : ` ${typeof line.data === 'string' ? line.data : JSON.stringify(line.data)}`; return `
    ${esc(line.source)}${esc(line.kind)}: ${esc(line.message || '')}${esc(details)}
    `; }).join('') : `
    ${esc(tr('debug.empty'))}
    `; host.scrollTop = host.scrollHeight; } async function loadDebugBacklog() { if (app.debugBacklogLoaded || !app.settings?.debug?.overlay_enabled) return; try { const data = await api('/api/events?limit=60'); app.debugLines = (data.events || []).reverse().map(item => ({source:'API', kind:item.kind, message:item.message, timestamp:item.timestamp, data:item.metadata})).slice(-120); app.debugBacklogLoaded = true; renderDebugOverlay(); } catch (_) {} } function formatDuration(seconds) { const days = Math.floor(seconds / 86400), hours = Math.floor((seconds % 86400) / 3600), minutes = Math.floor((seconds % 3600) / 60); return `${days ? `${days}d ` : ''}${hours}h ${minutes}m`; } const VIEW_ROUTES = {dashboard:'/dashboard', devices:'/devices', zones:'/zones', schedules:'/schedules', automations:'/automations', simulation:'/simulation', settings:'/settings', logs:'/events'}; const HISTORY_TABS = ['overview','zones','devices','sensors','custom']; function currentHistoryPath() { const tab = HISTORY_TABS.includes(app.historyTab) ? app.historyTab : 'overview'; const params = new URLSearchParams(); const hours = $('#historyHours')?.value || new URLSearchParams(location.search).get('hours') || '24'; if (hours !== '24') params.set('hours', hours); if (tab === 'zones' && app.historyZone !== 'all') params.set('zone', app.historyZone); if (tab === 'devices' && app.historyDevice !== 'all') params.set('device', app.historyDevice); if (tab === 'sensors' && app.historySensor !== 'all') params.set('sensor', app.historySensor); if (tab === 'custom' && app.customChartSeries.length) params.set('chart', encodeChartSpec(app.customChartSeries)); const query = params.toString(); return `/history/${tab}${query ? `?${query}` : ''}`; } function updateBrowserUrl(path, replace=false) { const current = `${location.pathname}${location.search}`; if (current === path) return; history[replace ? 'replaceState' : 'pushState']({}, '', path); } function showView(name, {push=true, scroll=true}={}) { app.currentView = name; $$('.view').forEach(view => view.classList.toggle('active', view.dataset.view === name)); $$('.bottom-nav button').forEach(button => button.classList.toggle('active', button.dataset.nav === name || (button.dataset.nav === 'more' && ['schedules','automations','simulation','settings','logs'].includes(name)))); if (push) updateBrowserUrl(name === 'history' ? currentHistoryPath() : (VIEW_ROUTES[name] || '/dashboard')); if (scroll) window.scrollTo({top: 0, behavior: 'smooth'}); if (name === 'history') { renderHistoryNavigation(); loadHistory(); } if (name === 'logs') loadLogs(); } function showHistoryTab(tab, {push=true, load=true}={}) { app.historyTab = HISTORY_TABS.includes(tab) ? tab : 'overview'; renderHistoryNavigation(); if (push) updateBrowserUrl(currentHistoryPath()); if (load) loadHistory(); } function applyRouteFromLocation() { const parts = location.pathname.split('/').filter(Boolean); const first = parts[0] || 'dashboard'; const params = new URLSearchParams(location.search); if (first === 'history') { app.historyTab = HISTORY_TABS.includes(parts[1]) ? parts[1] : 'overview'; app.historyZone = params.get('zone') || 'all'; app.historyDevice = params.get('device') || 'all'; app.historySensor = params.get('sensor') || 'all'; const hours = params.get('hours'); if (hours && ['6','24','168','720','2160','8760'].includes(hours) && $('#historyHours')) $('#historyHours').value = hours; if (app.historyTab === 'custom' && params.get('chart')) app.customChartSeries = decodeChartSpec(params.get('chart')); showView('history', {push:false, scroll:false}); return; } const reverse = Object.entries(VIEW_ROUTES).find(([,path]) => path === `/${first}`); showView(reverse?.[0] || 'dashboard', {push:false, scroll:false}); } async function sendDeviceCommand(id, command) { try { const device = await api(`/api/devices/${encodeURIComponent(id)}/command`, {method:'POST', body:command}); updateDevice(device); renderAll(); } catch (error) { toast(error.message, true); } } function updateDevice(device) { const index = app.devices.findIndex(item => item.id === device.id); if (index >= 0) app.devices[index] = device; else app.devices.push(device); } async function sendZoneControl(id, patch) { const sequence = (app.zoneControlSeq[id] || 0) + 1; app.zoneControlSeq[id] = sequence; try { const zone = await api(`/api/zones/${encodeURIComponent(id)}/control`, {method:'POST', body:patch}); if (app.zoneControlSeq[id] !== sequence) return; const index = app.zones.findIndex(item => item.id === zone.id); if (index >= 0) app.zones[index] = zone; else app.zones.push(zone); renderSummary(); renderZones(); scheduleControlPlanLoad(); } catch (error) { if (app.zoneControlSeq[id] === sequence) { await loadBootstrap(); toast(error.message, true); } } } function queueZoneTemperature(zone, value) { const next = Math.round(clamp(value, 8, 30) * 2) / 2; zone.manual_setpoint = next; zone.setpoint = next; zone.effective_setpoint = next; renderZones(); clearTimeout(app.zoneTemperatureTimers[zone.id]); app.zoneTemperatureTimers[zone.id] = setTimeout(() => sendZoneControl(zone.id, {setpoint: next}), 160); } function showDiscoveryNames(ids) { const wanted = new Set(Array.isArray(ids) ? ids : []); const devices = app.devices.filter(device => wanted.has(device.id)); if (!devices.length) return; const list = $('#discoveryNamesList'); list.innerHTML = devices.map(device => ` `).join(''); openDialog('discoveryNamesDialog'); } function populateDeviceRename(id) { const device = app.devices.find(item => item.id === id); if (!device) return; const form = $('#renameDeviceForm'); form.reset(); form.id.value = device.id; form.name.value = device.name; form.protocol_version.value = String(device.protocol_version ?? 0); openDialog('renameDeviceDialog'); } async function deleteEntity(type, id, labelKey) { if (!confirm(tr('confirm.delete', {label: tr(labelKey)}))) return; try { await api(`/api/${type}/${encodeURIComponent(id)}`, {method:'DELETE'}); await loadBootstrap(); toast(tr('common.removed')); } catch (error) { toast(error.message, true); } } function openDialog(id) { fillSelects(); const dialog = document.getElementById(id); if (dialog && !dialog.open) dialog.showModal(); } function updateZoneSensorFields() { const form = $('#zoneForm'); if (!form) return; const external = form.sensor_source.value !== 'device'; $('#externalSensorFields').hidden = !external; form.ha_entity_id.required = external; } function updateSchedulePresetField() { const form = $('#scheduleForm'); if (!form) return; $('#scheduleSetpointField').hidden = form.preset.value !== 'custom'; form.setpoint.required = form.preset.value === 'custom'; } function populateZone(id) { const item = app.zones.find(v => v.id === id); if (!item) return; const form = $('#zoneForm'); form.reset(); fillSelects(); Object.entries(item).forEach(([key,value]) => { if (form.elements[key] && value != null && typeof value !== 'object') form.elements[key].value = value; }); form.mode_policy.value = item.inherit_house_mode ? 'house' : (item.mode || 'cool'); if (Number(item.profile_version || 0) === 0) { if ((item.mode || 'cool') === 'heat') form.heat_comfort_setpoint.value = Number(item.setpoint ?? 21); else form.cool_comfort_setpoint.value = Number(item.setpoint ?? 23); } form.external_sensor_weight_percent.value = Math.round(Number(item.external_sensor_weight ?? 0.4) * 100); form.max_sensor_difference.value = Number(item.max_sensor_difference ?? 3); form.min_adjust_seconds.value = Number(item.min_adjust_seconds ?? 120); form.standby_offset_c.value = Number(item.standby_offset_c ?? 2); form.smart_fan.checked = item.smart_fan !== false; form.enabled.checked = item.enabled; updateZoneSensorFields(); openDialog('zoneDialog'); } function populateSchedule(id) { const item = app.schedules.find(v => v.id === id); if (!item) return; const form = $('#scheduleForm'); form.reset(); fillSelects(); ['id','name','zone_id','start_time','end_time','setpoint','preset'].forEach(key => { if (form.elements[key] && item[key] != null) form.elements[key].value = item[key]; }); form.enabled.checked = item.enabled; $$('[name=weekday]', form).forEach(input => input.checked = item.weekdays.includes(Number(input.value))); updateSchedulePresetField(); openDialog('scheduleDialog'); } function populateAutomation(id) { const item = app.automations.find(v => v.id === id); if (!item) return; const form = $('#automationForm'); form.reset(); fillSelects(); ['id','name','trigger_kind','trigger_device_id','threshold','at_time','action_device_id','cooldown_seconds'].forEach(key => { if (form.elements[key] && item[key] != null) form.elements[key].value = item[key]; }); form.action_power.value = item.action.power == null ? '' : String(item.action.power); form.action_mode.value = item.action.mode || ''; form.action_target_temperature.value = item.action.target_temperature ?? ''; form.enabled.checked = item.enabled; openDialog('automationDialog'); } function encodeChartSpec(series) { try { const raw = JSON.stringify(series || []); return btoa(raw).replace(/\+/g,'-').replace(/\//g,'_').replace(/=+$/,''); } catch (_) { return ''; } } function decodeChartSpec(encoded) { try { const padded = String(encoded || '').replace(/-/g,'+').replace(/_/g,'/').padEnd(Math.ceil(String(encoded || '').length / 4) * 4, '='); const value = JSON.parse(atob(padded)); return Array.isArray(value) ? value.filter(item => typeof item === 'string').slice(0, 16) : []; } catch (_) { return []; } } function historyEntityOptions() { const zones = app.zones.map(zone => ``).join(''); const devices = app.devices.map(device => ``).join(''); const entities = [...new Set([ ...app.historyData.sensors.map(row => row.entity_id), ...app.zones.map(zone => zone.ha_entity_id).filter(Boolean), app.settings?.home_assistant?.outdoor_entity_id, ].filter(Boolean))].sort(); const sensors = entities.map(entity => ``).join(''); return {zones, devices, sensors, entities}; } function renderHistoryNavigation() { $$('#historyTabs [data-history-tab]').forEach(button => button.classList.toggle('active', button.dataset.historyTab === app.historyTab)); const host = $('#historyContextControls'); if (!host) return; const options = historyEntityOptions(); if (app.historyTab === 'zones') { host.innerHTML = ``; const select=$('#historyZoneSelect'); if ([...select.options].some(option=>option.value===app.historyZone)) select.value=app.historyZone; } else if (app.historyTab === 'devices') { host.innerHTML = ``; const select=$('#historyDeviceSelect'); if ([...select.options].some(option=>option.value===app.historyDevice)) select.value=app.historyDevice; } else if (app.historyTab === 'sensors') { host.innerHTML = ``; const select=$('#historySensorSelect'); if ([...select.options].some(option=>option.value===app.historySensor)) select.value=app.historySensor; } else if (app.historyTab === 'custom') { host.innerHTML = `${esc(tr('history.customHint'))}`; } else { host.innerHTML = `${esc(tr('history.overviewHint'))}`; } } async function loadHistory() { if (app.historyLoading) return; app.historyLoading = true; const hours = $('#historyHours')?.value || '24'; try { const data = await api(`/api/history?scope=overview&hours=${encodeURIComponent(hours)}&limit=20000`); app.historyData = {zones:data.zones || [], devices:data.devices || [], sensors:data.sensors || []}; app.historyCounts = data.counts || {}; renderHistoryNavigation(); renderHistoryPage(); if (app.currentView === 'history') updateBrowserUrl(currentHistoryPath(), true); } catch (error) { toast(error.message, true); renderHistoryPage(); } finally { app.historyLoading = false; } } const HISTORY_COLORS = ['--accent','--info','--warning','--purple','--danger','--teal','--orange','--blue']; function cssColor(name, fallback) { const value = getComputedStyle(document.documentElement).getPropertyValue(name).trim(); return value || fallback; } function timeLabel(ts, hours) { const options = Number(hours) > 48 ? {day:'2-digit', month:'2-digit', hour:'2-digit'} : {hour:'2-digit', minute:'2-digit'}; return new Date(ts).toLocaleString(locale(), options); } function prepareCanvas(canvas, height) { const rect = canvas.getBoundingClientRect(); const width = Math.max(720, Math.floor(rect.width || 720)); const dpr = window.devicePixelRatio || 1; canvas.width = width * dpr; canvas.height = height * dpr; canvas.style.width = `${width}px`; canvas.style.height = `${height}px`; const ctx = canvas.getContext('2d'); ctx.setTransform(dpr,0,0,dpr,0,0); ctx.clearRect(0,0,width,height); return {ctx,width,height}; } function drawEmptyChart(canvas, height=340) { if (!canvas) return; const {ctx,width} = prepareCanvas(canvas,height); ctx.fillStyle = cssColor('--muted','#888'); ctx.font = '13px system-ui'; ctx.textAlign='center'; ctx.fillText(tr('history.noData'), width/2, height/2); } function drawLineChart(canvas, series, rows, {height=340, minValue=null, maxValue=null, binaryLabels=false}={}) { if (!canvas || !rows.length || !series.length) return drawEmptyChart(canvas, height); const sortedRows = [...rows].sort((a,b)=>new Date(a.timestamp)-new Date(b.timestamp)); const {ctx,width} = prepareCanvas(canvas,height); const text=cssColor('--muted','#888'), grid=cssColor('--grid','#333'); const pad={left:54,right:20,top:20,bottom:42}; const allValues=[]; series.forEach(item => sortedRows.forEach(row => { const value=item.value(row); if(Number.isFinite(value)) allValues.push(value); })); if (!allValues.length) return drawEmptyChart(canvas,height); let min = minValue == null ? Math.floor(Math.min(...allValues)-1) : minValue; let max = maxValue == null ? Math.ceil(Math.max(...allValues)+1) : maxValue; if (max-min < 2) { min-=1; max+=1; } const firstTs = new Date(sortedRows[0].timestamp).getTime(); const lastTs = new Date(sortedRows[sortedRows.length-1].timestamp).getTime(); const span = Math.max(1,lastTs-firstTs); const x = row => pad.left + (new Date(row.timestamp).getTime()-firstTs)/span*(width-pad.left-pad.right); const y = value => pad.top + (max-value)/(max-min)*(height-pad.top-pad.bottom); ctx.font='10px system-ui'; ctx.fillStyle=text; ctx.strokeStyle=grid; ctx.lineWidth=1; for(let i=0;i<=5;i++){ const value=min+(max-min)*i/5, py=y(value); ctx.beginPath();ctx.moveTo(pad.left,py);ctx.lineTo(width-pad.right,py);ctx.stroke(); ctx.textAlign='right'; ctx.fillText(binaryLabels ? value.toFixed(0) : `${value.toFixed(1)}°`,pad.left-8,py+3); } const ticks=5; for(let i=0;i<=ticks;i++){ const idx=Math.min(sortedRows.length-1,Math.round(i*(sortedRows.length-1)/ticks)); const px=x(sortedRows[idx]); ctx.textAlign='center'; ctx.fillText(timeLabel(sortedRows[idx].timestamp,$('#historyHours')?.value),px,height-14); } series.forEach(item => { ctx.beginPath(); ctx.strokeStyle=item.color; ctx.lineWidth=item.width||2; ctx.setLineDash(item.dash||[]); let started=false, prev=null; sortedRows.forEach(row => { const value=item.value(row); if(!Number.isFinite(value)) return; const px=x(row),py=y(value); if(!started||prev===null){ctx.moveTo(px,py);started=true;} else if(item.step){ctx.lineTo(px,y(prev));ctx.lineTo(px,py);} else ctx.lineTo(px,py); prev=value; }); ctx.stroke(); ctx.setLineDash([]); }); } function renderLegend(host, series) { if (!host) return; host.innerHTML=series.map(item=>`${esc(item.label)}`).join(''); } function historyChartMarkup(id, title, hint, compact=false) { return `

    ${esc(title)}

    ${esc(hint || '')}

    `; } function historySeriesColor(index) { return cssColor(HISTORY_COLORS[index % HISTORY_COLORS.length], `hsl(${(index*67)%360} 68% 55%)`); } function renderHistorySummary() { const host=$('#historySummary'); if(!host) return; const deviceRows=app.historyData.devices, zoneRows=app.historyData.zones, sensorRows=app.historyData.sensors; const cards=[ [tr('history.deviceSamples'), app.historyCounts.devices ?? deviceRows.length, tr('history.greeHistory')], [tr('history.zoneSamples'), app.historyCounts.zones ?? zoneRows.length, tr('history.zoneHistory')], [tr('history.haSamples'), app.historyCounts.ha ?? sensorRows.length, tr('history.haHistory')], ]; host.innerHTML=cards.map(([label,value,detail])=>`
    ${esc(label)}${esc(value)}${esc(detail)}
    `).join(''); } function renderOverviewHistory() { const host=$('#historyCharts'); host.innerHTML = historyChartMarkup('overviewIndoorChart',tr('history.allGreeIndoor'),tr('history.allGreeIndoorHint')) + historyChartMarkup('overviewOutdoorChart',tr('history.allOutdoor'),tr('history.allOutdoorHint')) + historyChartMarkup('overviewZonesChart',tr('history.allZoneControl'),tr('history.allZoneControlHint')); const deviceRows=app.historyData.devices; const indoorSeries=app.devices.map((device,index)=>({label:device.name,color:historySeriesColor(index),value:row=>!row.zone_id&&!row.entity_id&&row.device_id===device.id?historyNumber(row.indoor_temperature):NaN})); drawLineChart($('#overviewIndoorChart'),indoorSeries,deviceRows,{height:360}); renderLegend($('#overviewIndoorChartLegend'),indoorSeries); const outdoorDeviceSeries=app.devices.filter(device=>deviceRows.some(row=>row.device_id===device.id&&Number.isFinite(historyNumber(row.outdoor_temperature)))).map((device,index)=>({label:`${device.name} · ${tr('history.greeOutdoor')}`,color:historySeriesColor(index),value:row=>!row.zone_id&&!row.entity_id&&row.device_id===device.id?historyNumber(row.outdoor_temperature):NaN})); const outdoorEntities=[...new Set(app.historyData.sensors.filter(row=>row.kind==='outdoor').map(row=>row.entity_id))]; const outdoorHaSeries=outdoorEntities.map((entity,index)=>({label:`HA · ${entity}`,color:historySeriesColor(index+outdoorDeviceSeries.length),dash:[6,4],value:row=>row.entity_id===entity?historyNumber(row.temperature):NaN})); const outdoorRows=[...deviceRows,...app.historyData.sensors.filter(row=>row.kind==='outdoor')]; const outdoorSeries=[...outdoorDeviceSeries,...outdoorHaSeries]; drawLineChart($('#overviewOutdoorChart'),outdoorSeries,outdoorRows,{height:320}); renderLegend($('#overviewOutdoorChartLegend'),outdoorSeries); const zoneRows=app.historyData.zones; const zoneSeries=app.zones.map((zone,index)=>({label:zone.name,color:historySeriesColor(index),value:row=>row.zone_id===zone.id?historyNumber(row.control_temperature):NaN})); drawLineChart($('#overviewZonesChart'),zoneSeries,zoneRows,{height:340}); renderLegend($('#overviewZonesChartLegend'),zoneSeries); } function renderZoneHistory() { const selected=app.historyZone; const rows=selected==='all'?app.historyData.zones:app.historyData.zones.filter(row=>row.zone_id===selected); const host=$('#historyCharts'); host.innerHTML=historyChartMarkup('zoneTemperatureChart',tr('history.temperatureOverview'),tr('history.temperatureOverviewHint'))+historyChartMarkup('zoneOperationChart',tr('history.operationOverview'),tr('history.operationOverviewHint'),true); if(selected==='all'){ const series=app.zones.map((zone,index)=>({label:zone.name,color:historySeriesColor(index),value:row=>row.zone_id===zone.id?historyNumber(row.control_temperature):NaN})); drawLineChart($('#zoneTemperatureChart'),series,rows,{height:360}); renderLegend($('#zoneTemperatureChartLegend'),series); const targets=app.zones.map((zone,index)=>({label:`${zone.name} · ${tr('history.targetShort')}`,color:historySeriesColor(index),dash:[5,4],value:row=>row.zone_id===zone.id?historyNumber(row.target_temperature):NaN})); drawLineChart($('#zoneOperationChart'),targets,rows,{height:260}); renderLegend($('#zoneOperationChartLegend'),targets); return; } const temperatureSeries=[ {label:tr('history.greeSensor'),color:cssColor('--accent','#3ecf8e'),value:row=>historyNumber(row.gree_temperature)}, {label:tr('history.roomSensor'),color:cssColor('--info','#60a5fa'),value:row=>historyNumber(row.external_temperature)}, {label:tr('history.controlTemperature'),color:cssColor('--teal','#2dd4bf'),width:2.8,value:row=>historyNumber(row.control_temperature)}, {label:tr('history.comfortTarget'),color:cssColor('--warning','#f59e0b'),dash:[7,5],value:row=>historyNumber(row.target_temperature)}, {label:tr('history.deviceSetpoint'),color:cssColor('--purple','#a78bfa'),dash:[3,4],value:row=>historyNumber(row.device_setpoint)}, {label:tr('history.outdoorTemperature'),color:cssColor('--muted-strong','#9ca3af'),dash:[2,5],value:row=>historyNumber(row.outdoor_temperature)}, ]; drawLineChart($('#zoneTemperatureChart'),temperatureSeries,rows,{height:360}); renderLegend($('#zoneTemperatureChartLegend'),temperatureSeries); const operationSeries=[ {label:tr('history.fanSpeed'),color:cssColor('--info','#60a5fa'),step:true,value:row=>historyNumber(row.fan_speed)}, {label:tr('history.demand'),color:cssColor('--accent','#3ecf8e'),step:true,width:2.4,value:row=>row.demand?4.5:0.5}, {label:tr('history.power'),color:cssColor('--warning','#f59e0b'),step:true,dash:[5,4],value:row=>row.power?3.5:0.5}, ]; drawLineChart($('#zoneOperationChart'),operationSeries,rows,{height:260,minValue:0,maxValue:5,binaryLabels:true}); renderLegend($('#zoneOperationChartLegend'),operationSeries); } function renderDeviceHistory() { const selected=app.historyDevice; const rows=selected==='all'?app.historyData.devices:app.historyData.devices.filter(row=>row.device_id===selected); const host=$('#historyCharts'); host.innerHTML=historyChartMarkup('deviceIndoorChart',tr('history.deviceIndoor'),tr('history.deviceIndoorHint'))+historyChartMarkup('deviceOutdoorChart',tr('history.deviceOutdoor'),tr('history.deviceOutdoorHint'))+historyChartMarkup('deviceTargetChart',tr('history.deviceTargets'),tr('history.deviceTargetsHint'),true); const devices=selected==='all'?app.devices:app.devices.filter(device=>device.id===selected); const indoor=devices.map((device,index)=>({label:device.name,color:historySeriesColor(index),value:row=>row.device_id===device.id?historyNumber(row.indoor_temperature):NaN})); const outdoor=devices.filter(device=>rows.some(row=>row.device_id===device.id&&Number.isFinite(historyNumber(row.outdoor_temperature)))).map((device,index)=>({label:device.name,color:historySeriesColor(index),value:row=>row.device_id===device.id?historyNumber(row.outdoor_temperature):NaN})); const targets=devices.map((device,index)=>({label:device.name,color:historySeriesColor(index),dash:[6,4],value:row=>row.device_id===device.id?historyNumber(row.target_temperature):NaN})); drawLineChart($('#deviceIndoorChart'),indoor,rows,{height:350}); renderLegend($('#deviceIndoorChartLegend'),indoor); drawLineChart($('#deviceOutdoorChart'),outdoor,rows,{height:310}); renderLegend($('#deviceOutdoorChartLegend'),outdoor); drawLineChart($('#deviceTargetChart'),targets,rows,{height:260}); renderLegend($('#deviceTargetChartLegend'),targets); } function renderSensorHistory() { const selected=app.historySensor; const rows=selected==='all'?app.historyData.sensors:app.historyData.sensors.filter(row=>row.entity_id===selected); const entities=[...new Set(rows.map(row=>row.entity_id))]; const host=$('#historyCharts'); host.innerHTML=historyChartMarkup('haSensorsChart',tr('history.haSensors'),tr('history.haSensorsHint')); const series=entities.map((entity,index)=>({label:entity,color:historySeriesColor(index),dash:rows.some(row=>row.entity_id===entity&&row.kind==='outdoor')?[6,4]:[],value:row=>row.entity_id===entity?historyNumber(row.temperature):NaN})); drawLineChart($('#haSensorsChart'),series,rows,{height:370}); renderLegend($('#haSensorsChartLegend'),series); } function customSeriesOptions() { const items=[]; app.devices.forEach(device=>{ items.push([`device|${device.id}|indoor`,`${device.name} · ${tr('history.indoorTemperature')}`]); items.push([`device|${device.id}|outdoor`,`${device.name} · ${tr('history.greeOutdoor')}`]); items.push([`device|${device.id}|target`,`${device.name} · ${tr('history.deviceTarget')}`]); }); app.zones.forEach(zone=>{ items.push([`zone|${zone.id}|control`,`${zone.name} · ${tr('history.controlTemperature')}`]); items.push([`zone|${zone.id}|gree`,`${zone.name} · ${tr('history.greeSensor')}`]); items.push([`zone|${zone.id}|external`,`${zone.name} · ${tr('history.roomSensor')}`]); items.push([`zone|${zone.id}|target`,`${zone.name} · ${tr('history.comfortTarget')}`]); items.push([`zone|${zone.id}|device_target`,`${zone.name} · ${tr('history.deviceSetpoint')}`]); items.push([`zone|${zone.id}|outdoor`,`${zone.name} · ${tr('history.outdoorTemperature')}`]); }); [...new Set(app.historyData.sensors.map(row=>row.entity_id))].forEach(entity=>items.push([`ha|${entity}|temperature`,`HA · ${entity}`])); return items; } function customSeriesDefinition(key,index=0) { const [kind,id,field]=String(key).split('|'); const color=historySeriesColor(index); if(kind==='device'){ const device=app.devices.find(item=>item.id===id); if(!device) return null; const labels={indoor:tr('history.indoorTemperature'),outdoor:tr('history.greeOutdoor'),target:tr('history.deviceTarget')}; const fields={indoor:'indoor_temperature',outdoor:'outdoor_temperature',target:'target_temperature'}; return {key,label:`${device.name} · ${labels[field]||field}`,color,dash:field==='target'?[6,4]:[],value:row=>!row.zone_id&&!row.entity_id&&row.device_id===id?historyNumber(row[fields[field]]):NaN}; } if(kind==='zone'){ const zone=app.zones.find(item=>item.id===id); if(!zone) return null; const fields={control:['control_temperature',tr('history.controlTemperature')],gree:['gree_temperature',tr('history.greeSensor')],external:['external_temperature',tr('history.roomSensor')],target:['target_temperature',tr('history.comfortTarget')],device_target:['device_setpoint',tr('history.deviceSetpoint')],outdoor:['outdoor_temperature',tr('history.outdoorTemperature')]}; const info=fields[field]; if(!info) return null; return {key,label:`${zone.name} · ${info[1]}`,color,dash:['target','device_target','outdoor'].includes(field)?[6,4]:[],value:row=>row.zone_id===id?historyNumber(row[info[0]]):NaN}; } if(kind==='ha') return {key,label:`HA · ${id}`,color,dash:[3,4],value:row=>row.entity_id===id?historyNumber(row.temperature):NaN}; return null; } function persistSavedCharts() { localStorage.setItem('gree_controller_saved_charts',JSON.stringify(app.savedCharts.slice(0,30))); } function renderCustomBuilder() { const host=$('#historyCustomBuilder'); if(!host) return; if(app.historyTab!=='custom'){host.innerHTML='';host.classList.remove('active');return;} host.classList.add('active'); const options=customSeriesOptions(); const selected=app.customChartSeries.map((key,index)=>customSeriesDefinition(key,index)).filter(Boolean); host.innerHTML=`

    ${esc(tr('history.customTitle'))}

    ${esc(tr('history.customDescription'))}

    ${selected.length?selected.map((item,index)=>`${esc(item.label)}`).join(''):`${esc(tr('history.noCustomSeries'))}`}
    ${app.savedCharts.length?app.savedCharts.map(item=>`
    `).join(''):`${esc(tr('history.noSavedCharts'))}`}
    `; } function renderCustomHistory() { renderCustomBuilder(); const host=$('#historyCharts'); host.innerHTML=historyChartMarkup('customHistoryChart',tr('history.customChart'),tr('history.customChartHint')); const series=app.customChartSeries.map((key,index)=>customSeriesDefinition(key,index)).filter(Boolean); const rows=[...app.historyData.devices,...app.historyData.zones,...app.historyData.sensors]; drawLineChart($('#customHistoryChart'),series,rows,{height:390}); renderLegend($('#customHistoryChartLegend'),series); } function renderHistoryPage() { renderHistorySummary(); renderCustomBuilder(); if(app.historyTab==='overview') renderOverviewHistory(); else if(app.historyTab==='zones') renderZoneHistory(); else if(app.historyTab==='devices') renderDeviceHistory(); else if(app.historyTab==='sensors') renderSensorHistory(); else renderCustomHistory(); } function drawCurrentChartIfVisible() { if (app.currentView === 'history') renderHistoryPage(); } async function handleHistoryAction(button) { const action=button.dataset.historyAction; if(action==='add-series'){ const value=$('#customSeriesSelect')?.value; if(value && !app.customChartSeries.includes(value)) app.customChartSeries.push(value); renderCustomHistory(); updateBrowserUrl(currentHistoryPath(), true); return; } if(action==='remove-series'){ app.customChartSeries.splice(Number(button.dataset.index),1); renderCustomHistory(); updateBrowserUrl(currentHistoryPath(), true); return; } if(action==='save-chart'){ if(!app.customChartSeries.length) return toast(tr('history.noCustomSeries'), true); const name=$('#customChartName')?.value.trim() || tr('history.customChart'); const item={id:`chart-${Date.now()}`,name,series:[...app.customChartSeries],hours:$('#historyHours')?.value||'24'}; app.savedCharts.unshift(item); persistSavedCharts(); renderCustomHistory(); toast(tr('history.chartSaved')); return; } if(action==='load-chart'){ const item=app.savedCharts.find(entry=>entry.id===button.dataset.id); if(!item) return; app.customChartSeries=[...item.series]; if($('#historyHours')&&item.hours) $('#historyHours').value=String(item.hours); renderCustomHistory(); updateBrowserUrl(currentHistoryPath()); return; } if(action==='delete-chart'){ app.savedCharts=app.savedCharts.filter(entry=>entry.id!==button.dataset.id); persistSavedCharts(); renderCustomHistory(); return; } if(action==='copy-chart-link'){ if(!app.customChartSeries.length) return toast(tr('history.noCustomSeries'), true); const path=currentHistoryPath(); updateBrowserUrl(path, true); const link=`${location.origin}${path}`; try { await navigator.clipboard.writeText(link); } catch (_) { const area=document.createElement('textarea'); area.value=link; document.body.appendChild(area); area.select(); document.execCommand('copy'); area.remove(); } toast(tr('history.linkCopied')); return; } } async function loadLogs() { try { const data = await api('/api/events?limit=150'); const logs = data.events || []; $('#logList').innerHTML = logs.length ? logs.map(item => `
    ${esc(item.kind)}${esc(item.message)}
    `).join('') : `
    ${esc(tr('logs.emptyTitle'))}${esc(tr('logs.emptyText'))}
    `; } catch (error) { toast(error.message, true); } } function connectWebSocket() { if (app.ws && [WebSocket.OPEN, WebSocket.CONNECTING].includes(app.ws.readyState)) return; clearTimeout(app.wsTimer); const protocol = location.protocol === 'https:' ? 'wss:' : 'ws:'; const query = app.token ? `?token=${encodeURIComponent(app.token)}` : ''; const ws = new WebSocket(`${protocol}//${location.host}/ws${query}`); app.ws = ws; ws.onopen = () => { app.connectionStatus = 'connected'; $('#connectionLabel').textContent = tr('status.connected'); }; ws.onclose = () => { app.connectionStatus = 'disconnected'; $('#connectionLabel').textContent = tr('status.disconnected'); app.wsTimer = setTimeout(connectWebSocket, 3000); }; ws.onerror = () => { app.connectionStatus = 'connectionError'; $('#connectionLabel').textContent = tr('status.connectionError'); }; ws.onmessage = event => { try { const message = JSON.parse(event.data); if (message.event === 'bootstrap') { const data=message.data; app.devices=data.devices||[]; app.zones=data.zones||[]; app.schedules=data.schedules||[]; app.automations=data.automations||[]; app.settings=data.settings||app.settings; app.system=data.system||app.system; app.outdoorTemperature=Number.isFinite(Number(data.outdoor_temperature))?Number(data.outdoor_temperature):app.outdoorTemperature; renderAll(); scheduleControlPlanLoad(); if(app.settings?.debug?.overlay_enabled) loadDebugBacklog(); return; } const data = message.data || {}; if (['device.updated','device.created'].includes(message.event)) { updateDevice(data); renderSummary(); renderDevices(); scheduleControlPlanLoad(); } else if (message.event === 'device.deleted') { app.devices=app.devices.filter(v=>v.id!==data.id); renderAll(); scheduleControlPlanLoad(); } else if (message.event === 'devices.discovered') { (data.devices||[]).forEach(updateDevice); renderAll(); scheduleControlPlanLoad(); } else if (message.event === 'zone.updated') { const i=app.zones.findIndex(v=>v.id===data.id); if(i>=0) app.zones[i]=data; else app.zones.push(data); renderSummary(); renderHouseClimate(); renderZones(); scheduleControlPlanLoad(); } else if (message.event === 'settings.updated') { app.settings=data; renderSettings(); renderHouseClimate(); renderDebugOverlay(); if(app.settings?.debug?.overlay_enabled) loadDebugBacklog(); scheduleControlPlanLoad(); } else if (message.event === 'debug.settings') { app.settings = app.settings || {}; app.settings.debug = data; renderSettings(); renderDebugOverlay(); if(data.overlay_enabled) loadDebugBacklog(); } else if (message.event === 'outdoor.updated') { app.outdoorTemperature=Number.isFinite(Number(data.temperature))?Number(data.temperature):null; renderHouseClimate(); scheduleControlPlanLoad(); } else if (message.event === 'gree.frame') { if(app.settings?.debug?.overlay_enabled) debugLine('GREE', `${data.direction || '?'} ${data.protocol_version || ''}`, data.device_name || data.device_id || data.target || '', message.timestamp, data.payload); } else if (message.event === 'api.request') { if(app.settings?.debug?.overlay_enabled) debugLine('HTTP', `${data.method || '?'} ${data.status || ''}`, `${data.path || ''} · ${data.duration_ms ?? '?'} ms`, message.timestamp); } else if (message.event === 'log.created') { if(app.settings?.debug?.overlay_enabled) debugLine('API', data.kind || data.level || 'log', data.message || '', message.timestamp, data.metadata); if(app.currentView === 'logs') loadLogs(); } else if (message.event.startsWith('schedule.') || message.event.startsWith('automation.')) scheduleControlPlanLoad(); } catch (_) {} }; } document.addEventListener('click', async event => { const button = event.target.closest('button'); if (!button) return; if (button.dataset.nav) { if (button.dataset.nav === 'more') openDialog('moreDialog'); else showView(button.dataset.nav); return; } if (button.dataset.go) { $('#moreDialog').close(); showView(button.dataset.go); return; } if (button.dataset.open) { const form = document.getElementById(button.dataset.open.replace('Dialog','Form')); if (form) form.reset(); if (button.dataset.open === 'zoneDialog') updateZoneSensorFields(); if (button.dataset.open === 'scheduleDialog') updateSchedulePresetField(); openDialog(button.dataset.open); return; } if (button.hasAttribute('data-close')) { button.closest('dialog')?.close(); return; } if (button.dataset.historyTab) { showHistoryTab(button.dataset.historyTab); return; } if (button.dataset.historyAction) { await handleHistoryAction(button); return; } if (button.dataset.scheduleTemplate) { const zoneId = $('#schedulePresetZone')?.value; if (!zoneId) return toast(tr('schedules.chooseZone'), true); if (!confirm(tr('schedules.replaceConfirm'))) return; try { button.disabled = true; await api(`/api/zones/${encodeURIComponent(zoneId)}/schedule-template`, {method:'POST', body:{template:button.dataset.scheduleTemplate}}); await loadBootstrap(); toast(tr('schedules.templateApplied')); } catch (error) { toast(error.message, true); } finally { button.disabled = false; } return; } const action = button.dataset.action; if (!action) return; const device = app.devices.find(v => v.id === button.dataset.device); if (action === 'power' && device) return sendDeviceCommand(device.id, {power:!device.power}); if (action === 'temperature' && device) return sendDeviceCommand(device.id, {target_temperature:clamp(Number(device.target_temperature)+Number(button.dataset.delta),8,30)}); if (action === 'mode' && device) return sendDeviceCommand(device.id, {mode:button.dataset.value, power:true}); if (action === 'fan' && device) return sendDeviceCommand(device.id, {fan_speed:Number(button.dataset.value)}); if (action === 'toggle' && device) return sendDeviceCommand(device.id, {[button.dataset.field]:!device[button.dataset.field]}); if (action === 'poll' && device) { try { button.disabled=true; updateDevice(await api(`/api/devices/${encodeURIComponent(device.id)}/poll`,{method:'POST'})); renderAll(); toast(tr('devices.readDone')); } catch(e){toast(e.message,true);} finally{button.disabled=false;} return; } if (action === 'bind' && device) { try { button.disabled=true; updateDevice(await api(`/api/devices/${encodeURIComponent(device.id)}/bind`,{method:'POST'})); renderAll(); toast(tr('devices.bound')); } catch(e){toast(e.message,true);} finally{button.disabled=false;} return; } if (action === 'rename-device' && device) return populateDeviceRename(device.id); if (action === 'delete-device') return deleteEntity('devices', button.dataset.device, 'label.device'); if (action === 'house-mode') { try { app.settings = await api('/api/house/control',{method:'POST',body:{mode:button.dataset.value}}); renderHouseClimate(); scheduleControlPlanLoad(); toast(tr('house.modeUpdated')); } catch(error){ toast(error.message,true); } return; } if (action === 'house-preset') { try { const result=await api('/api/house/preset',{method:'POST',body:{preset:button.dataset.value}}); app.zones=result.zones||app.zones; renderZones(); scheduleControlPlanLoad(); toast(tr('house.presetUpdated')); } catch(error){ toast(error.message,true); } return; } if (action === 'zone-temperature') { const zone=app.zones.find(v=>v.id===button.dataset.id); if(zone) { const base=Number(zone.manual_setpoint ?? zone.effective_setpoint ?? zone.setpoint); queueZoneTemperature(zone, base+Number(button.dataset.delta)); } return; } if (action === 'zone-mode') return sendZoneControl(button.dataset.id,{mode:button.dataset.value}); if (action === 'zone-preset') return sendZoneControl(button.dataset.id,{preset:button.dataset.value}); if (action === 'zone-enabled') return sendZoneControl(button.dataset.id,{enabled:button.dataset.value==='true'}); if (action === 'debug-clear') { app.debugLines = []; renderDebugOverlay(); return; } if (action === 'edit-zone') return populateZone(button.dataset.id); if (action === 'delete-zone') return deleteEntity('zones', button.dataset.id, 'label.zone'); if (action === 'edit-schedule') return populateSchedule(button.dataset.id); if (action === 'delete-schedule') return deleteEntity('schedules', button.dataset.id, 'label.schedule'); if (action === 'edit-automation') return populateAutomation(button.dataset.id); if (action === 'delete-automation') return deleteEntity('automations', button.dataset.id, 'label.automation'); if (action === 'revoke-access-token') { if (!confirm(tr('confirm.revokeToken'))) return; try { await api(`/api/access-tokens/${encodeURIComponent(button.dataset.id)}`, {method:'DELETE'}); app.accessTokens = app.accessTokens.filter(item => item.id !== button.dataset.id); renderAccessTokens(); toast(tr('toast.tokenRevoked')); } catch (error) { toast(error.message, true); } return; } }); $('#refreshButton').addEventListener('click', () => loadBootstrap(true)); $('#discoverButton').addEventListener('click', () => { const form=$('#discoverForm'); form.reset(); form.protocol_version.value='0'; form.passes.value='3'; form.timeout_ms.value=String(Math.max(6000, Number(app.settings?.discovery_timeout_ms || 3000))); openDialog('discoverDialog'); }); $('#historyRefresh').addEventListener('click', loadHistory); $('#historyHours').addEventListener('change', () => { updateBrowserUrl(currentHistoryPath(), true); loadHistory(); }); $('#logsRefresh').addEventListener('click', loadLogs); $('#languageSelect').addEventListener('change', event => setLanguage(event.target.value)); $('#themeSelect').addEventListener('change', event => setTheme(event.target.value)); $('#zoneForm [name=sensor_source]').addEventListener('change', updateZoneSensorFields); $('#scheduleForm [name=preset]').addEventListener('change', updateSchedulePresetField); $('#tokenForm').addEventListener('submit', event => { event.preventDefault(); app.token = new FormData(event.currentTarget).get('token').trim(); localStorage.setItem('gree_controller_token', app.token); if (app.ws) app.ws.close(); loadBootstrap(); }); $('#discoverForm').addEventListener('submit', async event => { event.preventDefault(); const form=event.currentTarget, raw=Object.fromEntries(new FormData(form)); const submit=form.querySelector('button[type=submit]'); submit.disabled=true; submit.textContent=tr('actions.discovering'); try { const result=await api('/api/discovery',{method:'POST',body:{protocol_version:Number(raw.protocol_version),passes:Number(raw.passes),timeout_ms:Number(raw.timeout_ms)}}); form.closest('dialog').close(); await loadBootstrap(); toast(tr('toast.found',{count:result.count})); showDiscoveryNames(result.new_device_ids || []); } catch(error){toast(error.message,true);} finally {submit.disabled=false;submit.textContent=tr('actions.discover');} }); $('#discoveryNamesForm').addEventListener('submit', async event => { event.preventDefault(); const form = event.currentTarget; const inputs = $$('input[data-device-id]', form); try { const updated = await Promise.all(inputs.map(input => api(`/api/devices/${encodeURIComponent(input.dataset.deviceId)}`, {method:'PATCH', body:{name:input.value.trim()}}))); updated.forEach(updateDevice); form.closest('dialog').close(); renderAll(); toast(tr('common.saved')); } catch (error) { toast(error.message, true); } }); $('#renameDeviceForm').addEventListener('submit', async event => { event.preventDefault(); const form=event.currentTarget, raw=Object.fromEntries(new FormData(form)); try { const device=await api(`/api/devices/${encodeURIComponent(raw.id)}`,{method:'PATCH',body:{name:raw.name.trim(),protocol_version:Number(raw.protocol_version)}}); updateDevice(device); form.closest('dialog').close(); renderAll(); toast(tr('common.saved')); } catch(error){toast(error.message,true);} }); $('#deviceForm').addEventListener('submit', async event => { event.preventDefault(); const form=event.currentTarget, data=Object.fromEntries(new FormData(form)); data.port=Number(data.port); data.protocol_version=Number(data.protocol_version); data.simulated=form.simulated.checked; try { await api('/api/devices',{method:'POST',body:data}); form.closest('dialog').close(); form.reset(); await loadBootstrap(); toast(tr('devices.added')); } catch(error){toast(error.message,true);} }); $('#zoneForm').addEventListener('submit', async event => { event.preventDefault(); const form=event.currentTarget, raw=Object.fromEntries(new FormData(form)); const id=raw.id; const body={ name:raw.name,device_id:raw.device_id,enabled:form.enabled.checked, mode:raw.mode_policy==='house'?'cool':raw.mode_policy,inherit_house_mode:raw.mode_policy==='house',setpoint:Number(raw.setpoint), cool_comfort_setpoint:Number(raw.cool_comfort_setpoint),cool_sleep_setpoint:Number(raw.cool_sleep_setpoint),cool_away_setpoint:Number(raw.cool_away_setpoint), heat_comfort_setpoint:Number(raw.heat_comfort_setpoint),heat_sleep_setpoint:Number(raw.heat_sleep_setpoint),heat_away_setpoint:Number(raw.heat_away_setpoint), hysteresis:Number(raw.hysteresis),min_on_seconds:Number(raw.min_on_seconds),min_off_seconds:Number(raw.min_off_seconds), min_adjust_seconds:Number(raw.min_adjust_seconds),standby_offset_c:Number(raw.standby_offset_c),smart_fan:form.smart_fan.checked, sensor_source:raw.sensor_source,ha_entity_id:raw.ha_entity_id||null,external_sensor_weight:Number(raw.external_sensor_weight_percent)/100,max_sensor_difference:Number(raw.max_sensor_difference) }; try { await api(id?`/api/zones/${encodeURIComponent(id)}`:'/api/zones',{method:id?'PUT':'POST',body}); form.closest('dialog').close(); form.reset(); await loadBootstrap(); toast(tr('common.saved')); } catch(error){toast(error.message,true);} }); $('#scheduleForm').addEventListener('submit', async event => { event.preventDefault(); const form=event.currentTarget, raw=Object.fromEntries(new FormData(form)); const id=raw.id, weekdays=$$('[name=weekday]:checked',form).map(v=>Number(v.value)); const body={name:raw.name,zone_id:raw.zone_id,enabled:form.enabled.checked,weekdays,start_time:raw.start_time,end_time:raw.end_time,preset:raw.preset,setpoint:Number(raw.setpoint||23)}; try { await api(id?`/api/schedules/${encodeURIComponent(id)}`:'/api/schedules',{method:id?'PUT':'POST',body}); form.closest('dialog').close(); form.reset(); await loadBootstrap(); toast(tr('common.saved')); } catch(error){toast(error.message,true);} }); $('#automationForm').addEventListener('submit', async event => { event.preventDefault(); const form=event.currentTarget, raw=Object.fromEntries(new FormData(form)); const id=raw.id; const action={}; if(raw.action_power!=='') action.power=raw.action_power==='true'; if(raw.action_mode) action.mode=raw.action_mode; if(raw.action_target_temperature!=='') action.target_temperature=Number(raw.action_target_temperature); const body={name:raw.name,enabled:form.enabled.checked,trigger_kind:raw.trigger_kind,trigger_device_id:raw.trigger_device_id||null,threshold:raw.threshold===''?null:Number(raw.threshold),at_time:raw.at_time||null,action_device_id:raw.action_device_id,action,cooldown_seconds:Number(raw.cooldown_seconds)}; try { await api(id?`/api/automations/${encodeURIComponent(id)}`:'/api/automations',{method:id?'PUT':'POST',body}); form.closest('dialog').close(); form.reset(); await loadBootstrap(); toast(tr('common.saved')); } catch(error){toast(error.message,true);} }); function settingsBodyFromForm(form) { const raw=Object.fromEntries(new FormData(form)); return { controller_id:raw.controller_id, simulator_enabled:form.simulator_enabled.checked, poll_interval_seconds:Number(raw.poll_interval_seconds), zone_interval_seconds:Number(raw.zone_interval_seconds), discovery_timeout_ms:Number(raw.discovery_timeout_ms), discovery_broadcast:raw.discovery_broadcast, house_mode:app.settings?.house_mode||'cool', control_strategy:'setpoint', outdoor_assist_enabled:form.outdoor_assist_enabled.checked, history_retention_days:Number(raw.history_retention_days), history_compaction_enabled:form.history_compaction_enabled.checked, suppress_device_beep:form.suppress_device_beep.checked, influxdb:{ enabled:form.influx_enabled.checked, version:raw.influx_version, url:raw.influx_url, database:raw.influx_database, username:raw.influx_username, password:raw.influx_password, org:raw.influx_org, bucket:raw.influx_bucket, token:raw.influx_token, history_threshold_days:Number(raw.influx_threshold_days), }, debug:{overlay_enabled:form.debug_overlay_enabled.checked, gree_frames:form.debug_gree_frames.checked}, home_assistant:{url:raw.ha_url,token:raw.ha_token,default_entity_id:raw.ha_entity_id,outdoor_entity_id:raw.ha_outdoor_entity_id,allow_invalid_tls:form.ha_allow_invalid_tls.checked}, }; } async function saveSettingsForm(form, notify=true) { app.settings=await api('/api/settings',{method:'PUT',body:settingsBodyFromForm(form)}); renderSettings(); renderHouseClimate(); renderDebugOverlay(); scheduleControlPlanLoad(); if(app.settings?.debug?.overlay_enabled) loadDebugBacklog(); if(notify) toast(tr('common.saved')); return app.settings; } $('#settingsForm').addEventListener('submit', async event => { event.preventDefault(); try { await saveSettingsForm(event.currentTarget, true); } catch(error){toast(error.message,true);} }); $('#createAccessToken').addEventListener('click', async event => { const button = event.currentTarget; button.disabled = true; try { const result = await api('/api/access-tokens', {method:'POST', body:{name:'Home Assistant'}}); if (result.item) app.accessTokens.unshift(result.item); renderAccessTokens(); $('#generatedAccessToken').value = result.token || ''; openDialog('generatedTokenDialog'); toast(tr('toast.tokenCreated')); } catch (error) { toast(error.message, true); } finally { button.disabled = false; } }); $('#copyAccessToken').addEventListener('click', async () => { const input = $('#generatedAccessToken'); try { await navigator.clipboard.writeText(input.value); toast(tr('toast.tokenCopied')); } catch (_) { input.select(); document.execCommand('copy'); toast(tr('toast.tokenCopied')); } }); $('#haTest').addEventListener('click', async () => { const form=$('#settingsForm'); try { await saveSettingsForm(form, false); const entity = form.ha_entity_id.value || form.ha_outdoor_entity_id.value || null; const result=await api('/api/integrations/home-assistant/test',{method:'POST',body:{entity_id:entity}}); toast(tr('toast.haTemperature',{temperature:result.temperature_c.toFixed(1)})); } catch(error){toast(error.message,true);} }); $('#simulationRefresh')?.addEventListener('click', async () => { try { await loadControlPlan(); toast(tr('common.updated')); } catch (error) { toast(error.message, true); } }); $('#exportSettings').addEventListener('click', async () => { try { const data = await api('/api/settings/export'); const blob = new Blob([JSON.stringify(data, null, 2)], {type:'application/json'}); const link = document.createElement('a'); link.href = URL.createObjectURL(blob); link.download = `gree-controller-settings-${new Date().toISOString().slice(0,10)}.json`; document.body.appendChild(link); link.click(); link.remove(); URL.revokeObjectURL(link.href); toast(tr('toast.exported')); } catch (error) { toast(error.message, true); } }); $('#importSettings').addEventListener('click', () => $('#importSettingsFile').click()); $('#importSettingsFile').addEventListener('change', async event => { const file = event.target.files?.[0]; if (!file) return; try { if (!confirm(tr('settings.importConfirm'))) return; const body = JSON.parse(await file.text()); await api('/api/settings/import', {method:'POST', body}); app.debugBacklogLoaded = false; await loadBootstrap(); toast(tr('toast.imported')); } catch (error) { toast(error.message, true); } finally { event.target.value = ''; } }); document.addEventListener('change', event => { const target=event.target; if(target.id==='historyZoneSelect'){app.historyZone=target.value;updateBrowserUrl(currentHistoryPath());renderHistoryPage();} else if(target.id==='historyDeviceSelect'){app.historyDevice=target.value;updateBrowserUrl(currentHistoryPath());renderHistoryPage();} else if(target.id==='historySensorSelect'){app.historySensor=target.value;updateBrowserUrl(currentHistoryPath());renderHistoryPage();} else if(target.name==='influx_version') updateInfluxFields(); }); window.addEventListener('popstate', applyRouteFromLocation); let historyResizeTimer; window.addEventListener('resize', () => { if (app.currentView === 'history') { clearTimeout(historyResizeTimer); historyResizeTimer=setTimeout(drawCurrentChartIfVisible,120); } }); window.matchMedia('(prefers-color-scheme: light)').addEventListener('change', () => { if (app.theme === 'system') applyTheme(); }); if ('serviceWorker' in navigator) window.addEventListener('load', () => navigator.serviceWorker.register('/sw.js').catch(()=>{})); async function startApplication() { applyTheme(); await loadLanguages(); applyTranslations(); updateZoneSensorFields(); updateSchedulePresetField(); await loadBootstrap(); applyRouteFromLocation(); if (location.pathname === '/') updateBrowserUrl('/dashboard', true); } startApplication().catch(error => console.error('Application startup failed:', error));