js-api: implemented support for counters (b9a312e1) · Commits · github_fork / Clip

doc/js-api-example.html

+18 −0

Original line number	Diff line number	Diff line
		@@ -14,6 +14,24 @@
		</head>
		<body class="dark">

		<span
		data-fnordmetric="counter"
		data-gauge="useronline_total"
		data-autoupdate="1"
		data-time-range="1"
		data-unit=" users online"
		style="color:#fff; font-size:24px;">0</span>

		—

		<span
		data-fnordmetric="counter"
		data-gauge="order_sum"
		data-autoupdate="1"
		data-time-range="s3600"
		data-unit="€"
		style="color:#fff; font-size:24px;">0</span>

		<div
		data-fnordmetric="timeseries"
		data-style="flow"

web/js/fnordmetric.js_api.js

+34 −7

Original line number	Diff line number	Diff line
		@@ -6,8 +6,41 @@ FnordMetric.js_api = (function(){
		var widgets = [];

		function init() {
		$("div[data-fnordmetric]").each(function(n, e){
		$("*[data-fnordmetric]").each(function(n, e){
		var elem = $(e);
		var wkey = FnordMetric.util.getNextWidgetUID();

		var wupdate = elem.attr("data-autoupdate");
		if (!wupdate) { wupdate = 60; }
		wupdate = parseInt(wupdate, 10);

		if (elem.attr("data-fnordmetric") == "counter") {
		var gauge = elem.attr("data-gauge");
		var offset = elem.attr("data-time-range");
		if (!offset){ offset = 0; }

		widgets.push({
		announce: function(evt) {
		if (evt.widget_key == wkey) {
		for (k in evt.values) {
		elem.attr("data", evt.values[k].value);
		FnordMetric.util.updateNumbers(elem, null, true);
		}
		}
		}
		});

		window.setInterval(function(){
		FnordMetric.publish({
		"type": "widget_request",
		"klass": "NumbersWidget",
		"cmd": "values_for",
		"gauge": gauge,
		"offsets": [offset],
		"widget_key": wkey
		})
		}, wupdate * 1000);
		}

		if (elem.attr("data-fnordmetric") == "timeseries") {
		var widget = FnordMetric.widgets.timeseriesWidget();
		@@ -23,10 +56,6 @@ FnordMetric.js_api = (function(){
		if (!wheight) { wheight = 240; }
		wheight = parseInt(wheight, 10);

		var wupdate = elem.attr("data-autoupdate");
		if (!wupdate) { wupdate = 60; }
		wupdate = parseInt(wupdate, 10);

		var wrange = elem.attr("data-time-range");
		if (!wrange) { wrange = 3600; }
		wrange = parseInt(wrange, 10);
		@@ -38,8 +67,6 @@ FnordMetric.js_api = (function(){
		{ "color": gcolor, "data": [{x:0, y:0}], name: gname });
		});

		wkey = FnordMetric.util.getNextWidgetUID();

		widget.render({
		elem: elem,
		async_chart: true,

web/js/fnordmetric.util.js

+8 −6

Original line number	Diff line number	Diff line
		@@ -127,10 +127,12 @@ FnordMetric.util.formatGaugeValue = function(gauge_key, value){
		}
		}

		FnordMetric.util.updateNumbers = function(trgt_elem, diff_factor){
		FnordMetric.util.updateNumbers = function(trgt_elem, diff_factor, single){
		var still_running = false;
		if(!diff_factor){ diff_factor = 4; }
		$('.number', $(trgt_elem)).each(function(){
		var elems = [];
		if (single) { elems = [trgt_elem]; } else { elems = $('.number', $(trgt_elem)); }
		$(elems).each(function(){
		var target_val = parseFloat($(this).attr('data'));
		var current_val = parseFloat($(this).attr('data-current'));
		if(!current_val){ current_val=0; }
		@@ -146,15 +148,15 @@ FnordMetric.util.updateNumbers = function(trgt_elem, diff_factor){
		$(this).attr('data-current', new_val);
		var val_txt = FnordMetric.util.formatGaugeValue($(this).attr('rel'), new_val);
		if ($(this).attr('data-unit')){ val_txt += $(this).attr('data-unit'); }
		$('.value', this).html(val_txt);
		if (single) { $(this).html(val_txt); } else { $('.value', this).html(val_txt); }
		}
		});
		if(still_running){
		(function(te, df){
		(function(te, df, sg){
		window.setTimeout(function(){
		FnordMetric.util.updateNumbers(te, df);
		FnordMetric.util.updateNumbers(te, df, sg);
		}, 30);
		})(trgt_elem, diff_factor);
		})(trgt_elem, diff_factor, single);
		}
		}

Admin message