Got the initial table tab displaying and updating
Project: http://git-wip-us.apache.org/repos/asf/incubator-blur/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-blur/commit/5f504682 Tree: http://git-wip-us.apache.org/repos/asf/incubator-blur/tree/5f504682 Diff: http://git-wip-us.apache.org/repos/asf/incubator-blur/diff/5f504682 Branch: refs/heads/console-v2 Commit: 5f504682c9e64aff08b18b04aca7c0be42d1eda1 Parents: 30caf5c Author: Chris Rohr <[email protected]> Authored: Thu Mar 20 17:41:35 2014 -0400 Committer: Chris Rohr <[email protected]> Committed: Thu Mar 20 17:41:35 2014 -0400 ---------------------------------------------------------------------- contrib/blur-console/ui/app/index.html | 1 + .../ui/app/scripts/blurconsole.b_utils.js | 58 +++++++++++++++ .../ui/app/scripts/blurconsole.dashboard.js | 44 ++++++----- .../ui/app/scripts/blurconsole.model.js | 77 ++++++++++++-------- .../ui/app/scripts/blurconsole.tables.js | 29 ++++---- .../ui/app/scripts/blurconsole.utils.js | 9 ++- 6 files changed, 153 insertions(+), 65 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/5f504682/contrib/blur-console/ui/app/index.html ---------------------------------------------------------------------- diff --git a/contrib/blur-console/ui/app/index.html b/contrib/blur-console/ui/app/index.html index 6a87c68..0591ace 100644 --- a/contrib/blur-console/ui/app/index.html +++ b/contrib/blur-console/ui/app/index.html @@ -94,6 +94,7 @@ limitations under the License. <!-- build:js({app,.tmp}) scripts/main.js --> <script src="scripts/blurconsole.js"></script> <script src="scripts/blurconsole.utils.js"></script> + <script src="scripts/blurconsole.b_utils.js"></script> <script src="scripts/blurconsole.shell.js"></script> <script src="scripts/blurconsole.dashboard.js"></script> <script src="scripts/blurconsole.tables.js"></script> http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/5f504682/contrib/blur-console/ui/app/scripts/blurconsole.b_utils.js ---------------------------------------------------------------------- diff --git a/contrib/blur-console/ui/app/scripts/blurconsole.b_utils.js b/contrib/blur-console/ui/app/scripts/blurconsole.b_utils.js new file mode 100644 index 0000000..5f98e4e --- /dev/null +++ b/contrib/blur-console/ui/app/scripts/blurconsole.b_utils.js @@ -0,0 +1,58 @@ +/* + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +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 */ +blurconsole.browserUtils = (function(){ + 'use strict'; + var table; + + table = function(def, data) { + var tableMarkup; + + tableMarkup = '<table class="table table-bordered table-condensed table-hover table-striped"><thead><tr>'; + + // Add headers + $.each(def, function(idx, colDef){ + tableMarkup += '<th>' + colDef.label + '</th>'; + }); + + tableMarkup += '</tr></thead><tbody>'; + + // Add content + if (data && data.length > 0) { + $.each(data, function(ir, row){ + tableMarkup += '<tr>'; + $.each(def, function(ic, col) { + tableMarkup += '<td>'; + if ($.isFunction(col.key)) { + tableMarkup += col.key(row); + } else { + tableMarkup += row[col.key]; + } + tableMarkup += '</td>'; + }); + tableMarkup += '</tr>'; + }); + } else { + tableMarkup += '<tr><td colspan="' + def.length + '">There are no items here</td></tr>'; + } + + tableMarkup += '</tbody></table>'; + return tableMarkup; + }; + + return { + table: table + }; +}()); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/5f504682/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 414081f..fe8c08d 100644 --- a/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js +++ b/contrib/blur-console/ui/app/scripts/blurconsole.dashboard.js @@ -72,12 +72,15 @@ blurconsole.dashboard = (function () { $.gevent.unsubscribe(jqueryMap.$container, 'node-status-updated'); $.gevent.unsubscribe(jqueryMap.$container, 'tables-updated'); $.gevent.unsubscribe(jqueryMap.$container, 'query-perf-updated'); + $.gevent.unsubscribe(jqueryMap.$container, 'queries-updated'); }; updateNodeCharts = function() { - loadZkPieChart(); - loadControllerPieChart(); - loadShardsPieChart(); + if (blurconsole.model.nodes.isDataLoaded()) { + loadZkPieChart(); + loadControllerPieChart(); + loadShardsPieChart(); + } }; loadZkPieChart = function() { @@ -127,20 +130,22 @@ blurconsole.dashboard = (function () { }; loadTableColumnChart = function() { - $.plot(jqueryMap.$tableChartHolder, blurconsole.model.metrics.getTableChartData(), { - bars : { - show : true, - barWidth : 0.6, - align : 'center' - }, - yaxis : { - min : 0, - tickDecimals : 0 - }, - xaxis : { - mode : 'categories' - } - }); + if (blurconsole.model.tables.isDataLoaded()) { + $.plot(jqueryMap.$tableChartHolder, blurconsole.model.metrics.getTableChartData(), { + bars : { + show : true, + barWidth : 0.6, + align : 'center' + }, + yaxis : { + min : 0, + tickDecimals : 0 + }, + xaxis : { + mode : 'categories' + } + }); + } }; loadQueryPerfLineChart = function() { @@ -208,7 +213,6 @@ blurconsole.dashboard = (function () { }; checkForSlowQueries = function() { - console.log(blurconsole.model.metrics.getSlowQueryWarnings()) if (blurconsole.model.metrics.getSlowQueryWarnings()) { $('#slow-query-warnings').removeClass('hidden'); } else { @@ -220,6 +224,10 @@ blurconsole.dashboard = (function () { $container.load ( configMap.view, function() { stateMap.$container = $container; setJqueryMap(); + updateNodeCharts(); + loadTableColumnChart(); + loadQueryPerfLineChart(); + checkForSlowQueries(); $.gevent.subscribe(jqueryMap.$container, 'node-status-updated', updateNodeCharts); $.gevent.subscribe(jqueryMap.$container, 'tables-updated', loadTableColumnChart); $.gevent.subscribe(jqueryMap.$container, 'query-perf-updated', loadQueryPerfLineChart); http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/5f504682/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 79fbddf..834a5dc 100644 --- a/contrib/blur-console/ui/app/scripts/blurconsole.model.js +++ b/contrib/blur-console/ui/app/scripts/blurconsole.model.js @@ -20,8 +20,8 @@ blurconsole.model = (function() { poller : null }, stateMap = { - tableNameMap: {}, - nodeMap : {}, + tableNameMap: null, + nodeMap : null, queryPerformance : [], queries : {} }, @@ -29,9 +29,13 @@ blurconsole.model = (function() { tables, metrics, nodes, initModule, nodePoller, tablePoller, queryPerformancePoller, queryPoller; tables = (function() { - var getClusters, getEnabledTables, getDisabledTables; + var getClusters, getEnabledTables, getDisabledTables, isDataLoaded; getClusters = function() { + if (stateMap.tableNameMap == null) { + return []; + } + return blurconsole.utils.unique($.map(stateMap.tableNameMap, function(table){ return table.cluster; }), true); @@ -46,38 +50,35 @@ blurconsole.model = (function() { } }); - return { - cols : { - name : { - index : 1, - type : 'string' - }, - rowCount : { - index : 2, - type : 'number' - }, - recordCount : { - index : 3, - type : 'number' - } - }, - rows: data - }; + return data; }; getDisabledTables = function(cluster) { - console.log(cluster); + var data = []; + + $.each(stateMap.tableNameMap, function(idx, table) { + if (table.cluster === cluster && !table.enabled) { + data.push({name:table.name, rowCount:table.rows, recordCount:table.records}); + } + }); + + return data; + }; + + isDataLoaded = function() { + return stateMap.tableNameMap != null; }; return { getClusters : getClusters, getEnabledTables : getEnabledTables, - getDisabledTables : getDisabledTables + getDisabledTables : getDisabledTables, + isDataLoaded : isDataLoaded }; }()); nodes = (function() { - var getOfflineZookeeperNodes, getOfflineControllerNodes, getOfflineShardNodes; + var getOfflineZookeeperNodes, getOfflineControllerNodes, getOfflineShardNodes, isDataLoaded; getOfflineZookeeperNodes = function() { return stateMap.nodeMap.zookeepers.offline; @@ -98,10 +99,15 @@ blurconsole.model = (function() { return []; }; + isDataLoaded = function() { + return stateMap.nodeMap != null; + }; + return { getOfflineZookeeperNodes : getOfflineZookeeperNodes, getOfflineControllerNodes : getOfflineControllerNodes, - getOfflineShardNodes : getOfflineShardNodes + getOfflineShardNodes : getOfflineShardNodes, + isDataLoaded : isDataLoaded }; }()); @@ -189,7 +195,7 @@ blurconsole.model = (function() { getQueryLoadChartData = function() { var total = 0, - queryArray = [], + queryArray = [], meanArray = [], queryData, mean; @@ -241,14 +247,20 @@ blurconsole.model = (function() { }()); nodePoller = function() { - stateMap.nodeMap = configMap.poller.getNodeList(); - $.gevent.publish('node-status-updated'); + var tmpNodeMap = configMap.poller.getNodeList(); + if (!blurconsole.utils.equals(tmpNodeMap, stateMap.nodeMap)) { + stateMap.nodeMap = tmpNodeMap; + $.gevent.publish('node-status-updated'); + } setTimeout(nodePoller, 5000); }; tablePoller = function() { - stateMap.tableNameMap = configMap.poller.getTableList(); - $.gevent.publish('tables-updated'); + var tmpTableMap = configMap.poller.getTableList(); + if (!blurconsole.utils.equals(tmpTableMap, stateMap.tableNameMap)) { + stateMap.tableNameMap = tmpTableMap; + $.gevent.publish('tables-updated'); + } setTimeout(tablePoller, 5000); }; @@ -263,8 +275,11 @@ blurconsole.model = (function() { }; queryPoller = function() { - stateMap.queries = configMap.poller.getQueries(); - $.gevent.publish('queries-updated'); + var tmpQueries = configMap.poller.getQueries(); + if (!blurconsole.utils.equals(tmpQueries, stateMap.queries)) { + stateMap.queries = tmpQueries; + $.gevent.publish('queries-updated'); + } setTimeout(queryPoller, 5000); }; http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/5f504682/contrib/blur-console/ui/app/scripts/blurconsole.tables.js ---------------------------------------------------------------------- diff --git a/contrib/blur-console/ui/app/scripts/blurconsole.tables.js b/contrib/blur-console/ui/app/scripts/blurconsole.tables.js index fca683b..57193a0 100644 --- a/contrib/blur-console/ui/app/scripts/blurconsole.tables.js +++ b/contrib/blur-console/ui/app/scripts/blurconsole.tables.js @@ -18,10 +18,16 @@ blurconsole.tables = (function () { 'use strict'; var configMap = { view : 'views/tables.tpl.html', - tableSettings : { - pageSize : 500, - pageSizes : null - } + enabledDef : [ + {label:'Table Name', key:'name'}, + {label:'Row Count', key: 'rowCount'}, + {label:'Record Count', key: 'recordCount'}, + {label:'Actions', key: function(){ return ''; }} + ], + disabledDef : [ + {label:'Table Name', key:'name'}, + {label:'Actions', key: function(){ return ''; }} + ] }, stateMap = { $container : null }, jqueryMap = {}, @@ -91,16 +97,13 @@ blurconsole.tables = (function () { } $.each(clusters, function(idx, cluster){ - var clusterPane = $('#' + cluster + '_pane'), enabledSection, disabledSection; - clusterPane.find('.enabledSection').WATable({ - - }); - clusterPane.find('.disabledSection').WATable(); + var clusterPane = $('#' + cluster + '_pane'); + clusterPane.find('.enabledSection').html(blurconsole.browserUtils.table(configMap.enabledDef, blurconsole.model.tables.getEnabledTables(cluster))); + clusterPane.find('.disabledSection').html(blurconsole.browserUtils.table(configMap.enabledDef, blurconsole.model.tables.getDisabledTables(cluster))); }); }; updateTableList = function() { - console.log('Updating tables'); var clusters = blurconsole.model.tables.getClusters(); $.each(clusters, function(idx, cluster) { @@ -109,12 +112,10 @@ blurconsole.tables = (function () { disabledSection = clusterPane.find('.disabledSection'); if (enabledSection.length > 0) { - console.log(blurconsole.model.tables.getEnabledTables(cluster)); - console.log(enabledSection); - enabledSection.data('WATable').setData(blurconsole.model.tables.getEnabledTables(cluster), false, false); + enabledSection.html(blurconsole.browserUtils.table(configMap.enabledDef, blurconsole.model.tables.getEnabledTables(cluster))); } if (disabledSection.length > 0) { - disabledSection.data('WATable').setData(blurconsole.model.tables.getDisabledTables(cluster), false, false); + disabledSection.html(blurconsole.browserUtils.table(configMap.disabledDef, blurconsole.model.tables.getDisabledTables(cluster))); } }); }; http://git-wip-us.apache.org/repos/asf/incubator-blur/blob/5f504682/contrib/blur-console/ui/app/scripts/blurconsole.utils.js ---------------------------------------------------------------------- diff --git a/contrib/blur-console/ui/app/scripts/blurconsole.utils.js b/contrib/blur-console/ui/app/scripts/blurconsole.utils.js index fd12abf..726c303 100644 --- a/contrib/blur-console/ui/app/scripts/blurconsole.utils.js +++ b/contrib/blur-console/ui/app/scripts/blurconsole.utils.js @@ -15,7 +15,7 @@ limitations under the License. /*global blurconsole:false */ blurconsole.utils = (function(){ 'use strict'; - var inject, unique; + var inject, unique, equals; inject = function(collection, initial, block) { if (collection === null || collection.length === 0) { @@ -46,9 +46,14 @@ blurconsole.utils = (function(){ return uniqueList; }; + equals = function(obj1, obj2) { + return JSON.stringify(obj1) === JSON.stringify(obj2); + }; + return { inject: inject, reduce: inject, - unique: unique + unique: unique, + equals: equals }; }()); \ No newline at end of file
