Repository: incubator-blur Updated Branches: refs/heads/console-v2 293bcb34a -> 90aa550c9
Added in the UI component of the query load chart Project: http://git-wip-us.apache.org/repos/asf/incubator-blur/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-blur/commit/90aa550c Tree: http://git-wip-us.apache.org/repos/asf/incubator-blur/tree/90aa550c Diff: http://git-wip-us.apache.org/repos/asf/incubator-blur/diff/90aa550c Branch: refs/heads/console-v2 Commit: 90aa550c9507d97ca516da0706eb22a0431d45af Parents: 293bcb3 Author: Chris Rohr <[email protected]> Authored: Mon Feb 17 14:42:43 2014 -0500 Committer: Chris Rohr <[email protected]> Committed: Mon Feb 17 14:42:43 2014 -0500 ---------------------------------------------------------------------- contrib/blur-console/pom.xml | 2 +- .../ui/app/scripts/blurconsole.dashboard.js | 29 +++++++- .../ui/app/scripts/blurconsole.fake.js | 9 ++- .../ui/app/scripts/blurconsole.model.js | 74 ++++++-------------- .../ui/app/styles/blurconsole.dashboard.scss | 17 +++-- .../ui/app/views/dashboard.tpl.html | 2 +- 6 files changed, 70 insertions(+), 63 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/90aa550c/contrib/blur-console/pom.xml ---------------------------------------------------------------------- diff --git a/contrib/blur-console/pom.xml b/contrib/blur-console/pom.xml index 83c82d5..2ef4a2c 100644 --- a/contrib/blur-console/pom.xml +++ b/contrib/blur-console/pom.xml @@ -17,7 +17,7 @@ <parent> <groupId>org.apache.blur</groupId> <artifactId>blur</artifactId> - <version>0.3.0-incubating-SNAPSHOT</version> + <version>0.2.2-incubating-SNAPSHOT</version> <relativePath>../../pom.xml</relativePath> </parent> http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/90aa550c/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 be6f5dd..78fcfe7 100644 --- a/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js +++ b/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js @@ -49,7 +49,7 @@ blurconsole.dashboard = (function () { }, jqueryMap = {}, setJqueryMap, initModule, unloadModule, updateNodeCharts, adjustChartSize, - loadZkPieChart, loadControllerPieChart, loadShardsPieChart, loadTableColumnChart; + loadZkPieChart, loadControllerPieChart, loadShardsPieChart, loadTableColumnChart, loadQueryPerfLineChart; setJqueryMap = function() { var $container = stateMap.$container; @@ -58,12 +58,15 @@ blurconsole.dashboard = (function () { $zkChartHolder : $('#zookeeperNodes'), $controllerChartHolder : $('#controllerNodes'), $shardChartHolder : $('#shardNodes'), - $tableChartHolder : $('#tableCounts') + $tableChartHolder : $('#tableCounts'), + $queryLoadChartHolder : $('#queryLoad') }; }; unloadModule = function() { $.gevent.unsubscribe(jqueryMap.$container, 'node-status-updated'); + $.gevent.unsubscribe(jqueryMap.$container, 'tables-updated'); + $.gevent.unsubscribe(jqueryMap.$container, 'query-perf-updated'); }; updateNodeCharts = function() { @@ -110,7 +113,6 @@ blurconsole.dashboard = (function () { }; loadTableColumnChart = function() { - console.log(blurconsole.model.metrics.getTableChartData()); $.plot(jqueryMap.$tableChartHolder, blurconsole.model.metrics.getTableChartData(), { bars : { show : true, @@ -127,6 +129,20 @@ blurconsole.dashboard = (function () { }); }; + loadQueryPerfLineChart = function() { + $.plot(jqueryMap.$queryLoadChartHolder, [blurconsole.model.metrics.getQueryLoadChartData()], { + series : { + shadowSize : 0 + }, + yaxis : { + min : 0 + }, + xaxis : { + show : false + } + }); + }; + adjustChartSize = function() { var size, shardCharts; @@ -156,6 +172,12 @@ blurconsole.dashboard = (function () { 'height' : size, 'width' : size }); + + size = jqueryMap.$queryLoadChartHolder.parent()[0].clientWidth - 150; + jqueryMap.$queryLoadChartHolder.css({ + 'height' : size, + 'width' : size + }); }; initModule = function( $container ) { @@ -164,6 +186,7 @@ blurconsole.dashboard = (function () { setJqueryMap(); $.gevent.subscribe(jqueryMap.$container, 'node-status-updated', updateNodeCharts); $.gevent.subscribe(jqueryMap.$container, 'tables-updated', loadTableColumnChart); + $.gevent.subscribe(jqueryMap.$container, 'query-perf-updated', loadQueryPerfLineChart); adjustChartSize(); }); $(window).resize(adjustChartSize); http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/90aa550c/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 32c67d5..d1148cf 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; + var getTableList, getNodeList, getQueryPerformance; getTableList = function() { return [ @@ -44,8 +44,13 @@ blurconsole.fake = (function() { }; }; + getQueryPerformance = function() { + return Math.floor((Math.random()*1000) + 1); + }; + return { getTableList : getTableList, - getNodeList : getNodeList + getNodeList : getNodeList, + getQueryPerformance : getQueryPerformance }; }()); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/90aa550c/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 a64d046..063bb8f 100644 --- a/contrib/blur-console/ui/app/scripts/blurconsole.model.js +++ b/contrib/blur-console/ui/app/scripts/blurconsole.model.js @@ -12,7 +12,7 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. */ -/*global blurconsole:false, TAFFY:false */ +/*global blurconsole:false */ blurconsole.model = (function() { 'use strict'; var @@ -21,59 +21,11 @@ blurconsole.model = (function() { }, stateMap = { tableNameMap: {}, - tableDb : TAFFY(), nodeMap : {}, - nodeDb : TAFFY() + queryPerformance : [] }, isFakeData = true, - tableProto, nodeProto, makeTable, makeNode, tables, metrics, initModule, nodePoller, tablePoller; - - tableProto = { - - }; - - nodeProto = { - isZookeeperNode : function() { - return this.type === 'zookeeper'; - }, - isControllerNode : function() { - return this.type === 'controller'; - }, - isShardNode : function() { - return this.type === 'shard'; - } - }; - - makeTable = function( tableMap ) { - var table, - name = tableMap.name; - - table = Object.create( tableProto ); - table.cluster = tableMap.cluster; - table.name = name; - table.enabled = tableMap.enabled; - table.rows = tableMap.rows; - table.records = tableMap.records; - - stateMap.tableNameMap[name] = table; - stateMap.tableDb.insert( table ); - return table; - }; - - makeNode = function( nodeMap ) { - var node, key; - - key = nodeMap.type + '-' + nodeMap.name; - node = Object.create( nodeProto ); - node.type = nodeMap.type; - node.cluster = nodeMap.cluster; - node.name = nodeMap.name; - node.online = nodeMap.online; - - stateMap.nodeMap[key] = node; - stateMap.nodeDb.insert( node ); - return node; - }; + tables, metrics, initModule, nodePoller, tablePoller, queryPerformancePoller; tables = (function() { var getDb, getNameMap; @@ -165,7 +117,13 @@ blurconsole.model = (function() { }; getQueryLoadChartData = function() { + var dataArray = []; + $.each(stateMap.queryPerformance, function(idx, increment) { + dataArray.push([idx, increment]); + }); + + return dataArray; }; buildPieChartData = function(onlineCount, offlineCount) { @@ -189,7 +147,8 @@ blurconsole.model = (function() { getControllerChartData : getControllerChartData, getClusters : getClusters, getShardChartData : getShardChartData, - getTableChartData : getTableChartData + getTableChartData : getTableChartData, + getQueryLoadChartData : getQueryLoadChartData }; }()); @@ -205,10 +164,21 @@ blurconsole.model = (function() { setTimeout(tablePoller, 5000); }; + queryPerformancePoller = function() { + if (stateMap.queryPerformance.length === 100) { + stateMap.queryPerformance.shift(); + } + + stateMap.queryPerformance.push(configMap.poller.getQueryPerformance()); + $.gevent.publish('query-perf-updated'); + setTimeout(queryPerformancePoller, 1000); + }; + initModule = function() { configMap.poller = isFakeData ? blurconsole.fake : blurconsole.data; nodePoller(); tablePoller(); + queryPerformancePoller(); }; return { initModule : initModule, http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/90aa550c/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 24c53d9..0ac8d78 100644 --- a/contrib/blur-console/ui/app/styles/blurconsole.dashboard.scss +++ b/contrib/blur-console/ui/app/styles/blurconsole.dashboard.scss @@ -13,10 +13,19 @@ See the License for the specific language governing permissions and limitations under the License. */ .simple-chart { - min-height : 200; - min-width : 200; - max-height : 500; - max-width : 500; + min-height : 200px; + min-width : 200px; + max-height : 300px; + max-width : 300px; + margin-left : auto; + margin-right : auto; +} + +.wide-chart { + min-height : 100px; + min-width : 200px; + max-height : 200px; + max-width : 1000px; margin-left : auto; margin-right : auto; } \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/90aa550c/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 8da0e6d..bb8b852 100644 --- a/contrib/blur-console/ui/app/views/dashboard.tpl.html +++ b/contrib/blur-console/ui/app/views/dashboard.tpl.html @@ -33,7 +33,7 @@ limitations under the License. <div class="row"> <div class="col-md-12 text-center"> <h4>Query Load</h4> - <div id="queryLoad"><img src="images/ajax-loader.gif"></div> + <div id="queryLoad" class="wide-chart"><img src="images/ajax-loader.gif"></div> </div> </div> </div>
