incubator-blur-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From cr...@apache.org
Subject [2/4] git commit: Added in the slow query warning on the dashboard
Date Wed, 26 Mar 2014 22:31:06 GMT
Added in the slow query warning on the dashboard


Project: http://git-wip-us.apache.org/repos/asf/incubator-blur/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-blur/commit/30caf5ce
Tree: http://git-wip-us.apache.org/repos/asf/incubator-blur/tree/30caf5ce
Diff: http://git-wip-us.apache.org/repos/asf/incubator-blur/diff/30caf5ce

Branch: refs/heads/console-v2
Commit: 30caf5ce876d5ec70929c56cbf6c480a641436ee
Parents: cd3c9e8
Author: Chris Rohr <crohr@nearinfinity.com>
Authored: Tue Mar 4 21:27:15 2014 -0500
Committer: Chris Rohr <crohr@nearinfinity.com>
Committed: Tue Mar 4 21:27:15 2014 -0500

----------------------------------------------------------------------
 .../ui/app/scripts/blurconsole.dashboard.js     | 58 ++++++++++++++++++--
 .../ui/app/scripts/blurconsole.fake.js          | 11 +++-
 .../ui/app/scripts/blurconsole.model.js         | 53 ++++++++++++++++--
 .../ui/app/styles/blurconsole.dashboard.scss    | 14 +++++
 .../ui/app/views/dashboard.tpl.html             | 10 ++--
 5 files changed, 129 insertions(+), 17 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/30caf5ce/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js
----------------------------------------------------------------------
diff --git a/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js b/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js
index 417ed38..414081f 100644
--- a/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js
+++ b/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js
@@ -45,18 +45,23 @@ blurconsole.dashboard = (function () {
 			}
 		},
 		stateMap = {
-			$container : null
+			$container : null,
+			zookeeperNodes: 'chart',
+			controllerNodes: 'chart'
 		},
 		jqueryMap = {},
 		setJqueryMap, initModule, unloadModule, updateNodeCharts, adjustChartSize,
