[thirdparty/systemd.git] / src / journal / browse.html

<!DOCTYPE html>
<html>
<head>
        <title>Journal</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <style type="text/css">
                div#logs {
                        font-family: monospace;
                        font-size: 8pt;
                        background-color: #ffffff;
                        padding: 1em;
                        margin: 2em 0em;
                        border-radius: 10px 10px 10px 10px;
                        border: 1px solid threedshadow;
                        white-space: nowrap;
                        overflow-x: scroll;
                }
                body {
                        background-color: #ededed;
                        color: #313739;
                        font: message-box;
                        margin: 5em;
                }

                .log-error {
                        color: red;
                        font-weight: bold;
                }
                .log-highlight {
                        font-weight: bold;
                }
        </style>
</head>

<body>
        <!-- TODO:

                - seek to back properly
                - handle seek before front properly
                - show red lines for reboots
                - show contents of entries -->

        <h1 id="title"></h1>

        <div id="os"></div>
        <div id="virtualization"></div>
        <div id="cutoff"></div>
        <div id="machine"></div>
        <div id="usage"></div>
        <div id="showing"></div>

        <div id="logs"></div>

        <form>
                <input id="head" type="button" value="|&lt;" onclick="entriesLoadHead();"/>
                <input id="previous" type="button" value="&lt;&lt;" onclick="entriesLoadPrevious();"/>
                <input id="next" type="button" value="&gt;&gt;" onclick="entriesLoadNext();"/>
                <input id="tail" type="button" value="&gt;|" onclick="entriesLoadTail();"/>
                &nbsp;&nbsp;&nbsp;&nbsp;
                <input id="more" type="button" value="More" onclick="entriesMore();"/>
                <input id="less" type="button" value="Less" onclick="entriesLess();"/>
        </form>

        <script type="text/javascript">
                var first_cursor = null;
                var last_cursor = null;

                function setCookie(name, value, msec) {
                        var d = new Date();
                        d.setMilliseconds(d.getMilliseconds() + msec);
                        var v = escape(value) + "; expires=" + d.toUTCString();
                        document.cookie = name + "=" + value;
                }

                function getCookie(name) {
                        var i, l;
                        l = document.cookie.split(";");
                        for (i in l) {
                                var x, y, j;
                                j = l[i].indexOf("=");
                                x = l[i].substr(0, j);
                                y = l[i].substr(j+1);
                                if (x == name)
                                        return unescape(y);
                        }
                        return null;
                }

                function getNEntries() {
                        var n;
                        n = getCookie("n_entries");
                        if (n == null)
                                return 50;
                        return parseInt(n);
                }

                function showNEntries(n) {
                        var showing = document.getElementById("showing");
                        showing.innerHTML = "Showing <b>" + n.toString() + "</b> entries.";
                }

                function setNEntries(n) {
                        if (n < 10)
                                n = 10;
                        else if (n > 1000)
                                n = 1000;

                        setCookie("n_entries", n.toString(), 30*24*60*60*1000);
                        showNEntries(n);
                }

                function machineLoad() {
                        var request = new XMLHttpRequest();
                        request.open("GET", "/machine");
                        request.onreadystatechange = machineOnResult;
                        request.setRequestHeader("Accept", "application/json");
                        request.send(null);
                }

                function formatBytes(u) {
                        if (u >= 1024*1024*1024*1024)
                                return (u/1024/1024/1024/1024).toFixed(1) + " TiB";
                        else if (u >= 1024*1024*1024)
                                return (u/1024/1024/1024).toFixed(1) + " GiB";
                        else if (u >= 1024*1024)
                                return (u/1024/1024).toFixed(1) + " MiB";
                        else if (u >= 1024)
                                return (u/1024).toFixed(1) + " KiB";
                        else
                                return u.toString() + " B";
                }

                function machineOnResult(event) {
                        if ((event.currentTarget.readyState != 4) ||
                                (event.currentTarget.status != 200 && event.currentTarget.status != 0))
                                return;

                        var d = JSON.parse(event.currentTarget.responseText);

                        var title = document.getElementById("title");
                        title.innerHTML = 'Journal of ' + d.hostname;
                        document.title = 'Journal of ' + d.hostname;

                        var machine = document.getElementById("machine");
                        machine.innerHTML = 'Machine ID is <b>' + d.machine_id + '</b>, current boot ID is <b>' + d.boot_id + '</b>.';

                        var cutoff = document.getElementById("cutoff");
                        var from = new Date(parseInt(d.cutoff_from_realtime) / 1000);
                        var to = new Date(parseInt(d.cutoff_to_realtime) / 1000);
                        cutoff.innerHTML = 'Journal begins at <b>' + from.toLocaleString() + '</b> and ends at <b>' + to.toLocaleString() + '</b>.';

                        var usage = document.getElementById("usage");
                        usage.innerHTML = 'Disk usage is <b>' + formatBytes(parseInt(d.usage)) + '</b>.';

                        var os = document.getElementById("os");
                        os.innerHTML = 'Operating system is <b>' + d.os_pretty_name + '</b>.';

                        var virtualization = document.getElementById("virtualization");
                        virtualization.innerHTML = d.virtualization == "bare" ? "Running on <b>bare metal</b>." : "Running on virtualization <b>" + d.virtualization + "</b>.";
                }

                function entriesLoad(range) {
                        var request = new XMLHttpRequest();
                        request.open("GET", "/entries");
                        request.onreadystatechange = entriesOnResult;
                        request.setRequestHeader("Accept", "application/json");
                        request.setRequestHeader("Range", "entries=" + range + ":" + getNEntries().toString());
                        request.send(null);
                }

                function entriesLoadNext() {
                        if (last_cursor == null)
                                entriesLoad("");
                        else
                                entriesLoad(last_cursor + ":1");
                }

                function entriesLoadPrevious() {
                        if (first_cursor == null)
                                entriesLoad("");
                        else
                                entriesLoad(first_cursor + ":-" + getNEntries().toString());
                }

                function entriesLoadHead() {
                        entriesLoad("");
                }

                function entriesLoadTail() {
                        entriesLoad(":-" + getNEntries().toString());
                }

                function entriesOnResult(event) {

                        if ((event.currentTarget.readyState != 4) ||
                                (event.currentTarget.status != 200 && event.currentTarget.status != 0))
                                return;

                        var logs = document.getElementById("logs");
                        logs.innerHTML = "";

                        var lc = null;
                        var fc = null;

                        var i;
                        var l = event.currentTarget.responseText.split('\n');

                        if (l.length <= 1) {
                                logs.innerHTML = "<i>No further entries...</i>";
                                return;
                        }

                        for (i in l) {

                                if (l[i] == '')
                                        continue;

                                var d = JSON.parse(l[i]);
                                if (d.MESSAGE == undefined || d.__CURSOR == undefined)
                                        continue;

                                if (fc == null)
                                        fc = d.__CURSOR;
                                lc = d.__CURSOR;

                                var priority;
                                if (d.PRIORITY != undefined)
                                        priority = parseInt(d.PRIORITY);
                                else
                                        priority = 6;

                                if (priority <= 3)
                                        clazz = "log-error";
                                else if (priority <= 5)
                                        clazz = "log-highlight";
                                else
                                        clazz = "log-normal";

                                var line = '<div class="' + clazz + '">';

                                if (d.SYSLOG_IDENTIFIER != undefined)
                                        line += d.SYSLOG_IDENTIFIER;
                                else if (d._COMM != undefined)
                                        line += d._COMM;

                                if (d._PID != undefined)
                                        line += "[" + d._PID + "]";
                                else if (d.SYSLOG_PID != undefined)
                                        line += "[" + d.SYSLOG_PID + "]";

                                if (d.MESSAGE == null)
                                        line += ": [blob data]</div>";
                                else if (d.MESSAGE instanceof Array)
                                        line += ": [" + formatBytes(d.MESSAGE.length) + " blob data]</div>";
                                else
                                        line += ": " + d.MESSAGE + "</div>";

                                logs.innerHTML += line;
                        }

                        if (fc != null)
                                first_cursor = fc;
                        if (lc != null)
                                last_cursor = lc;
                }

                function entriesMore() {
                        setNEntries(getNEntries() + 10);
                        entriesLoad("");
                }

                function entriesLess() {
                        setNEntries(getNEntries() - 10);
                        entriesLoad("");
                }

                machineLoad();
                entriesLoad("");
                showNEntries(getNEntries());
        </script>
