chaos/NTP-Timeturner
1
0
Fork 0
mirror of https://github.com/cjfranko/NTP-Timeturner.git synced 2025-11-08 18:32:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: Decouple status icons; use local images via icon-map.js

Browse source 
Co-authored-by: aider (gemini/gemini-2.5-pro) <aider@aider.chat>
This commit is contained in:
Chris Frankland-Wright 2025-08-07 23:11:22 +01:00
parent 80953e7f6d
commit 8b7e832225
3 changed files with 35 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

56
static/script.js
View file

@ -41,72 +41,34 @@ document.addEventListener('DOMContentLoaded', () => {
const dateMessage = document.getElementById('date-message');
function updateStatus(data) {
let ltcStatusIcon = '';
switch (data.ltc_status) {
case 'LOCK':
ltcStatusIcon = '<i class="fa-solid fa-lock"></i>';
break;
case 'FREE':
ltcStatusIcon = '<i class="fa-solid fa-lock-open"></i>';
break;
default:
ltcStatusIcon = '<i class="fa-solid fa-question-circle"></i>';
}
statusElements.ltcStatus.innerHTML = `${ltcStatusIcon} ${data.ltc_status}`;
const ltcIconSrc = iconMap.ltcStatus[data.ltc_status] || iconMap.ltcStatus.default;
statusElements.ltcStatus.innerHTML = `<img src="${ltcIconSrc}" class="status-icon" alt="${data.ltc_status} icon"> ${data.ltc_status}`;
statusElements.ltcTimecode.textContent = data.ltc_timecode;
statusElements.frameRate.textContent = data.frame_rate;
statusElements.lockRatio.textContent = data.lock_ratio.toFixed(2);
statusElements.systemClock.textContent = data.system_clock;
statusElements.systemDate.textContent = data.system_date;
const ntpIconSrc = iconMap.ntpActive[data.ntp_active];
if (data.ntp_active) {
statusElements.ntpActive.innerHTML = '<i class="fa-solid fa-check-circle"></i> Active';
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt="Active icon"> Active`;
statusElements.ntpActive.className = 'active';
} else {
statusElements.ntpActive.innerHTML = '<i class="fa-solid fa-times-circle"></i> Inactive';
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt="Inactive icon"> Inactive`;
statusElements.ntpActive.className = 'inactive';
}
const syncStatusClass = data.sync_status.replace(/\s+/g, '-').toLowerCase();
let syncIcon = '';
switch (data.sync_status) {
case 'IN SYNC':
syncIcon = '<i class="fa-solid fa-arrows-rotate"></i>';
break;
case 'CLOCK AHEAD':
syncIcon = '<i class="fa-solid fa-forward"></i>';
break;
case 'CLOCK BEHIND':
syncIcon = '<i class="fa-solid fa-backward"></i>';
break;
case 'TIMETURNING':
syncIcon = '<i class="fa-solid fa-wand-magic-sparkles"></i>';
break;
default:
syncIcon = '<i class="fa-solid fa-question-circle"></i>';
}
statusElements.syncStatus.innerHTML = `${syncIcon} ${data.sync_status}`;
const syncIconSrc = iconMap.syncStatus[data.sync_status] || iconMap.syncStatus.default;
statusElements.syncStatus.innerHTML = `<img src="${syncIconSrc}" class="status-icon" alt="${data.sync_status} icon"> ${data.sync_status}`;
statusElements.syncStatus.className = syncStatusClass;
statusElements.deltaMs.textContent = data.timecode_delta_ms;
statusElements.deltaFrames.textContent = data.timecode_delta_frames;
const jitterStatusClass = data.jitter_status.toLowerCase();
let jitterIcon = '';
switch (data.jitter_status) {
case 'GOOD':
jitterIcon = '<i class="fa-solid fa-thumbs-up"></i>';
break;
case 'AVERAGE':
jitterIcon = '<i class="fa-solid fa-face-meh"></i>';
break;
case 'BAD':
jitterIcon = '<i class="fa-solid fa-thumbs-down"></i>';
break;
default:
jitterIcon = '<i class="fa-solid fa-question-circle"></i>';
}
statusElements.jitterStatus.innerHTML = `${jitterIcon} ${data.jitter_status}`;
const jitterIconSrc = iconMap.jitterStatus[data.jitter_status] || iconMap.jitterStatus.default;
statusElements.jitterStatus.innerHTML = `<img src="${jitterIconSrc}" class="status-icon" alt="${data.jitter_status} icon"> ${data.jitter_status}`;
statusElements.jitterStatus.className = jitterStatusClass;
statusElements.interfaces.innerHTML = '';