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: Move delta value below icon and add label

Browse source 
Co-authored-by: aider (gemini/gemini-2.5-pro) <aider@aider.chat>
This commit is contained in:
Chris Frankland-Wright 2025-08-08 01:17:38 +01:00
parent 982aad3ec9
commit 02487bda97
3 changed files with 9 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

1
static/index.html
View file

@ -43,6 +43,7 @@
<span id="jitter-status"></span> <span id="jitter-status"></span>
<span id="delta-status"></span> <span id="delta-status"></span>
</div> </div>
<p id="delta-text">Delta Value: -- ms (-- frames)</p>
</div> </div>
<!-- Network Interfaces --> <!-- Network Interfaces -->

7
static/script.js
View file

@ -18,6 +18,7 @@ document.addEventListener('DOMContentLoaded', () => {
syncStatus: document.getElementById('sync-status'), syncStatus: document.getElementById('sync-status'),
deltaStatus: document.getElementById('delta-status'), deltaStatus: document.getElementById('delta-status'),
jitterStatus: document.getElementById('jitter-status'), jitterStatus: document.getElementById('jitter-status'),
deltaText: document.getElementById('delta-text'),
interfaces: document.getElementById('interfaces'), interfaces: document.getElementById('interfaces'),
logs: document.getElementById('logs'), logs: document.getElementById('logs'),
}; };
@ -134,8 +135,10 @@ document.addEventListener('DOMContentLoaded', () => {
deltaCategory = 'bad'; deltaCategory = 'bad';
} }
const deltaIconInfo = iconMap.deltaStatus[deltaCategory]; const deltaIconInfo = iconMap.deltaStatus[deltaCategory];
const deltaText = `${data.timecode_delta_ms} ms (${data.timecode_delta_frames} frames)`; statusElements.deltaStatus.innerHTML = `<img src="${deltaIconInfo.src}" class="status-icon" alt="" title="${deltaIconInfo.tooltip}">`;
statusElements.deltaStatus.innerHTML = `<img src="${deltaIconInfo.src}" class="status-icon" alt="" title="${deltaIconInfo.tooltip}"><span>${deltaText}</span>`;
const deltaTextValue = `${data.timecode_delta_ms} ms (${data.timecode_delta_frames} frames)`;
statusElements.deltaText.textContent = `Delta Value: ${deltaTextValue}`;
const jitterStatus = data.jitter_status || 'UNKNOWN'; const jitterStatus = data.jitter_status || 'UNKNOWN';
const jitterIconInfo = iconMap.jitterStatus[jitterStatus] || iconMap.jitterStatus.default; const jitterIconInfo = iconMap.jitterStatus[jitterStatus] || iconMap.jitterStatus.default;

8
static/style.css
View file

@ -122,13 +122,11 @@ button:hover {
margin: 10px 0; margin: 10px 0;
} }
#delta-status { #delta-text {
display: inline-flex; text-align: center;
align-items: center;
gap: 0.5em;
} }
#ltc-status, #ntp-active, #sync-status, #jitter-status, #frame-rate, #lock-ratio { #ltc-status, #ntp-active, #sync-status, #jitter-status, #frame-rate, #lock-ratio, #delta-status {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;