</body>
</html>
Commit	Line	Data
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">
	7	div#logs {
	8	font-family: monospace;
	9	font-size: 8pt;
	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	}
	18	body {
	19	background-color: #ededed;
	20	color: #313739;
	21	font: message-box;
	22	margin: 5em;
	23	}
	24
	25	.log-error {
	26	color: red;
	27	font-weight: bold;
	28	}
	29	.log-highlight {
	30	font-weight: bold;
	31	}
	32	</style>
	33	</head>
	34
	35	<body>
	36	<!-- TODO:
	37
	38	- seek to back properly
	39	- handle seek before front properly
	40	- show red lines for reboots
	41	- show contents of entries -->
	42
	43	<h1 id="title"></h1>
	44
	45	<div id="os"></div>
	46	<div id="virtualization"></div>
	47	<div id="cutoff"></div>
	48	<div id="machine"></div>
	49	<div id="usage"></div>
	50	<div id="showing"></div>
	51
	52	<div id="logs"></div>
	53
	54	<form>
	55	<input id="head" type="button" value="\|<" onclick="entriesLoadHead();"/>
	56	<input id="previous" type="button" value="<<" onclick="entriesLoadPrevious();"/>
	57	<input id="next" type="button" value=">>" onclick="entriesLoadNext();"/>
	58	<input id="tail" type="button" value=">\|" onclick="entriesLoadTail();"/>
	59
	60	<input id="more" type="button" value="More" onclick="entriesMore();"/>
	61	<input id="less" type="button" value="Less" onclick="entriesLess();"/>
	62	</form>
	63
	64	<script type="text/javascript">
