Skip to content

Fix console log toggles drifting out of sync with device state #921

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
IgorYbema merged 1 commit into from
Jul 2, 2026
Merged

Fix console log toggles drifting out of sync with device state #921

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
104 changes: 25 additions & 79 deletions HeishaMon/htmlcode.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1070,101 +1070,47 @@ function buildRow(item,idKey){

static const char consoleTogglesJS[] FLASHPROG = R"====(
<script>
// Session cookie helpers
function setSessionCookie(name, value) {
document.cookie = name + "=" + value + "; path=/; SameSite=Strict";
}

function getSessionCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
}
return null;
// Refresh both console toggles from the live device state.
// The device's runtime flags are the source of truth: they reset on reboot to
// the "from start" settings and are flipped by /togglelog and /togglehexdump.
// Reading /getsettings after every change keeps the switches in sync with the
// device instead of with a (possibly stale) browser-side cache.
function refreshConsoleToggles() {
return fetch('/getsettings')
.then(function(response) { return response.json(); })
.then(function(data) {
var mqttEnabled = (data.logMqtt === 'enabled' || data.logMqtt === 1);
var hexdumpEnabled = (data.logHexdump === 'enabled' || data.logHexdump === 1);
document.getElementById('mqttLogToggle').checked = mqttEnabled;
document.getElementById('hexdumpToggle').checked = hexdumpEnabled;
})
.catch(function(err) {
console.error('Failed to fetch settings:', err);
});
}

// Initialize console toggles from session cookies or fetch from server
function initConsoleToggles() {
var mqttLogState = getSessionCookie('mqttLog');
var hexdumpState = getSessionCookie('hexdump');

if (mqttLogState !== null && hexdumpState !== null) {
// Use cached session state
document.getElementById('mqttLogToggle').checked = (mqttLogState === 'true');
document.getElementById('hexdumpToggle').checked = (hexdumpState === 'true');
} else {
// First visit in session - fetch from server
fetch('/getsettings')
.then(function(response) { return response.json(); })
.then(function(data) {
var mqttEnabled = (data.logMqtt === 'enabled' || data.logMqtt === 1);
var hexdumpEnabled = (data.logHexdump === 'enabled' || data.logHexdump === 1);

document.getElementById('mqttLogToggle').checked = mqttEnabled;
document.getElementById('hexdumpToggle').checked = hexdumpEnabled;

// Store in session cookies
setSessionCookie('mqttLog', mqttEnabled);
setSessionCookie('hexdump', hexdumpEnabled);
})
.catch(function(err) {
console.error('Failed to fetch settings:', err);
});
}
refreshConsoleToggles();
}

// Toggle MQTT log
// Toggle MQTT log, then re-read the device state so the switch reflects the
// actual resulting position (the endpoint flips the flag server-side).
function toggleMqttLog() {
var toggle = document.getElementById('mqttLogToggle');
var enabled = toggle.checked;

// Update session cookie
setSessionCookie('mqttLog', enabled);

// Call server endpoint
fetch('/togglelog')
.then(function(response) {
if (!response.ok) {
console.error('Failed to toggle MQTT log');
// Revert toggle on error
toggle.checked = !enabled;
setSessionCookie('mqttLog', !enabled);
}
})
.then(function() { refreshConsoleToggles(); })
.catch(function(err) {
console.error('Error toggling MQTT log:', err);
// Revert toggle on error
toggle.checked = !enabled;
setSessionCookie('mqttLog', !enabled);
refreshConsoleToggles();
});
}

// Toggle Hexdump log
// Toggle Hexdump log, then re-read the device state (see toggleMqttLog).
function toggleHexdump() {
var toggle = document.getElementById('hexdumpToggle');
var enabled = toggle.checked;

// Update session cookie
setSessionCookie('hexdump', enabled);

// Call server endpoint
fetch('/togglehexdump')
.then(function(response) {
if (!response.ok) {
console.error('Failed to toggle hexdump');
// Revert toggle on error
toggle.checked = !enabled;
setSessionCookie('hexdump', !enabled);
}
})
.then(function() { refreshConsoleToggles(); })
.catch(function(err) {
console.error('Error toggling hexdump:', err);
// Revert toggle on error
toggle.checked = !enabled;
setSessionCookie('hexdump', !enabled);
refreshConsoleToggles();
});
}

Expand Down
Loading