Sha256: c93792403896a6aa23c250a6f88b9948285166eb2b1cb07835c4ae73c7e79513
Contents?: true
Size: 1.98 KB
Versions: 7
Compression:
Stored size: 1.98 KB
Contents
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="../js/jquery.tmpl.min.js"></script>
<style type="text/css">
#radiator {
margin-top: 1em;
padding-left:10px;
padding-right:10px;
font-size: 120%;
border-top: 1px solid black;
width: 100%;
}
#radiator .entry:nth-child(2n) {
background-color: #C4FFC6;
}
#radiator .timestamp {
white-space: nowrap;
text-align: left;
vertical-align: top;
font-family: monospace;
font-size: 75%;
padding-right: 1em;
width: 14em;
border-right: 1px solid grey;
}
#radiator .message {
font-family: monospace;
//text-indent: -2em;
//padding-left: 3em;
}
</style>
</head>
<body>
<h1> logstash information radiator </h1>
New log data will be streamed here in real-time as logstash
receives it.
<table id="radiator"></table>
<script id="message-template" type="text/x-jquery-tmpl"><![CDATA[
<tr>
<td class="timestamp">${$item.data["@timestamp"]}</td>
<td class="message">${$item.data["@message"]}</td>
</tr>
]]></script>
<script>
$(document).ready(function() {
var ws = new WebSocket("ws://" + document.location.hostname + ":3232");
ws.onopen = function(event) {
//console.log(["WebSocket open", ws])
};
ws.onmessage = function(event) {
eval("var data = " + event.data);
var el = $("#message-template").tmpl(data, { "message": data["@message"], "timestamp": data["@timestamp"] });
el.addClass("message")
.css("display", "none")
.appendTo($("#radiator"))
.fadeIn()
.delay(10000)
.fadeOut(2000, function() {
$(this).remove();
});
};
});
</script>
</body>
</html>
Version data entries
7 entries across 7 versions & 1 rubygems