65	var first_cursor = null;
66	var last_cursor = null;
67
68	function setCookie(name, value, msec) {
69	var d = new Date();
70	d.setMilliseconds(d.getMilliseconds() + msec);
71	var v = escape(value) + "; expires=" + d.toUTCString();
72	document.cookie = name + "=" + value;
73	}
74
75	function getCookie(name) {
76	var i, l;
77	l = document.cookie.split(";");
78	for (i in l) {
79	var x, y, j;
80	j = l[i].indexOf("=");
81	x = l[i].substr(0, j);
82	y = l[i].substr(j+1);
83	if (x == name)
84	return unescape(y);
85	}
86	return null;
87	}
88
89	function getNEntries() {
90	var n;
91	n = getCookie("n_entries");
92	if (n == null)
93	return 50;
94	return parseInt(n);
95	}
96
97	function showNEntries(n) {
98	var showing = document.getElementById("showing");
99	showing.innerHTML = "Showing <b>" + n.toString() + "</b> entries.";
100	}
101
102	function setNEntries(n) {
103	if (n < 10)
104	n = 10;
105	else if (n > 1000)
106	n = 1000;
107
108	setCookie("n_entries", n.toString(), 302460601000);
109	showNEntries(n);
110	}
111
112	function machineLoad() {
113	var request = new XMLHttpRequest();
114	request.open("GET", "/machine");
115	request.onreadystatechange = machineOnResult;
116	request.setRequestHeader("Accept", "application/json");
117	request.send(null);
118	}
119
120	function formatBytes(u) {
121	if (u >= 102410241024*1024)
122	return (u/1024/1024/1024/1024).toFixed(1) + " TiB";
123	else if (u >= 102410241024)
124	return (u/1024/1024/1024).toFixed(1) + " GiB";
125	else if (u >= 1024*1024)
126	return (u/1024/1024).toFixed(1) + " MiB";
127	else if (u >= 1024)
128	return (u/1024).toFixed(1) + " KiB";
129	else
130	return u.toString() + " B";
131	}
132
133	function machineOnResult(event) {
134	if ((event.currentTarget.readyState != 4) \|\|
135	(event.currentTarget.status != 200 && event.currentTarget.status != 0))
136	return;
137
138	var d = JSON.parse(event.currentTarget.responseText);
139
140	var title = document.getElementById("title");
141	title.innerHTML = 'Journal of ' + d.hostname;
142	document.title = 'Journal of ' + d.hostname;
143
144	var machine = document.getElementById("machine");
145	machine.innerHTML = 'Machine ID is <b>' + d.machine_id + '</b>, current boot ID is <b>' + d.boot_id + '</b>.';
146
147	var cutoff = document.getElementById("cutoff");
148	var from = new Date(parseInt(d.cutoff_from_realtime) / 1000);
149	var to = new Date(parseInt(d.cutoff_to_realtime) / 1000);
150	cutoff.innerHTML = 'Journal begins at <b>' + from.toLocaleString() + '</b> and ends at <b>' + to.toLocaleString() + '</b>.';
151
152	var usage = document.getElementById("usage");
153	usage.innerHTML = 'Disk usage is <b>' + formatBytes(parseInt(d.usage)) + '</b>.';
154
155	var os = document.getElementById("os");
156	os.innerHTML = 'Operating system is <b>' + d.os_pretty_name + '</b>.';
157
158	var virtualization = document.getElementById("virtualization");
159	virtualization.innerHTML = d.virtualization == "bare" ? "Running on <b>bare metal</b>." : "Running on virtualization <b>" + d.virtualization + "</b>.";
160	}
161
162	function entriesLoad(range) {
163	var request = new XMLHttpRequest();
164	request.open("GET", "/entries");
165	request.onreadystatechange = entriesOnResult;
166	request.setRequestHeader("Accept", "application/json");
167	request.setRequestHeader("Range", "entries=" + range + ":" + getNEntries().toString());
168	request.send(null);
169	}
170
171	function entriesLoadNext() {
172	if (last_cursor == null)
173	entriesLoad("");
174	else
175	entriesLoad(last_cursor + ":1");
176	}
177
178	function entriesLoadPrevious() {
179	if (first_cursor == null)
180	entriesLoad("");
181	else
182	entriesLoad(first_cursor + ":-" + getNEntries().toString());
183	}
184
185	function entriesLoadHead() {
186	entriesLoad("");
187	}
188
189	function entriesLoadTail() {
190	entriesLoad(":-" + getNEntries().toString());
191	}
192
193	function entriesOnResult(event) {
194
195	if ((event.currentTarget.readyState != 4) \|\|
196	(event.currentTarget.status != 200 && event.currentTarget.status != 0))
197	return;
198
199	var logs = document.getElementById("logs");
200	logs.innerHTML = "";
201
202	var lc = null;
203	var fc = null;
204
205	var i;
206	var l = event.currentTarget.responseText.split('\n');
207
208	if (l.length <= 1) {
209	logs.innerHTML = "<i>No further entries...</i>";
210	return;
211	}
212
213	for (i in l) {
214
215	if (l[i] == '')
216	continue;
217
218	var d = JSON.parse(l[i]);
219	if (d.MESSAGE == undefined \|\| d.__CURSOR == undefined)
220	continue;
221
222	if (fc == null)
223	fc = d.__CURSOR;
224	lc = d.__CURSOR;
225
226	var priority;
227	if (d.PRIORITY != undefined)
228	priority = parseInt(d.PRIORITY);
229	else
230	priority = 6;
231
232	if (priority <= 3)
233	clazz = "log-error";
234	else if (priority <= 5)
235	clazz = "log-highlight";
236	else
237	clazz = "log-normal";
238
239	var line = '<div class="' + clazz + '">';
240
241	if (d.SYSLOG_IDENTIFIER != undefined)
242	line += d.SYSLOG_IDENTIFIER;
243	else if (d._COMM != undefined)
244	line += d._COMM;
245
246	if (d._PID != undefined)
247	line += "[" + d._PID + "]";
248	else if (d.SYSLOG_PID != undefined)
249	line += "[" + d.SYSLOG_PID + "]";
250
251	if (d.MESSAGE == null)
252	line += ": [blob data]</div>";
253	else if (d.MESSAGE instanceof Array)
254	line += ": [" + formatBytes(d.MESSAGE.length) + " blob data]</div>";
255	else
256	line += ": " + d.MESSAGE + "</div>";
257
258	logs.innerHTML += line;
259	}
260
261	if (fc != null)
262	first_cursor = fc;
263	if (lc != null)
264	last_cursor = lc;
265	}
266
267	function entriesMore() {
268	setNEntries(getNEntries() + 10);
269	entriesLoad("");
270	}
271
272	function entriesLess() {
273	setNEntries(getNEntries() - 10);
274	entriesLoad("");
275	}
276
277	machineLoad();
278	entriesLoad("");
279	showNEntries(getNEntries());
280	</script>
281	</body>
282	</html>