summaryrefslogtreecommitdiff
path: root/web/index.html
blob: f4d8ec87af22e5facb87396c0b4da19f71e99887 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>GPS Clock</title>
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='13' fill='none' stroke='%232a78d6' stroke-width='3'/%3E%3Cpath d='M16 8v8l5 4' stroke='%232a78d6' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header class="top">
  <div class="brand"><span id="host">—</span> <span class="muted">GPS + PPS time server</span></div>
  <div class="conn" title="Live data stream from the server. If it stops, the page reconnects automatically."><span id="conn-dot" class="dot"></span><span id="conn-text">connecting…</span>
    <button id="theme" type="button" title="Toggle theme" aria-label="Toggle theme">◐</button></div>
</header>

<main>
  <!-- Clock banner -->
  <section class="card clock">
    <div class="clock-main">
      <div class="label">UTC</div>
      <div class="utc"><span id="utc-hms">--:--:--</span></div>
      <div id="utc-date" class="date">—</div>
    </div>
    <div class="clock-side">
      <dl class="kv compact">
        <dt>Local</dt><dd id="local-time">—</dd>
        <dt>Day of year</dt><dd id="doy">—</dd>
        <dt>MJD</dt><dd id="mjd">—</dd>
        <dt>Unix</dt><dd id="unix">—</dd>
        <dt>GPS week / TOW</dt><dd id="gpswk">—</dd>
        <dt>Leap status</dt><dd id="leap">—</dd>
        <dt>Browser clock</dt><dd id="browser-off">—</dd>
      </dl>
    </div>
  </section>

  <div class="grid two">
    <!-- Time quality -->
    <section class="card">
      <h2>Time quality <span class="sub">chronyc tracking</span></h2>
      <div class="tiles">
        <div class="tile"><div class="tile-label">System offset</div><div id="t-sys" class="tile-value">—</div><div id="t-sys-dir" class="tile-sub">&nbsp;</div></div>
        <div class="tile"><div class="tile-label">RMS offset</div><div id="t-rms" class="tile-value">—</div><div class="tile-sub">long-term avg</div></div>
        <div class="tile"><div class="tile-label">Reference</div><div id="t-ref" class="tile-value">—</div><div id="t-stratum" class="tile-sub">&nbsp;</div>
          <div id="status" class="status unknown"><span class="status-icon" aria-hidden="true">●</span><span id="status-text">Waiting for data</span></div></div>
      </div>
      <ul id="status-reasons" class="reasons"></ul>
      <dl class="kv">
        <dt>Last offset</dt><dd id="t-last">—</dd>
        <dt>Frequency</dt><dd id="t-freq">—</dd>
        <dt>Residual freq</dt><dd id="t-resid">—</dd>
        <dt>Skew</dt><dd id="t-skew">—</dd>
        <dt>Root delay</dt><dd id="t-rdelay">—</dd>
        <dt>Root dispersion</dt><dd id="t-rdisp">—</dd>
        <dt>Update interval</dt><dd id="t-upd">—</dd>
        <dt>Ref time</dt><dd id="t-reftime">—</dd>
        <dt class="srv">NTP requests</dt><dd class="srv" id="t-srv">—</dd>
      </dl>
      <p id="chrony-err" class="err" hidden></p>
    </section>

    <!-- Sources -->
    <section class="card">
      <h2>Sources <span class="sub">chronyc sources / sourcestats</span></h2>
      <div class="table-wrap">
        <table class="sources">
          <thead><tr><th title="Selection state: how chronyd is using this source (see legend below). * is the source the clock is steered to.">S</th><th title="Source name: a reference clock driver (e.g. GPS/PPS) or an NTP server hostname/address.">Name</th><th title="refclock = hardware attached to this machine; NTP sN = network server at stratum N (lower is closer to a reference clock).">Type</th><th class="num" title="Polling interval: how often chronyd takes a sample from this source.">Poll</th><th title="Reachability of the last 8 polls, oldest to newest. Filled = sample received. Gaps mean missed samples; all empty means the source is unreachable.">Reach</th><th class="num" title="How long ago the last good sample from this source arrived.">Last</th><th class="num" title="Offset of this source relative to the local clock in its last sample (+ = local clock is slow). ± is the error bound of that measurement; σ is the standard deviation of recent samples. Smaller and steadier is better.">Offset</th></tr></thead>
          <tbody id="sources"></tbody>
        </table>
      </div>
      <p class="legend-note"><b>*</b> selected · <b>+</b> combined · <b>−</b> not combined · <b>x</b> falseticker · <b>~</b> too variable · <b>?</b> unusable</p>
    </section>
  </div>

  <!-- History -->
  <section class="card">
    <h2>History
      <span class="range" role="group" aria-label="Time range">
        <button type="button" data-range="600" class="on">10 min</button><button type="button" data-range="1800">30 min</button><button type="button" data-range="3600">60 min</button>
      </span>
    </h2>
    <div class="grid three charts">
      <figure class="chart" id="ch-offset"><figcaption title="System offset is how far chronyd estimates the system clock is from true time; PPS sample is the raw offset measured on each pulse-per-second edge. Both should hover near zero. Spikes or drift point to PPS trouble or heavy system load.">Offset</figcaption></figure>
      <figure class="chart" id="ch-freq"><figcaption title="The correction chronyd applies to the crystal oscillator's rate, in parts per million. It drifts slowly with temperature; sudden jumps suggest a problem.">Frequency (ppm)</figcaption></figure>
      <figure class="chart" id="ch-sats"><figcaption title="Satellites in view and used in the fix over time. A drop to zero means the antenna has lost sky view and PPS may become unreliable.">Satellites</figcaption></figure>
    </div>
  </section>

  <div class="grid two">
    <!-- GPS -->
    <section class="card">
      <h2>GPS receiver <span class="sub">gpsd</span></h2>
      <div class="tiles">
        <div class="tile"><div class="tile-label">Fix</div><div id="g-fix" class="tile-value">—</div><div id="g-status" class="tile-sub">&nbsp;</div></div>
        <div class="tile"><div class="tile-label">Satellites</div><div class="tile-value"><span id="g-used">—</span><span class="of"> / <span id="g-seen">—</span></span></div><div class="tile-sub">used / in view</div></div>
        <div class="tile"><div class="tile-label">Time error (est.)</div><div id="g-ept" class="tile-value">—</div><div class="tile-sub">NMEA, before PPS</div></div>
      </div>
      <dl class="kv">
        <dt>Latitude</dt><dd id="g-lat">—</dd>
        <dt>Longitude</dt><dd id="g-lon">—</dd>
        <dt>Altitude (MSL)</dt><dd id="g-alt">—</dd>
        <dt>Position error</dt><dd id="g-eph">—</dd>
        <dt>DOP (P / H / V / T)</dt><dd id="g-dop">—</dd>
        <dt>Serial latency</dt><dd id="g-toff">—</dd>
        <dt>GPS fix time</dt><dd id="g-time">—</dd>
        <dt>Receiver</dt><dd id="g-dev">—</dd>
      </dl>
      <p id="gps-err" class="err" hidden></p>
    </section>

    <!-- Satellites -->
    <section class="card">
      <h2>Satellites <span class="sub">sky view &amp; signal</span></h2>
      <div class="sky-wrap">
        <svg id="sky" viewBox="-110 -110 220 220" role="img" aria-label="Sky plot of satellites by azimuth and elevation"></svg>
        <div class="sky-side">
          <table class="const">
            <thead><tr><th title="Satellite system: GPS (USA), GLONASS (Russia), Galileo (EU), BeiDou (China), QZSS (Japan), SBAS (augmentation).">Constellation</th><th class="num" title="Satellites from this system used in the current fix.">Used</th><th class="num" title="Satellites from this system the receiver is tracking.">Seen</th></tr></thead>
            <tbody id="const"></tbody>
          </table>
          <p class="legend-note"><span class="sw filled"></span> used in fix &nbsp; <span class="sw hollow"></span> tracked only</p>
        </div>
      </div>
      <div class="snr-head"><span title="Carrier-to-noise density per satellite. Above about 35 dB-Hz is good, 25–35 is usable, below 25 is weak. Consistently low values suggest antenna, cable or placement problems.">Signal strength (dB-Hz)</span></div>
      <div id="snr" class="snr" role="img" aria-label="Signal strength per satellite"></div>
    </section>
  </div>
</main>
<div id="tip" class="tip" hidden></div>
<footer class="foot muted">gps-clock-dash <span id="ver"></span> · updates every second</footer>
<script src="app.js"></script>
</body>
</html>