fix(journal-gatewayd): use relative urls (not starting with '/')
[thirdparty/systemd.git] / src / journal-remote / browse.html
CommitLineData
bf5542f8
LP
1<!DOCTYPE html>
2<html>
3<head>
4 <title>Journal</title>
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
6 <style type="text/css">
c6511e85 7 div#divlogs, div#diventry {
bf5542f8 8 font-family: monospace;
1cd8a002 9 font-size: 7pt;
bf5542f8
LP
10 background-color: #ffffff;
11 padding: 1em;
12 margin: 2em 0em;
13 border-radius: 10px 10px 10px 10px;
14 border: 1px solid threedshadow;
15 white-space: nowrap;
16 overflow-x: scroll;
17 }
c6511e85
LP
18 div#diventry {
19 display: none;
20 }
21 div#divlogs {
22 display: block;
23 }
bf5542f8
LP
24 body {
25 background-color: #ededed;
26 color: #313739;
27 font: message-box;
1cd8a002 28 margin: 3em;
bf5542f8 29 }
1dac8b79
LP
30 td.timestamp {
31 text-align: right;
32 border-right: 1px dotted lightgrey;
33 padding-right: 5px;
34 }
35 td.process {
36 border-right: 1px dotted lightgrey;
37 padding-left: 5px;
38 padding-right: 5px;
39 }
40 td.message {
41 padding-left: 5px;
42 }
c6511e85
LP
43 td.message > a:link, td.message > a:visited {
44 text-decoration: none;
45 color: #313739;
46 }
1dac8b79
LP
47 td.message-error {
48 padding-left: 5px;
bf5542f8
LP
49 color: red;
50 font-weight: bold;
51 }
c6511e85
LP
52 td.message-error > a:link, td.message-error > a:visited {
53 text-decoration: none;
54 color: red;
55 }
1dac8b79
LP
56 td.message-highlight {
57 padding-left: 5px;
bf5542f8
LP
58 font-weight: bold;
59 }
c6511e85
LP
60 td.message-highlight > a:link, td.message-highlight > a:visited {
61 text-decoration: none;
62 color: #313739;
63 }
64 td > a:hover, td > a:active {
65 text-decoration: underline;
66 color: #c13739;
67 }
68 table#tablelogs, table#tableentry {
69 border-collapse: collapse;
70 }
71 td.field {
72 text-align: right;
73 border-right: 1px dotted lightgrey;
74 padding-right: 5px;
75 }
76 td.data {
77 padding-left: 5px;
1dac8b79 78 }
6d5f2f58
LP
79 div#keynav {
80 text-align: center;
81 font-size: 7pt;
82 color: #818789;
74bee4e3 83 padding-top: 2em;
6d5f2f58 84 }
1cd8a002 85 span.key {
6d5f2f58
LP
86 font-weight: bold;
87 color: #313739;
88 }
1cd8a002 89 div#buttonnav {
74bee4e3
LP
90 text-align: center;
91 }
1cd8a002 92 button {
33162605 93 font-size: 18pt;
74bee4e3 94 font-weight: bold;
1cd8a002
LP
95 width: 2em;
96 height: 2em;
97 }
98 div#filternav {
99 text-align: center;
100 }
101 select {
102 width: 50em;
74bee4e3 103 }
bf5542f8
LP
104 </style>
105</head>
106
107<body>
108 <!-- TODO:
6c69cd86 109 - live display
6c69cd86 110 - show red lines for reboots -->
bf5542f8
LP
111
112 <h1 id="title"></h1>
113
114 <div id="os"></div>
115 <div id="virtualization"></div>
116 <div id="cutoff"></div>
117 <div id="machine"></div>
118 <div id="usage"></div>
119 <div id="showing"></div>
120
1cd8a002
LP
121 <div id="filternav">
122 <select id="filter" onchange="onFilterChange(this);" onfocus="onFilterFocus(this);">
123 <option>No filter</option>
124 </select>
125 &nbsp;&nbsp;&nbsp;&nbsp;
126 <input id="boot" type="checkbox" onchange="onBootChange(this);">Only current boot</input>
127 </div>
128
1dac8b79 129 <div id="divlogs"><table id="tablelogs"></table></div>
c6511e85
LP
130 <a name="entry"></a>
131 <div id="diventry"><table id="tableentry"></table></div>
bf5542f8 132
1cd8a002
LP
133 <div id="buttonnav">
134 <button id="head" onclick="entriesLoadHead();" title="First Page">&#8676;</button>
135 <button id="previous" type="button" onclick="entriesLoadPrevious();" title="Previous Page"/>&#8592;</button>
136 <button id="next" type="button" onclick="entriesLoadNext();" title="Next Page"/>&#8594;</button>
137 <button id="tail" type="button" onclick="entriesLoadTail();" title="Last Page"/>&#8677;</button>
bf5542f8 138 &nbsp;&nbsp;&nbsp;&nbsp;
1cd8a002
LP
139 <button id="more" type="button" onclick="entriesMore();" title="More Entries"/>+</button>
140 <button id="less" type="button" onclick="entriesLess();" title="Fewer Entries"/>-</button>
141 </div>
bf5542f8 142
6d5f2f58 143 <div id="keynav">
6d5f2f58 144 <span class="key">g</span>: First Page &nbsp;&nbsp;&nbsp;&nbsp;
74bee4e3
LP
145 <span class="key">&#8592;, k, BACKSPACE</span>: Previous Page &nbsp;&nbsp;&nbsp;&nbsp;
146 <span class="key">&#8594;, j, SPACE</span>: Next Page &nbsp;&nbsp;&nbsp;&nbsp;
6d5f2f58
LP
147 <span class="key">G</span>: Last Page &nbsp;&nbsp;&nbsp;&nbsp;
148 <span class="key">+</span>: More entries &nbsp;&nbsp;&nbsp;&nbsp;
149 <span class="key">-</span>: Fewer entries
150 </div>
151
bf5542f8
LP
152 <script type="text/javascript">
153 var first_cursor = null;
154 var last_cursor = null;
155
bf5542f8
LP
156 function getNEntries() {
157 var n;
1cd8a002 158 n = localStorage["n_entries"];
bf5542f8
LP
159 if (n == null)
160 return 50;
04909b0f
LP
161 n = parseInt(n);
162 if (n < 10)
163 return 10;
164 if (n > 1000)
165 return 1000;
166 return n;
bf5542f8
LP
167 }
168
169 function showNEntries(n) {
170 var showing = document.getElementById("showing");
171 showing.innerHTML = "Showing <b>" + n.toString() + "</b> entries.";
172 }
173
174 function setNEntries(n) {
33162605
LP
175 if (n < 10)
176 return 10;
177 if (n > 1000)
178 return 1000;
1cd8a002 179 localStorage["n_entries"] = n.toString();
bf5542f8
LP
180 showNEntries(n);
181 }
182
183 function machineLoad() {
184 var request = new XMLHttpRequest();
1faba68f 185 request.open("GET", "machine");
bf5542f8
LP
186 request.onreadystatechange = machineOnResult;
187 request.setRequestHeader("Accept", "application/json");
188 request.send(null);
189 }
190
191 function formatBytes(u) {
192 if (u >= 1024*1024*1024*1024)
193 return (u/1024/1024/1024/1024).toFixed(1) + " TiB";
194 else if (u >= 1024*1024*1024)
195 return (u/1024/1024/1024).toFixed(1) + " GiB";
196 else if (u >= 1024*1024)
197 return (u/1024/1024).toFixed(1) + " MiB";
198 else if (u >= 1024)
199 return (u/1024).toFixed(1) + " KiB";
200 else
201 return u.toString() + " B";
202 }
203
522795e0
MM
204 function escapeHTML(s) {
205 return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
206 }
207
bf5542f8
LP
208 function machineOnResult(event) {
209 if ((event.currentTarget.readyState != 4) ||
210 (event.currentTarget.status != 200 && event.currentTarget.status != 0))
211 return;
212
213 var d = JSON.parse(event.currentTarget.responseText);
214
215 var title = document.getElementById("title");
6c69cd86
LP
216 title.innerHTML = 'Journal of ' + escapeHTML(d.hostname);
217 document.title = 'Journal of ' + escapeHTML(d.hostname);
bf5542f8
LP
218
219 var machine = document.getElementById("machine");
220 machine.innerHTML = 'Machine ID is <b>' + d.machine_id + '</b>, current boot ID is <b>' + d.boot_id + '</b>.';
221
222 var cutoff = document.getElementById("cutoff");
223 var from = new Date(parseInt(d.cutoff_from_realtime) / 1000);
224 var to = new Date(parseInt(d.cutoff_to_realtime) / 1000);
225 cutoff.innerHTML = 'Journal begins at <b>' + from.toLocaleString() + '</b> and ends at <b>' + to.toLocaleString() + '</b>.';
226
227 var usage = document.getElementById("usage");
228 usage.innerHTML = 'Disk usage is <b>' + formatBytes(parseInt(d.usage)) + '</b>.';
229
230 var os = document.getElementById("os");
6c69cd86 231 os.innerHTML = 'Operating system is <b>' + escapeHTML(d.os_pretty_name) + '</b>.';
bf5542f8
LP
232
233 var virtualization = document.getElementById("virtualization");
6c69cd86 234 virtualization.innerHTML = d.virtualization == "bare" ? "Running on <b>bare metal</b>." : "Running on virtualization <b>" + escapeHTML(d.virtualization) + "</b>.";
bf5542f8
LP
235 }
236
237 function entriesLoad(range) {
04909b0f 238
944072fe
YW
239 if (range == null) {
240 if (localStorage["cursor"] != null && localStorage["cursor"] != "")
241 range = localStorage["cursor"] + ":0";
242 else
243 range = "";
244 }
04909b0f 245
1faba68f 246 var url = "entries";
1cd8a002
LP
247
248 if (localStorage["filter"] != "" && localStorage["filter"] != null) {
249 url += "?_SYSTEMD_UNIT=" + escape(localStorage["filter"]);
250
251 if (localStorage["boot"] == "1")
252 url += "&boot";
253 } else {
254 if (localStorage["boot"] == "1")
255 url += "?boot";
256 }
257
bf5542f8 258 var request = new XMLHttpRequest();
1cd8a002 259 request.open("GET", url);
bf5542f8
LP
260 request.onreadystatechange = entriesOnResult;
261 request.setRequestHeader("Accept", "application/json");
262 request.setRequestHeader("Range", "entries=" + range + ":" + getNEntries().toString());
263 request.send(null);
264 }
265
266 function entriesLoadNext() {
267 if (last_cursor == null)
268 entriesLoad("");
269 else
270 entriesLoad(last_cursor + ":1");
271 }
272
273 function entriesLoadPrevious() {
274 if (first_cursor == null)
275 entriesLoad("");
276 else
277 entriesLoad(first_cursor + ":-" + getNEntries().toString());
278 }
279
280 function entriesLoadHead() {
281 entriesLoad("");
282 }
283
284 function entriesLoadTail() {
285 entriesLoad(":-" + getNEntries().toString());
286 }
287
288 function entriesOnResult(event) {
289
290 if ((event.currentTarget.readyState != 4) ||
291 (event.currentTarget.status != 200 && event.currentTarget.status != 0))
292 return;
293
1dac8b79 294 var logs = document.getElementById("tablelogs");
bf5542f8
LP
295
296 var lc = null;
297 var fc = null;
298
1cd8a002 299 var i, l = event.currentTarget.responseText.split('\n');
bf5542f8
LP
300
301 if (l.length <= 1) {
1dac8b79 302 logs.innerHTML = '<tbody><tr><td colspan="3"><i>No further entries...</i></td></tr></tbody>';
bf5542f8
LP
303 return;
304 }
305
1dac8b79
LP
306 var buf = '';
307
bf5542f8 308 for (i in l) {
bf5542f8
LP
309 if (l[i] == '')
310 continue;
311
312 var d = JSON.parse(l[i]);
313 if (d.MESSAGE == undefined || d.__CURSOR == undefined)
314 continue;
315
316 if (fc == null)
317 fc = d.__CURSOR;
318 lc = d.__CURSOR;
319
320 var priority;
321 if (d.PRIORITY != undefined)
322 priority = parseInt(d.PRIORITY);
323 else
324 priority = 6;
325
c497e449 326 var clazz;
bf5542f8 327 if (priority <= 3)
1dac8b79 328 clazz = "message-error";
bf5542f8 329 else if (priority <= 5)
1dac8b79 330 clazz = "message-highlight";
bf5542f8 331 else
1dac8b79
LP
332 clazz = "message";
333
334 buf += '<tr><td class="timestamp">';
335
336 if (d.__REALTIME_TIMESTAMP != undefined) {
337 var timestamp = new Date(parseInt(d.__REALTIME_TIMESTAMP) / 1000);
338 buf += timestamp.toLocaleString();
339 }
bf5542f8 340
1dac8b79 341 buf += '</td><td class="process">';
bf5542f8
LP
342
343 if (d.SYSLOG_IDENTIFIER != undefined)
6c69cd86 344 buf += escapeHTML(d.SYSLOG_IDENTIFIER);
bf5542f8 345 else if (d._COMM != undefined)
6c69cd86 346 buf += escapeHTML(d._COMM);
bf5542f8
LP
347
348 if (d._PID != undefined)
6c69cd86 349 buf += "[" + escapeHTML(d._PID) + "]";
bf5542f8 350 else if (d.SYSLOG_PID != undefined)
6c69cd86 351 buf += "[" + escapeHTML(d.SYSLOG_PID) + "]";
1dac8b79 352
04909b0f 353 buf += '</td><td class="' + clazz + '"><a href="#entry" onclick="onMessageClick(\'' + d.__CURSOR + '\');">';
bf5542f8
LP
354
355 if (d.MESSAGE == null)
1dac8b79 356 buf += "[blob data]";
bf5542f8 357 else if (d.MESSAGE instanceof Array)
1dac8b79 358 buf += "[" + formatBytes(d.MESSAGE.length) + " blob data]";
bf5542f8 359 else
522795e0 360 buf += escapeHTML(d.MESSAGE);
bf5542f8 361
c6511e85 362 buf += '</a></td></tr>';
bf5542f8
LP
363 }
364
c6511e85 365 logs.innerHTML = '<tbody>' + buf + '</tbody>';
1dac8b79 366
04909b0f 367 if (fc != null) {
bf5542f8 368 first_cursor = fc;
1cd8a002 369 localStorage["cursor"] = fc;
04909b0f 370 }
bf5542f8
LP
371 if (lc != null)
372 last_cursor = lc;
373 }
374
375 function entriesMore() {
376 setNEntries(getNEntries() + 10);
c6511e85 377 entriesLoad(first_cursor);
bf5542f8
LP
378 }
379
380 function entriesLess() {
381 setNEntries(getNEntries() - 10);
c6511e85
LP
382 entriesLoad(first_cursor);
383 }
384
385 function onResultMessageClick(event) {
386 if ((event.currentTarget.readyState != 4) ||
387 (event.currentTarget.status != 200 && event.currentTarget.status != 0))
388 return;
389
390 var d = JSON.parse(event.currentTarget.responseText);
391
392 document.getElementById("diventry").style.display = "block";
c497e449 393 var entry = document.getElementById("tableentry");
c6511e85
LP
394
395 var buf = "";
9ed794a3 396 for (var key in d) {
6c69cd86 397 var data = d[key];
c6511e85 398
6c69cd86
LP
399 if (data == null)
400 data = "[blob data]";
401 else if (data instanceof Array)
402 data = "[" + formatBytes(data.length) + " blob data]";
403 else
404 data = escapeHTML(data);
405
406 buf += '<tr><td class="field">' + key + '</td><td class="data">' + data + '</td></tr>';
407 }
c6511e85
LP
408 entry.innerHTML = '<tbody>' + buf + '</tbody>';
409 }
410
411 function onMessageClick(t) {
412 var request = new XMLHttpRequest();
1faba68f 413 request.open("GET", "entries?discrete");
c6511e85
LP
414 request.onreadystatechange = onResultMessageClick;
415 request.setRequestHeader("Accept", "application/json");
416 request.setRequestHeader("Range", "entries=" + t + ":0:1");
417 request.send(null);
bf5542f8
LP
418 }
419
6d5f2f58
LP
420 function onKeyUp(event) {
421 switch (event.keyCode) {
422 case 8:
423 case 37:
424 case 75:
425 entriesLoadPrevious();
426 break;
427 case 32:
428 case 39:
429 case 74:
430 entriesLoadNext();
431 break;
432
433 case 71:
434 if (event.shiftKey)
435 entriesLoadTail();
436 else
437 entriesLoadHead();
438 break;
439 case 171:
440 entriesMore();
441 break;
442 case 173:
443 entriesLess();
444 break;
445 }
446 }
447
19f8efac
KS
448 function onMouseWheel(event) {
449 if (event.detail < 0 || event.wheelDelta > 0)
450 entriesLoadPrevious();
451 else
452 entriesLoadNext();
453 }
454
1cd8a002
LP
455 function onResultFilterFocus(event) {
456 if ((event.currentTarget.readyState != 4) ||
457 (event.currentTarget.status != 200 && event.currentTarget.status != 0))
458 return;
459
c497e449 460 var f = document.getElementById("filter");
1cd8a002
LP
461
462 var l = event.currentTarget.responseText.split('\n');
463 var buf = '<option>No filter</option>';
464 var j = -1;
465
466 for (i in l) {
467
468 if (l[i] == '')
469 continue;
470
471 var d = JSON.parse(l[i]);
472 if (d._SYSTEMD_UNIT == undefined)
473 continue;
474
475 buf += '<option value="' + escape(d._SYSTEMD_UNIT) + '">' + escapeHTML(d._SYSTEMD_UNIT) + '</option>';
476
477 if (d._SYSTEMD_UNIT == localStorage["filter"])
478 j = i;
479 }
480
481 if (j < 0) {
482 if (localStorage["filter"] != null && localStorage["filter"] != "") {
483 buf += '<option value="' + escape(localStorage["filter"]) + '">' + escapeHTML(localStorage["filter"]) + '</option>';
484 j = i + 1;
485 } else
486 j = 0;
487 }
488
489 f.innerHTML = buf;
490 f.selectedIndex = j;
491 }
492
493 function onFilterFocus(w) {
494 var request = new XMLHttpRequest();
1faba68f 495 request.open("GET", "fields/_SYSTEMD_UNIT");
1cd8a002
LP
496 request.onreadystatechange = onResultFilterFocus;
497 request.setRequestHeader("Accept", "application/json");
498 request.send(null);
499 }
500
501 function onFilterChange(w) {
502 if (w.selectedIndex <= 0)
503 localStorage["filter"] = "";
504 else
505 localStorage["filter"] = unescape(w.options[w.selectedIndex].value);
506
507 entriesLoadHead();
508 }
509
510 function onBootChange(w) {
511 localStorage["boot"] = w.checked ? "1" : "0";
512 entriesLoadHead();
513 }
514
515 function initFilter() {
c497e449 516 var f = document.getElementById("filter");
1cd8a002
LP
517
518 var buf = '<option>No filter</option>';
519
520 var filter = localStorage["filter"];
c497e449 521 var j;
1cd8a002
LP
522 if (filter != null && filter != "") {
523 buf += '<option value="' + escape(filter) + '">' + escapeHTML(filter) + '</option>';
524 j = 1;
525 } else
526 j = 0;
527
528 f.innerHTML = buf;
529 f.selectedIndex = j;
530 }
531
532 function installHandlers() {
533 document.onkeyup = onKeyUp;
534
c497e449 535 var logs = document.getElementById("divlogs");
1cd8a002
LP
536 logs.addEventListener("mousewheel", onMouseWheel, false);
537 logs.addEventListener("DOMMouseScroll", onMouseWheel, false);
538 }
539
bf5542f8 540 machineLoad();
04909b0f 541 entriesLoad(null);
bf5542f8 542 showNEntries(getNEntries());
1cd8a002
LP
543 initFilter();
544 installHandlers();
bf5542f8
LP
545 </script>
546</body>
547</html>