fnordmetric-ui: full test page (7baa6109) · Commits · github_fork / Clip

fnordmetric-ui/test.html

+63 −10

Original line number	Diff line number	Diff line

		<!DOCTYPE html>
		<html>
		<head>
		<title>FnordMetric</title>
		<script src='http://localhost:8080/vendor/jquery-1.6.2.min.js' type='text/javascript'></script>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
		<script src='./js/fnordmetric.js' type='text/javascript'></script>
		<script src='./js/fnordmetric.util.js' type='text/javascript'></script>
		<script src='./js/fnordmetric.widgets.counter.js' type='text/javascript'></script>

		<link href='./css/fnordmetric.graph.css' type='text/css' rel='stylesheet' />
		<style type="text/css">
		body{ background:#111; }
		body.dark .rickshaw_legend li.line .label{ color:#fff; }
		body.dark .rickshaw_graph .y_grid .tick { stroke:rgba(255,255,255,.15); stroke-dasharray:0; }
		body.dark .rickshaw_graph .y_ticks text { fill:#ffffff; }
		body.dark .rickshaw_graph .x_tick .title { color:#ffffff; }
		</style>
		</head>
		<body>
		<body class="dark">

		<span
		data-fnordmetric="counter"
		data-gauge="useronline_total"
		data-autoupdate="1"
		data-offset="1"
		data-unit=" users online"
		style="padding:30px; line-height:60px; color:#fff; font-size:24px;">0</span>

		—

		<span
		data-fnordmetric="counter"
		data-gauge="order_sum"
		data-autoupdate="1"
		data-at="-1hour"
		data-unit="€ order sum (last hour)"
		style="color:#fff; font-size:24px;">0</span>

		<br />

		<div
		data-fnordmetric="timeseries"
		data-style="line"
		data-height="240"
		data-time-range="16000"
		data-autoupdate="10"
		data-gauges="order_sum"
		style="width:600px; float:left;"></div>

		<div
		data-fnordmetric="timeseries"
		data-style="area"
		data-height="240"
		data-time-range="16000"
		data-autoupdate="10"
		data-gauges="user_logins,user_logins_failed"
		data-colors="#00ff00,#ff0000"
		style="width:600px; float:left;"></div>

		<div
		data-fnordmetric="timeseries"
		data-style="flow"
		data-height="240"
		data-time-range="16000"
		data-autoupdate="10"
		data-gauges="useronline_total"
		style="width:600px; float:left;"></div>

		<span data-fnordmetric="counter" data-value="123" data-autoupdate="1" data-gauge="useronline_total" id="my_counter">0</span>
		<script>
		$(document).ready(function(){
		FnordMetric.setup({
		namespace: "loveos",
		address: "localhost:8080",
		});
		"address": "localhost:8080",
		"namespace": "loveos"
		});
		</script>

		</body>
		</html>

Admin message