listen on update events (a8f076e0) · Commits · github_fork / Clip

fnordmetric-webui/Makefile

+1 −0

Original line number	Diff line number	Diff line
		@@ -22,6 +22,7 @@ build:
		fnordmetric-webui-singlemetricview.js \
		fnordmetric-webui-metricpreviewwidget.js \
		fnordmetric-webui-autocomplete.js \
		fnordmetric-webui-datepicker.js \
		codemirror.js \
		) > fnordmetric-webui.js

fnordmetric-webui/fnordmetric-webui-datepicker.js

0 → 100644

+24 −0

Original line number	Diff line number	Diff line
		/**
		* This file is part of the "FnordMetric" project
		* Copyright (c) 2014 Laura Schlimmer
		* Copyright (c) 2014 Paul Asmuth, Google Inc.
		*
		* FnordMetric is free software: you can redistribute it and/or modify it under
		* the terms of the GNU General Public License v3.0. You should have received a
		* copy of the GNU General Public License along with this program. If not, see
		* <http://www.gnu.org/licenses/>.
		*/
		if (FnordMetric === undefined) {
		FnordMetric = {};
		}

		if (FnordMetric.views === undefined) {
		FnordMetric.views = {};
		}

		FnordMetric.util.DatePicker = function(elem, input, callback) {
		console.log("render datepicker");


		};

fnordmetric-webui/fnordmetric-webui-metricpreviewwidget.js

+89 −3

Original line number	Diff line number	Diff line
		@@ -18,7 +18,59 @@ if (FnordMetric.views === undefined) {

		FnordMetric.util.MetricPreviewWidget = function() {

		function updateResult(inputs) {
		console.log("update result");
		}

		function updateEventHandler(elems) {
		var inputs = {
		"show" : "Value",
		"aggregation" : {
		"time" : null,
		"step" : null
		},
		"seconds" : 10,
		"date" : null,
		"group_by" : []
		}

		elems.show.addEventListener('change', function() {
		inputs.show = this.value;
		updateResult(inputs);
		}, false);

		elems.aggregation.time.addEventListener('change', function() {
		inputs.aggregation.time = this.value;
		updateResult(inputs);
		}, false);

		elems.aggregation.step.addEventListener('change', function() {
		inputs.aggregation.step = this.value;
		updateResult(inputs);
		}, false);

		elems.seconds.addEventListener('change', function() {
		inputs.seconds = this.value;
		updateResult(inputs);
		}, false);

		elems.group_by.map(function(column) {
		column.addEventListener('click', function(e) {
		e.preventDefault();
		//check if already set --> on /off
		inputs.group_by.push(this.innerText);
		updateResult(inputs);
		});
		}, false);

		//timespan & datepicker --> date



		}

		function renderElems(elem, columns) {
		var elems = {};
		var show_ttl = document.createElement("div");
		show_ttl.innerHTML = "Show";
		var show_select = document.createElement("select");
		@@ -28,6 +80,9 @@ FnordMetric.util.MetricPreviewWidget = function() {
		option.innerHTML = show;
		show_select.appendChild(option);
		});

		elems.show = show_select;

		elem.appendChild(show_ttl);
		elem.appendChild(show_select);

		@@ -35,6 +90,12 @@ FnordMetric.util.MetricPreviewWidget = function() {
		aggr_ttl.innerHTML = "Aggregation";
		var aggr_time = document.createElement("input");
		var aggr_step = document.createElement("input");

		elems.aggregation = {
		time : aggr_time,
		step: aggr_step
		};

		elem.appendChild(aggr_ttl);
		elem.appendChild(aggr_time);
		elem.appendChild(aggr_step);
		@@ -48,6 +109,9 @@ FnordMetric.util.MetricPreviewWidget = function() {
		option.innerHTML = timespan;
		timespan_select.appendChild(option);
		});

		elems.seconds = timespan_select;

		elem.appendChild(timespan_ttl);
		elem.appendChild(timespan_select);

		@@ -56,13 +120,17 @@ FnordMetric.util.MetricPreviewWidget = function() {
		var datepicker = document.createElement("input");
		elem.appendChild(date_ttl);
		elem.appendChild(datepicker);
		FnordMetric.util.DatePicker(elem, datepicker);

		if (columns.length > 0) {
		var group_buttons = [];
		columns.map(function(column) {
		var btn = FnordMetric.createButton(
		"#", undefined, column);
		group_buttons.push(btn);
		elem.appendChild(btn);
		});
		elems.group_by = group_buttons;
		var group_ttl = document.createElement("div");
		group_ttl.innerHTML = "Group By";
		elem.appendChild(group_ttl);
		@@ -75,17 +143,35 @@ FnordMetric.util.MetricPreviewWidget = function() {
		"#", undefined, "→");
		var updater_ttl = document.createElement("span");
		updater_ttl.innerHTML = "DATE";

		elems.timespan = {
		prev : prev_timespan,
		next : next_timespan
		}

		elem.appendChild(timespan_updater);
		elem.appendChild(prev_timespan);
		elem.appendChild(updater_ttl);
		elem.appendChild(next_timespan);

		updateEventHandler(elems);

		}

		function render(elem, metric) {
		/* get columns for metric */
		columns = ["foo", "bar"];
		var columns = [];
		FnordMetric.httpGet("/metrics", function(r) {
		if (r.status == 200) {
		var json = JSON.parse(r.response);
		json.metrics.map(function(m) {
		if (m.key != metric) {return;}
		m.labels.map(function(label) {
		columns.push(label);
		});
		});
		renderElems(elem, columns);
		}
		});

		}

Admin message