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

refactor: Standardise status element styling and icon alt attributes

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:18:00 +01:00
parent 8b7e832225
commit 8150241db2
2 changed files with 9 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

11
static/script.js
View file

@ -42,7 +42,8 @@ document.addEventListener('DOMContentLoaded', () => {
function updateStatus(data) { function updateStatus(data) {
const ltcIconSrc = iconMap.ltcStatus[data.ltc_status] || iconMap.ltcStatus.default; 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.ltcStatus.innerHTML = `<img src="${ltcIconSrc}" class="status-icon" alt=""> ${data.ltc_status}`;
statusElements.ltcStatus.className = data.ltc_status.toLowerCase();
statusElements.ltcTimecode.textContent = data.ltc_timecode; statusElements.ltcTimecode.textContent = data.ltc_timecode;
statusElements.frameRate.textContent = data.frame_rate; statusElements.frameRate.textContent = data.frame_rate;
statusElements.lockRatio.textContent = data.lock_ratio.toFixed(2); statusElements.lockRatio.textContent = data.lock_ratio.toFixed(2);
@ -51,16 +52,16 @@ document.addEventListener('DOMContentLoaded', () => {
const ntpIconSrc = iconMap.ntpActive[data.ntp_active]; const ntpIconSrc = iconMap.ntpActive[data.ntp_active];
if (data.ntp_active) { if (data.ntp_active) {
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt="Active icon"> Active`; statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt=""> Active`;
statusElements.ntpActive.className = 'active'; statusElements.ntpActive.className = 'active';
} else { } else {
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt="Inactive icon"> Inactive`; statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt=""> Inactive`;
statusElements.ntpActive.className = 'inactive'; statusElements.ntpActive.className = 'inactive';
} }
const syncStatusClass = data.sync_status.replace(/\s+/g, '-').toLowerCase(); const syncStatusClass = data.sync_status.replace(/\s+/g, '-').toLowerCase();
const syncIconSrc = iconMap.syncStatus[data.sync_status] || iconMap.syncStatus.default; 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.innerHTML = `<img src="${syncIconSrc}" class="status-icon" alt=""> ${data.sync_status}`;
statusElements.syncStatus.className = syncStatusClass; statusElements.syncStatus.className = syncStatusClass;
statusElements.deltaMs.textContent = data.timecode_delta_ms; statusElements.deltaMs.textContent = data.timecode_delta_ms;
@ -68,7 +69,7 @@ document.addEventListener('DOMContentLoaded', () => {
const jitterStatusClass = data.jitter_status.toLowerCase(); const jitterStatusClass = data.jitter_status.toLowerCase();
const jitterIconSrc = iconMap.jitterStatus[data.jitter_status] || iconMap.jitterStatus.default; 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.innerHTML = `<img src="${jitterIconSrc}" class="status-icon" alt=""> ${data.jitter_status}`;
statusElements.jitterStatus.className = jitterStatusClass; statusElements.jitterStatus.className = jitterStatusClass;
statusElements.interfaces.innerHTML = ''; statusElements.interfaces.innerHTML = '';

3
static/style.css
View file

@ -95,3 +95,6 @@ button:hover {
#jitter-status.bad { font-weight: bold; color: #dc3545; } #jitter-status.bad { font-weight: bold; color: #dc3545; }
#ntp-active.active { font-weight: bold; color: #28a745; } #ntp-active.active { font-weight: bold; color: #28a745; }
#ntp-active.inactive { font-weight: bold; color: #dc3545; } #ntp-active.inactive { font-weight: bold; color: #dc3545; }
#ltc-status.lock { font-weight: bold; color: #28a745; }
#ltc-status.free { font-weight: bold; color: #ffc107; }