-		loadZkPieChart,	loadControllerPieChart, loadShardsPieChart, loadTableColumnChart, loadQueryPerfLineChart;
+		loadZkPieChart,	loadControllerPieChart, loadShardsPieChart, loadTableColumnChart, loadQueryPerfLineChart,
+		buildNodeTable, checkForSlowQueries;
 
 	setJqueryMap = function() {
 		var $container = stateMap.$container;
 		jqueryMap = {
 			$container : $container,
 			$zkChartHolder : $('#zookeeperNodes'),
+			$zkInfoHolder : $('#zookeeperInfo'),
 			$controllerChartHolder : $('#controllerNodes'),
+			$controllerInfoHolder : $('#controllerInfo'),
 			$shardChartHolder : $('#shardNodes'),
 			$tableChartHolder : $('#tableCounts'),
 			$queryLoadChartHolder : $('#queryLoad')
@@ -77,10 +82,12 @@ blurconsole.dashboard = (function () {
 
 	loadZkPieChart = function() {
 		$.plot(jqueryMap.$zkChartHolder, blurconsole.model.metrics.getZookeeperChartData(), configMap.pieOptions);
+		jqueryMap.$zkInfoHolder.html(buildNodeTable(blurconsole.model.nodes.getOfflineZookeeperNodes()));
 	};
 
 	loadControllerPieChart = function() {
 		$.plot(jqueryMap.$controllerChartHolder, blurconsole.model.metrics.getControllerChartData(),
configMap.pieOptions);
+		jqueryMap.$controllerInfoHolder.html(buildNodeTable(blurconsole.model.nodes.getOfflineControllerNodes()));
 	};
 
 	loadShardsPieChart = function() {
@@ -89,25 +96,32 @@ blurconsole.dashboard = (function () {
 		}
 
 		$.each(blurconsole.model.metrics.getClusters(), function(idx, cluster) {
-			var clusterData, clusterHolder, parentSize;
+			var clusterData, clusterHolder, clusterInfo, parentSize;
 
 			clusterData = blurconsole.model.metrics.getShardChartData(cluster);
 
 			if (clusterData) {
 				clusterHolder = jqueryMap.$shardChartHolder.find('#cluster_' + cluster + '_chart_holder');
+				clusterInfo = jqueryMap.$shardChartHolder.find('#cluster_' + cluster + '_info');
 
 				if (clusterHolder.length === 0) {
-					clusterHolder = $('<div id="cluster_'+ cluster + '_chart_holder" class="shardClusterChartHolder
simple-chart"></div>');
-					jqueryMap.$shardChartHolder.append($('<div class="text-center"><strong>'
+ cluster + '</strong></div>'));
-					jqueryMap.$shardChartHolder.append(clusterHolder);
+					var wrapper = $('<div></div>');
+					wrapper.append($('<div class="text-center"><strong>' + cluster + '</strong>
<small class="text-muted"><i class="glyphicon glyphicon-retweet swapper-trigger"
title="Swap Chart/Info"></i></small></div>'));
+					clusterHolder = $('<div id="cluster_'+ cluster + '_chart_holder" class="shardClusterChartHolder
simple-chart swapper-chart"></div>');
+					wrapper.append(clusterHolder);
 					parentSize = jqueryMap.$shardChartHolder.parent()[0].clientWidth - 150;
 					clusterHolder.css({
 						'height' : parentSize,
 						'width' : parentSize
 					});
+					clusterInfo = $('<div id="cluster_' + cluster + '_info" class="swapper-info hidden"></div>');
+					wrapper.append(clusterInfo);
+
+					jqueryMap.$shardChartHolder.append(wrapper);
 				}
 
 				$.plot(clusterHolder, clusterData, configMap.pieOptions);
+				clusterInfo.html(buildNodeTable(blurconsole.model.nodes.getOfflineShardNodes(cluster)));
 			}
 		});
 	};
@@ -143,6 +157,19 @@ blurconsole.dashboard = (function () {
 		});
 	};
 
+	buildNodeTable = function(data) {
+		var table = '<table class="table table-condensed"><thead><tr><th>Offline
Node</th></tr></thead><tbody>';
+		if (data.length === 0) {
+			table += '<tr><td>Everything is Online!</td></tr>';
+		} else {
+			$.each(data, function(idx, node) {
+				table += '<tr><td>' + node + '</td></tr>';
+			});
+		}
+		table += '</tbody></table>';
+		return $(table);
+	};
+
 	adjustChartSize = function() {
 		var size, shardCharts;
 
@@ -180,6 +207,15 @@ blurconsole.dashboard = (function () {
 		});
 	};
 
+	checkForSlowQueries = function() {
+		console.log(blurconsole.model.metrics.getSlowQueryWarnings())
+		if (blurconsole.model.metrics.getSlowQueryWarnings()) {
+			$('#slow-query-warnings').removeClass('hidden');
+		} else {
+			$('#slow-query-warnings').addClass('hidden');
+		}
+	};
+
 	initModule = function( $container ) {
 		$container.load ( configMap.view, function() {
 			stateMap.$container = $container;
@@ -187,7 +223,17 @@ blurconsole.dashboard = (function () {
 			$.gevent.subscribe(jqueryMap.$container, 'node-status-updated', updateNodeCharts);
 			$.gevent.subscribe(jqueryMap.$container, 'tables-updated', loadTableColumnChart);
 			$.gevent.subscribe(jqueryMap.$container, 'query-perf-updated', loadQueryPerfLineChart);
+			$.gevent.subscribe(jqueryMap.$container, 'queries-updated', checkForSlowQueries);
 			adjustChartSize();
+			$(document).on('click', '.swapper-trigger', function() {
+				var parent = $(this).closest('div:not(.text-center)');
+				var chart = parent.find('.swapper-chart');
+				var info = parent.find('.swapper-info');
+
+				chart.toggleClass('hidden');
+				info.toggleClass('hidden');
+			});
+			
 		});
 		$(window).resize(adjustChartSize);
 		return true;

http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/30caf5ce/contrib/blur-console/ui/app/scripts/blurconsole.fake.js
----------------------------------------------------------------------
diff --git a/contrib/blur-console/ui/app/scripts/blurconsole.fake.js b/contrib/blur-console/ui/app/scripts/blurconsole.fake.js
index 289a239..2e90bd5 100644
--- a/contrib/blur-console/ui/app/scripts/blurconsole.fake.js
+++ b/contrib/blur-console/ui/app/scripts/blurconsole.fake.js
@@ -15,7 +15,7 @@ limitations under the License.
 /*global blurconsole:false */
 blurconsole.fake = (function() {
 	'use strict';
-	var getTableList, getNodeList, getQueryPerformance;
+	var getTableList, getNodeList, getQueryPerformance, getQueries;
 
 	getTableList = function() {
 		var clusters = ['prodA', 'prodB'], data = [], i, cluster, rows, records, enabled;
@@ -59,9 +59,16 @@ blurconsole.fake = (function() {
 		return Math.floor((Math.random()*1000) + 1);
 	};
 
+	getQueries = function() {
+		return {
+			slowQueries : Math.floor((Math.random()*100) + 1) % 10 === 0
+		};
+	};
+
 	return {
 		getTableList : getTableList,
 		getNodeList : getNodeList,
-		getQueryPerformance : getQueryPerformance
+		getQueryPerformance : getQueryPerformance,
+		getQueries : getQueries
 	};
 }());
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/30caf5ce/contrib/blur-console/ui/app/scripts/blurconsole.model.js
----------------------------------------------------------------------
diff --git a/contrib/blur-console/ui/app/scripts/blurconsole.model.js b/contrib/blur-console/ui/app/scripts/blurconsole.model.js
index a15cd2a..79fbddf 100644
--- a/contrib/blur-console/ui/app/scripts/blurconsole.model.js
+++ b/contrib/blur-console/ui/app/scripts/blurconsole.model.js
@@ -22,10 +22,11 @@ blurconsole.model = (function() {
 		stateMap = {
 			tableNameMap: {},
 			nodeMap : {},
-			queryPerformance : []
+			queryPerformance : [],
+			queries : {}
 		},
 		isFakeData = true,
-		tables, metrics, initModule, nodePoller, tablePoller, queryPerformancePoller;
+		tables, metrics, nodes, initModule, nodePoller, tablePoller, queryPerformancePoller, queryPoller;
 
 	tables = (function() {
 		var getClusters, getEnabledTables, getDisabledTables;
@@ -75,9 +76,38 @@ blurconsole.model = (function() {
 		};
 	}());
 
+	nodes = (function() {
+		var getOfflineZookeeperNodes, getOfflineControllerNodes, getOfflineShardNodes;
+
+		getOfflineZookeeperNodes = function() {
+			return stateMap.nodeMap.zookeepers.offline;
+		};
+
+		getOfflineControllerNodes = function() {
+			return stateMap.nodeMap.controllers.offline;
+		};
+
+		getOfflineShardNodes = function(clusterName) {
+			var clusterData = $.grep(stateMap.nodeMap.clusters, function(cluster) {
+				return cluster.name === clusterName;
+			});
+
+			if (clusterData.length > 0) {
+				return clusterData[0].offline;
+			}
+			return [];
+		};
+
+		return {
+			getOfflineZookeeperNodes : getOfflineZookeeperNodes,
+			getOfflineControllerNodes : getOfflineControllerNodes,
+			getOfflineShardNodes : getOfflineShardNodes
+		};
+	}());
+
 	metrics = (function() {
 		var getZookeeperChartData, getControllerChartData, getClusters, getShardChartData, getTableChartData,
-			getQueryLoadChartData, buildPieChartData;
+			getQueryLoadChartData, buildPieChartData, getSlowQueryWarnings;
 
 		getZookeeperChartData = function() {
 			return buildPieChartData(stateMap.nodeMap.zookeepers.online.length, stateMap.nodeMap.zookeepers.offline.length);
@@ -195,13 +225,18 @@ blurconsole.model = (function() {
 			return [onlineChart, offlineChart];
 		};
 
+		getSlowQueryWarnings = function() {
+			return stateMap.queries.slowQueries;
+		};
+
 		return {
 			getZookeeperChartData : getZookeeperChartData,
 			getControllerChartData : getControllerChartData,
 			getClusters : getClusters,
 			getShardChartData : getShardChartData,
 			getTableChartData : getTableChartData,
-			getQueryLoadChartData : getQueryLoadChartData
+			getQueryLoadChartData : getQueryLoadChartData,
+			getSlowQueryWarnings : getSlowQueryWarnings
 		};
 	}());
 
@@ -227,17 +262,25 @@ blurconsole.model = (function() {
 		setTimeout(queryPerformancePoller, 1000);
 	};
 
+	queryPoller = function() {
+		stateMap.queries = configMap.poller.getQueries();
+		$.gevent.publish('queries-updated');
+		setTimeout(queryPoller, 5000);
+	};
+
 	initModule = function() {
 		configMap.poller = isFakeData ? blurconsole.fake : blurconsole.data;
 		setTimeout(function() {
 			nodePoller();
 			tablePoller();
 			queryPerformancePoller();
+			queryPoller();
 		}, 1000);
 	};
 	return {
 		initModule : initModule,
 		tables : tables,
-		metrics: metrics
+		metrics: metrics,
+		nodes : nodes
 	};
 }());
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/30caf5ce/contrib/blur-console/ui/app/styles/blurconsole.dashboard.scss
----------------------------------------------------------------------
diff --git a/contrib/blur-console/ui/app/styles/blurconsole.dashboard.scss b/contrib/blur-console/ui/app/styles/blurconsole.dashboard.scss
index 0ac8d78..d038b63 100644
--- a/contrib/blur-console/ui/app/styles/blurconsole.dashboard.scss
+++ b/contrib/blur-console/ui/app/styles/blurconsole.dashboard.scss
@@ -28,4 +28,18 @@ limitations under the License.
 	max-width : 1000px;
 	margin-left : auto;
 	margin-right : auto;
+}
+
+.swapper-trigger {
+	cursor : pointer;
+}
+
+.swapper-info {
+	min-height : 200px;
+	min-width : 200px;
+	max-height : 300px;
+	max-width : 300px;
+	margin-left : auto;
+	margin-right : auto;
+	overflow: auto;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/30caf5ce/contrib/blur-console/ui/app/views/dashboard.tpl.html
----------------------------------------------------------------------
diff --git a/contrib/blur-console/ui/app/views/dashboard.tpl.html b/contrib/blur-console/ui/app/views/dashboard.tpl.html
index bb8b852..cce38e6 100644
--- a/contrib/blur-console/ui/app/views/dashboard.tpl.html
+++ b/contrib/blur-console/ui/app/views/dashboard.tpl.html
@@ -22,12 +22,14 @@ limitations under the License.
 	<div class="col-md-8">
 		<div class="row">
 			<div class="col-md-6 text-center">
-				<h4>Zookeepers</h4>
-				<div id="zookeeperNodes" class="simple-chart"><img src="images/ajax-loader.gif"></div>
+					<h4>Zookeepers <small><i class="glyphicon glyphicon-retweet swapper-trigger"
title="Swap Chart/Info"></i></small></h4>
+					<div id="zookeeperNodes" class="simple-chart swapper-chart"><img src="images/ajax-loader.gif"></div>
+					<div id="zookeeperInfo" class="swapper-info hidden"></div>
 			</div>
 			<div class="col-md-6 text-center">
-				<h4>Controllers</h4>
-				<div id="controllerNodes" class="simple-chart"><img src="images/ajax-loader.gif"></div>
+				<h4>Controllers <small><i class="glyphicon glyphicon-retweet swapper-trigger"
title="Swap Chart/Info"></i></small></h4>
+				<div id="controllerNodes" class="simple-chart swapper-chart"><img src="images/ajax-loader.gif"></div>
+				<div id="controllerInfo" class="swapper-info hidden"></div>
 			</div>
 		</div>
 		<div class="row">


Mime
View raw message