kylin-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From luke...@apache.org
Subject [26/50] [abbrv] incubator-kylin git commit: KYLIN-792 , add performance module
Date Tue, 21 Jul 2015 08:05:32 GMT
http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/index.html
----------------------------------------------------------------------
diff --git a/webapp/app/index.html b/webapp/app/index.html
index 6824498..f1087ed 100644
--- a/webapp/app/index.html
+++ b/webapp/app/index.html
@@ -30,20 +30,21 @@
     <!-- ref:css css/styles.min.<%= buildNumber %>.css -->
     <link rel="stylesheet" type="text/css" href="components/bootstrap/dist/css/bootstrap.min.css">
     <link rel="stylesheet" type="text/css" href="components/font-awesome/css/font-awesome.css">
-
+    <link rel="stylesheet" type="text/css" href="css/AdminLTE-fonts.css">
+    <link rel="stylesheet" type="text/css" href="components/ng-grid/ng-grid.css">
     <link rel="stylesheet" type="text/css" href="components/angular-tree-control/css/tree-control.css">
     <link rel="stylesheet" type="text/css" href="components/angular-tree-control/css/tree-control-attribute.css">
+    <link rel="stylesheet" type="text/css" href="components/animate.css/animate.css">
+
     <link rel="stylesheet" type="text/css" href="components/messenger/build/css/messenger.css">
     <link rel="stylesheet" type="text/css" href="components/messenger/build/css/messenger-theme-ice.css">
-    <link rel="stylesheet" type="text/css" href="components/ng-grid/ng-grid.css">
     <link rel="stylesheet" type="text/css" href="components/chosen/chosen.css">
     <link rel="stylesheet" type="text/css" href="components/angular-chosen-localytics/chosen-spinner.css">
-    <link rel="stylesheet" type="text/css" href="components/animate.css/animate.css">
     <link rel="stylesheet" type="text/css" href="components/nvd3/nv.d3.min.css">
-
-    <link rel="stylesheet" type="text/css" href="css/AdminLTE-fonts.css">
     <link rel="stylesheet" type="text/css" href="css/AdminLTE.css">
     <link rel="stylesheet" type="text/css" href="components/bootstrap-sweetalert/lib/sweet-alert.css">
+    <link rel="stylesheet" type="text/css" href="components/angular-busy/dist/angular-busy.css">
+
 
     <link rel="stylesheet/less" href="less/build.less">
     <!-- endref -->
@@ -93,7 +94,7 @@
 
 <script src="components/moment/moment.js"></script>
 <script src="components/d3/d3.min.js"></script>
-<script src="components/nvd3/nv.d3.min.js"></script>
+<script src="components/nvd3/nv.d3.js"></script>
 <script src="components/angularjs-nvd3-directives/dist/angularjs-nvd3-directives.js"></script>
 <script src="components/bootstrap-sweetalert/lib/sweet-alert.js"></script>
 <script src="components/angular-sweetalert/SweetAlert.js"></script>
@@ -101,6 +102,7 @@
 <script src="components/angular-underscore/angular-underscore.js"></script>
 <script src="components/jquery-ui/jquery-ui.min.js"></script>
 <script src="components/angular-ui-sortable/sortable.js"></script>
+<script src="components/angular-busy/dist/angular-busy.js"></script>
 
 <script src="js/app.js"></script>
 <script src="js/config.js"></script>
@@ -127,6 +129,7 @@
 <script src="js/services/tree.js"></script>
 <script src="js/services/users.js"></script>
 <script src="js/services/ngLoading.js"></script>
+<script src="js/services/dashboard.js"></script>
 
 <script src="js/model/cubeConfig.js"></script>
 <script src="js/model/jobConfig.js"></script>
@@ -157,6 +160,7 @@
 <script src="js/controllers/cubeFilter.js"></script>
 <script src="js/controllers/cubeRefresh.js"></script>
 <script src="js/controllers/cubeAdvanceSetting.js"></script>
+<script src="js/controllers/dashboard.js"></script>
 <!-- endref -->
 
 <!-- ref:remove -->

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/js/app.js
----------------------------------------------------------------------
diff --git a/webapp/app/js/app.js b/webapp/app/js/app.js
index 59d679e..ba288cb 100644
--- a/webapp/app/js/app.js
+++ b/webapp/app/js/app.js
@@ -17,4 +17,4 @@
  */
 
 //Kylin Application Module
-KylinApp = angular.module('kylin', ['ngRoute', 'ngResource', 'ngGrid', 'ui.bootstrap', 'ui.ace',
'base64', 'angularLocalStorage', 'localytics.directives', 'treeControl', 'nvd3ChartDirectives',
'ngLoadingRequest', 'oitozero.ngSweetAlert', 'ngCookies', 'angular-underscore', 'ngAnimate',
'ui.sortable']);
+KylinApp = angular.module('kylin', ['ngRoute', 'ngResource', 'ngGrid', 'ui.bootstrap', 'ui.ace',
'base64', 'angularLocalStorage', 'localytics.directives', 'treeControl', 'nvd3ChartDirectives',
'ngLoadingRequest', 'oitozero.ngSweetAlert', 'ngCookies', 'angular-underscore', 'ngAnimate',
'ui.sortable',,'cgBusy']);

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/js/controllers/dashboard.js
----------------------------------------------------------------------
diff --git a/webapp/app/js/controllers/dashboard.js b/webapp/app/js/controllers/dashboard.js
new file mode 100644
index 0000000..40b7b8e
--- /dev/null
+++ b/webapp/app/js/controllers/dashboard.js
@@ -0,0 +1,237 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you 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.
+ */
+
+'use strict';
+
+KylinApp.controller('DashBoardCtrl', function ($scope, DashBoardService, $log, $q) {
+
+
+    $scope.stastic = {
+        countUser: 0,
+        last30DayPercentile: 0,
+        cubeStorage: 0,
+        avgDayQuery: 0,
+        cubesCount: 0
+    }
+
+    $scope.eachDayPercentileData=[];
+
+
+    $scope.reduceCubeSourceTicks=false;
+
+    // each day percentile chart
+    $scope.cubeInfo = function () {
+      var cubeSourceRecords ={"key":"Cube Source Records","values":[],"sizes":[]};
+      $scope.cubeInfoPromise = DashBoardService.listCubes({},
+            function (data) {
+                if(data.length>30){
+                    $scope.reduceCubeSourceTicks=true;
+                }
+                for (var i = 0; i < data.length; i++) {
+                  cubeSourceRecords.values.push([data[i].name,parseInt(data[i].input_records_count)]);
+                  cubeSourceRecords.sizes.push((data[i].size_kb));
+                   $log.info(data[i]);
+                }
+              $scope.cubeUsageData = [cubeSourceRecords];
+
+            }, function (result) {
+                $log.error(result);
+            }).$promise;
+    }();
+
+
+    $scope.cubeSourceYAxisTickFormat = function(){
+        return d3.format('0');
+    }
+
+    $scope.avgDayQuery = function () {
+        $scope.avgDayQueryPromise = DashBoardService.avgDayQuery({},
+            function (data) {
+                if (!isNaN(data[0][0])) {
+                    $scope.stastic.avgDayQuery = Math.round(data[0][0]);
+                } else {
+                    $log.info("No data available.");
+                }
+                $log.info("avg day query:" + data);
+            }, function (result) {
+                $log.error(result);
+            }).$promise;
+    }();
+
+    $scope.totalQueryUser = function () {
+        $scope.queryUserPromise = DashBoardService.totalQueryUser({},
+            function (data) {
+                if (!isNaN(data[0][0])) {
+                    $scope.stastic.userCount = data[0][0];
+                } else {
+                    $log.info("No data available.");
+                }
+
+                $log.info("total query user:" + data);
+            }, function (result) {
+                $log.error(result);
+            }).$promise;
+    }();
+
+    $scope.last30DayPercentile = function () {
+        $scope.last30DayPercentilePromise = DashBoardService.last30DayPercentile({},
+            function (data) {
+                if (!isNaN(data[0][0])) {
+                    $scope.stastic.last30DayPercentile = Math.round(data[0][0] * 100) / 100;
+                } else {
+                    $log.info("No data available.");
+                }
+                $log.info("last 30 Day 90th Percentile:" + data);
+            }, function (result) {
+                $log.error(result);
+            }).$promise;
+    }();
+
+
+  //daily query num
+  $scope.dailyQueryData = [];
+
+
+  // last 30 days
+  $scope.dailyQueryCount = function () {
+    var queryCount ={"key":"Query Count","bar":true,"values":[]};
+    $scope.dailyQueryCountPromise = DashBoardService.dailyQueryCount({},
+      function (data) {
+        for (var i = 0; i < data.length; i++) {
+          $scope.dailyQueryData.push(parseInt(data[i][1]));
+          queryCount.values.push([new Date(data[i][0]).getTime()/1000,data[i][1]]);
+        }
+        console.log("daily query count");
+        $scope.eachDayPercentileData.push(queryCount);
+      }, function (result) {
+        $log.error(result);
+      }).$promise;
+  };
+
+    $scope.eachDayPercentile = function () {
+        var percenTile90 ={"key":"90%-ile","values":[]},percenTile95 = {"key":"95%-ile","values":[]},queryCount
={"key":"Query Count","bar":true,"values":[]};;
+        $scope.eachDayPercentilePromise = DashBoardService.eachDayPercentile({},
+            function (data) {
+                for (var i = 0; i < data.length; i++) {
+                    var _latency90 = data[i][1].split(",")[0].substr(1);
+                    var _latency95 = data[i][1].split(",")[1].substr(0, data[i][1].length
- 1);
+                    var _querycount = data[i][2];
+                    percenTile90.values.push([new Date(data[i][0]).getTime()/1000,Math.round(parseFloat(_latency90)
* 100) / 100]);
+                    percenTile95.values.push([new Date(data[i][0]).getTime()/1000,Math.round(parseFloat(_latency95)
* 100) / 100]);
+                    queryCount.values.push([new Date(data[i][0]).getTime()/1000,Math.round(parseInt(_querycount)
* 100) / 100]);
+                }
+                 $scope.eachDayPercentileData=[percenTile90,percenTile95,queryCount];
+             }, function (result) {
+                $log.error(result);
+            }).$promise;
+    }();
+
+
+  $scope.dailyLatencyReportRightYaxis = function(){
+    return "Query Latency";
+  }
+
+  $scope.xAxisTickFormatFunction = function(){
+    return function(d){
+      return d3.time.format('%Y-%m-%d')(moment.unix(d).toDate());
+    }
+  };
+
+
+    $scope.legendColorFunction = function(){
+        return function(d){
+            return '#E01B5D';
+        }
+    };
+
+
+    $scope.reduceProjectPercentileTicks=false;
+
+    $scope.projectPercentile = function () {
+
+        var percenTile90 ={"key":"90%-ile","values":[]},percenTile95 = {"key":"95%-ile","values":[]};
+
+
+        $scope.projectPercentilePromise = DashBoardService.projectPercentile({},
+            function (data) {
+                if(data.length>30){
+                    $scope.reduceProjectPercentileTicks=true;
+                }
+                for (var i = 0; i < data.length; i++) {
+
+                    var _latency90 = data[i][1].split(",")[0].substr(1);
+                    var _latency95 = data[i][1].split(",")[1].substr(0, data[i][1].length
- 1);
+                    percenTile90.values.push([data[i][0],Math.round(parseFloat(_latency90)
* 100) / 100]);
+                    percenTile95.values.push([data[i][0],Math.round(parseFloat(_latency95)
* 100) / 100]);
+
+                }
+                $scope.eachProjectPercentileData=[percenTile90,percenTile95];
+            }, function (result) {
+                $log.error(result);
+            }).$promise;
+    }();
+
+  $scope.projectPercentileToolTipContentFunction = function(key, x, y, e, graph) {
+    return '<table>'+'<tr>'+'<td>'+'<strong>Latency</strong>'+'</td>'+'<td>'+'
: '+y+'(S)'+'</td>'+'</tr>'+'<tr>'+'<td>'+'<strong>Percentile</strong>'+'</td>'+'<td>'+'
: '+key+'</td>'+'</tr>'+'<tr>'+'<td>'+'<strong>Project</strong>'+'</td>'+'<td>'+'
: '+x+'</td>'+'</tr>'+'</table>';
+
+  }
+
+  $scope.dailyPercentileToolTip = function(key, x, y, e, graph) {
+      var suffix ='';
+      if(key.indexOf('ile')!=-1){
+          suffix = '(S)';
+      }
+      return '<table>'+'<tr>'+'<td>'+'<strong>'+key+'</strong>'+'</td>'+'<td>'+'
: '+y+suffix+'</td>'+'</tr>'+'<tr>'+'<td>'+'<strong>Date</strong>'+'</td>'+'<td>'+'
: '+x+'</td>'+'</tr>'+'</table>';
+
+  }
+  $scope.cubeToolTipContentFunction = function(key, x, y, e, graph) {
+    return '<table>'+'<tr>'+'<td>'+'<strong>Source Records</strong>'+'</td>'+'<td>'+'
: '+parseInt(y)+'</td>'+'</tr>'+'<tr>'+'<td>'+'<strong>Source
Size</strong>'+'</td>'+'<td>'+' : '+$scope.dataSize(e.series.sizes[e.pointIndex]*1024)+'</td>'+'</tr>'+'<tr>'+'<td>'+'<strong>Cube
Name</strong>'+'</td>'+'<td>'+' : '+x+'</td>'+'</tr>'+'</table>';
+  }
+
+  $scope.commonToolTipContentFunction = function(key, x, y, e, graph) {
+    return '<p>' +  x +':'+y+ '</p>';
+  }
+
+    $scope.cubesStorage = function () {
+        $scope.cubesStoragePromise = DashBoardService.cubesStorage({},
+            function (cubes) {
+                $scope.stastic.cubesCount = cubes.length;
+                var _cubeStorage = $scope.getTotalSize(cubes);
+                $scope.stastic.cubeStorage = _cubeStorage;
+            }, function (result) {
+                $log.error(result);
+            }).$promise;
+    }();
+
+    $scope.getTotalSize = function (cubes) {
+        var size = 0;
+        if (!cubes) {
+            return 0;
+        }
+        else {
+            for (var i = 0; i < cubes.length; i++) {
+                size += cubes[i].size_kb;
+            }
+            return $scope.dataSize(size * 1024);
+        }
+    };
+
+});
+
+
+

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/js/services/dashboard.js
----------------------------------------------------------------------
diff --git a/webapp/app/js/services/dashboard.js b/webapp/app/js/services/dashboard.js
new file mode 100644
index 0000000..f5b1454
--- /dev/null
+++ b/webapp/app/js/services/dashboard.js
@@ -0,0 +1,32 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you 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.
+ */
+
+KylinApp.factory('DashBoardService', ['$resource', function ($resource, config) {
+    return $resource(Config.service.url + 'performance/:action', {}, {
+//        avgCubeLatency: {method: 'GET', params: {action: 'avgCubeLatency'}, isArray: true},
+        avgDayQuery: {method: 'GET', params: {action: 'avgDayQuery'}, isArray: true},
+        dailyQueryCount: {method: 'GET', params: {action: 'dailyQueryCount'}, isArray: true},
+        eachDayPercentile: {method: 'GET', params: {action: 'eachDayPercentile'}, isArray:
true}, // last 30 day 90,95 percentile for each day
+        projectPercentile: {method: 'GET', params: {action: 'projectPercentile'}, isArray:
true}, // last 30 day 90,95 percentile for each project
+        cubesStorage: {method: 'GET', params: {action: 'cubesStorage'}, isArray: true},
+        last30DayPercentile: {method: 'GET', params: {action: 'last30DayPercentile'}, isArray:
true},//90th percentile of last 30 day
+        totalQueryUser: {method: 'GET', params: {action: 'totalQueryUser'}, isArray: true},
+        listCubes: {method: 'GET', params: {action: 'listCubes'}, isArray: true}
+    });
+}])
+;

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/js/services/users.js
----------------------------------------------------------------------
diff --git a/webapp/app/js/services/users.js b/webapp/app/js/services/users.js
index d05ca94..891ad89 100644
--- a/webapp/app/js/services/users.js
+++ b/webapp/app/js/services/users.js
@@ -49,9 +49,16 @@ KylinApp.service('UserService', function ($http, $q) {
     var homePage = "/login";
 
     if (curUser.userDetails && curUser.userDetails.authorities) {
-      angular.forEach(curUser.userDetails.authorities, function (authority, index) {
-        homePage = (!!roles[authority.authority]) ? roles[authority.authority] : homePage;
-      });
+       var authorities = curUser.userDetails.authorities;
+       for(var i=0;i<authorities.length;i++){
+           if(authorities[i].authority==="ROLE_ADMIN"){
+               homePage = roles[authorities[i].authority];
+               break;
+           }else{
+               homePage = roles[authorities[i].authority]
+           }
+       }
+
     }
 
     return homePage;

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/less/app.less
----------------------------------------------------------------------
diff --git a/webapp/app/less/app.less b/webapp/app/less/app.less
index 162c929..4edf83c 100644
--- a/webapp/app/less/app.less
+++ b/webapp/app/less/app.less
@@ -605,3 +605,20 @@ ul.messenger .messenger-message-inner ,.ngCellText{
   max-height: 300px;
   overflow-y: auto;
 }
+
+.dashboard_wrapper{
+  min-height: 100%;
+  background-color: #ecf0f5;
+  z-index: 800;
+}
+
+
+.size-h1{font-size:36px}
+.size-h2{font-size:30px}
+.size-h3{font-size:24px}
+.size-h4{font-size:18px}
+
+.text-muted {
+  color: #777;
+}
+.tick line {display: none;}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/partials/admin/admin.html
----------------------------------------------------------------------
diff --git a/webapp/app/partials/admin/admin.html b/webapp/app/partials/admin/admin.html
index c17aba4..c7b23f0 100644
--- a/webapp/app/partials/admin/admin.html
+++ b/webapp/app/partials/admin/admin.html
@@ -71,6 +71,9 @@
             <a class="label-lg label-yellow arrowed-right"style="font-size:18px;" tooltip="Cluster
Resource Monitoring" href="{{config.reference_links['hadoop'].link}}" >
                 Hadoop Monitor
             </a>
+            <a href="dashboard">
+                Dashboard
+            </a>
         </div>
     </div>
 </div>

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/partials/dashboard.html
----------------------------------------------------------------------
diff --git a/webapp/app/partials/dashboard.html b/webapp/app/partials/dashboard.html
new file mode 100644
index 0000000..acccfe4
--- /dev/null
+++ b/webapp/app/partials/dashboard.html
@@ -0,0 +1,228 @@
+<!--
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+-->
+<div class="wrapper">
+  <aside class="main-sidebar" style="padding-top:0px !important;">
+    <!-- sidebar: style can be found in sidebar.less -->
+    <section class="sidebar" style="height: auto;">
+
+    </section>
+    <!-- /.sidebar -->
+  </aside>
+
+  <div class="content-wrapper" style="min-height: 800px;">
+
+    <section class="content-header">
+      <h1>
+        Dashboard
+        <small></small>
+      </h1>
+    </section>
+
+    <section class="content">
+      <!-- Info boxes -->
+      <div class="row">
+        <div class="col-md-3 col-sm-6 col-xs-12">
+          <div class="info-box">
+            <span class="info-box-icon bg-aqua"><i class="fa fa-users"></i></span>
+
+            <div class="info-box-content" cg-busy="{promise:queryUserPromise,message:'Loading...'}">
+              <span class="info-box-number size-h2 text-muted">{{stastic.userCount}}</span>
+              <span class="info-box-text size-h4 text-muted">Users</span>
+            </div>
+            <!-- /.info-box-content -->
+          </div>
+          <!-- /.info-box -->
+        </div>
+        <!-- /.col -->
+        <div class="col-md-3 col-sm-6 col-xs-12">
+          <div class="info-box">
+            <span class="info-box-icon bg-red"><i class="fa fa-eye"></i></span>
+
+            <div class="info-box-content" cg-busy="{promise:last30DayPercentilePromise,message:'Loading...'}">
+              <span class="info-box-number size-h2 text-muted">{{stastic.last30DayPercentile}}
S</span>
+              <span class="info-box-text size-h4 text-muted">90%-ile Latency (last
30 days)</span>
+            </div>
+            <!-- /.info-box-content -->
+          </div>
+          <!-- /.info-box -->
+        </div>
+        <!-- /.col -->
+
+        <div class="col-md-3 col-sm-6 col-xs-12">
+          <div class="info-box">
+            <span class="info-box-icon bg-green"><i class="fa fa-database"></i></span>
+
+            <div class="info-box-content" cg-busy="{promise:cubesStoragePromise,message:'Loading...'}">
+              <span class="info-box-number size-h2 text-muted">{{stastic.cubeStorage}}</span>
+              <span class="info-box-text size-h4 text-muted">Storage</span>
+            </div>
+            <!-- /.info-box-content -->
+          </div>
+          <!-- /.info-box -->
+        </div>
+        <!-- /.col -->
+        <div class="col-md-3 col-sm-6 col-xs-12">
+          <div class="info-box">
+            <span class="info-box-icon bg-yellow"><i class="fa fa-cubes"></i></span>
+
+            <div class="info-box-content" cg-busy="{promise:cubesStoragePromise,message:'Loading...'}">
+              <span class="info-box-number size-h2 text-muted">{{stastic.cubesCount}}</span>
+              <span class="info-box-text size-h4 text-muted">Cubes</span>
+            </div>
+            <!-- /.info-box-content -->
+          </div>
+          <!-- /.info-box -->
+        </div>
+        <!-- /.col -->
+      </div>
+      <!-- /.row -->
+
+      <div class="row" ng-controller="DashBoardCtrl">
+        <div class="col-md-12">
+          <div class="box">
+            <div class="box-header with-border">
+              <h3 class="box-title">Query Latency (last 30 days)</h3>
+            </div>
+            <!-- /.box-header -->
+            <div class="box-body">
+
+
+              <div class="row">
+                <div class="col-md-12">
+                  <p class="text-center">
+                    <strong></strong>
+                  </p>
+
+
+                        <!-- Sales Chart Canvas -->
+                        <!--<div cg-busy="{promise:queryCountDailyPercentilePromise,message:'Loading...'}">-->
+                        <div cg-busy="[eachDayPercentilePromise]">
+
+                            <nvd3-line-plus-bar-chart
+                                    data="eachDayPercentileData"
+                                    objectequality="true"
+                                    margin="{left:100,top:10,bottom:20,right:100}"
+                                    showXAxis="true"
+                                    showYAxis="true"
+                                    y1AxisLabel="Query Count"
+                                    y2AxisLabel="Query Latency(seconds)"
+                                    forceY="[0]"
+                                    height="400"
+                                    xaxisrotatelabels="-45"
+                                    tooltips="true"
+                                    useInteractiveGuideline="true"
+                                    showLegend="true"
+                                    legendWidth="200"
+                                    legendHeight="100"
+                                    xAxisTickFormat="xAxisTickFormatFunction()"
+                                    interactive="true"
+                                    tooltipcontent="dailyPercentileToolTip"
+                                    >
+                              <svg></svg>
+                            </nvd3-line-plus-bar-chart>
+                        </div>
+                  <!-- /.chart-responsive -->
+                </div>
+                <!-- /.col -->
+              </div>
+              <!-- /.row -->
+
+              <div class="row">
+                <div class="col-md-6">
+                  <div class="box">
+                    <div class="box-header with-border">
+                      <h3 class="box-title">Cube Source</h3>
+                    </div>
+                    <div class="box-body">
+                        <!-- Sales Chart Canvas -->
+                        <div cg-busy="{promise:cubeInfoPromise}">
+                        <nvd3-multi-bar-chart
+                          margin="{left:100,top:10,bottom:100,right:60}"
+                          data="cubeUsageData"
+                          objectequality="true"
+                          height="350"
+                          showXAxis="true"
+                          reducexticks="{{reduceCubeSourceTicks}}"
+                          xaxisrotatelabels="-45"
+                          showYAxis="true"
+                          forceY="[0]"
+                          xAxisLabel="Cube Name"
+                          yAxisLabel="Cube Source Records"
+                          showLegend="true"
+                          tooltips="true"
+                          legendWidth="200"
+                          legendHeight="100"
+                          tooltips="true"
+                          yAxisTickFormat="cubeSourceYAxisTickFormat()"
+                          tooltipcontent="cubeToolTipContentFunction"
+                          >
+                          <svg></svg>
+                        </nvd3-multi-bar-chart>
+                          </div>
+                    </div>
+                  </div>
+                </div>
+
+                <div class="col-md-6">
+                  <div class="box">
+                    <div class="box-header with-border">
+                      <h3 class="box-title">Project Latency (last 30 days)</h3>
+                    </div>
+                    <div class="box-body">
+                        <!-- Sales Chart Canvas -->
+                        <div cg-busy="{promise:projectPercentilePromise}">
+                          <nvd3-multi-bar-chart
+                            margin="{left:100,top:10,bottom:100,right:60}"
+                            data="eachProjectPercentileData"
+                            objectequality="true"
+                            height="350"
+                            showXAxis="true"
+                            xAxisLabel="Project Name"
+                            reducexticks="{{reduceProjectPercentileTicks}}"
+                            xaxisrotatelabels="-45"
+                            showYAxis="true"
+                            yAxisLabel="Query Latency(seconds)"
+                            showLegend="true"
+                            legendWidth="200"
+                            legendHeight="100"
+                            tooltips="true"
+                            tooltipcontent="projectPercentileToolTipContentFunction"
+                            >
+                            <svg></svg>
+                          </nvd3-multi-bar-chart>
+
+                        </div>
+                    </div>
+                  </div>
+
+
+                </div>
+              </div>
+
+
+            </div>
+            <!-- ./box-body -->
+          </div>
+          <!-- /.box -->
+        </div>
+        <!-- /.col -->
+      </div>
+      <!-- /.row -->
+    </section>
+  </div>
+</div>

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/partials/header.html
----------------------------------------------------------------------
diff --git a/webapp/app/partials/header.html b/webapp/app/partials/header.html
index eb94664..74e03a0 100644
--- a/webapp/app/partials/header.html
+++ b/webapp/app/partials/header.html
@@ -26,7 +26,7 @@
                     <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                 </button>
-                <a class="navbar-brand" style="padding: 2px 10px 0px 0px"><img src="image/logo.png"
height="40px" width="40px"/><small> Kylin </small></a>
+                <a class="navbar-brand" style="padding: 2px 10px 0px 0px;"><img
src="image/logo.png" height="40px" width="40px"/><small> Kylin </small></a>
             </div>
 
             <div class="navbar-collapse collapse" collapse="isCollapsed">

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/app/routes.json
----------------------------------------------------------------------
diff --git a/webapp/app/routes.json b/webapp/app/routes.json
index 9f13c70..6401528 100644
--- a/webapp/app/routes.json
+++ b/webapp/app/routes.json
@@ -1,5 +1,12 @@
 [
     {
+      "url": "/dashboard",
+      "params": {
+        "templateUrl": "partials/dashboard.html",
+        "controller": "DashBoardCtrl"
+      }
+    },
+    {
         "url": "/cubes",
         "params": {
             "templateUrl": "partials/cubes/cubes.html",

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/bower.json
----------------------------------------------------------------------
diff --git a/webapp/bower.json b/webapp/bower.json
index 298cba3..f9d99fb 100755
--- a/webapp/bower.json
+++ b/webapp/bower.json
@@ -19,7 +19,7 @@
     "moment": "2.5.1",
     "d3": "3.4.4",
     "nvd3": "1.1.15-beta",
-    "angularjs-nvd3-directives": "0.0.5-beta",
+    "angularjs-nvd3-directives": "0.0.7",
     "angular-sweetalert": "~1.0.3",
     "bootstrap-sweetalert": "~0.4.3",
     "angular-underscore": "~0.5.0",
@@ -27,8 +27,8 @@
     "underscore": "~1.7.0",
     "fuelux": "~3.5.1",
     "angular-animate": "1.2",
-    "angular-cookies":"1.2"
-
+    "angular-cookies": "1.2",
+    "angular-busy": "~4.0"
   },
   "devDependencies": {
     "less.js": "~1.4.0",
@@ -39,9 +39,9 @@
     "nvd3": "1.1.15-beta",
     "d3": "3.4.4",
     "moment": "2.4.0",
+    "angular-busy": "~4.0",
     "angular-resource": "1.2.15",
-    "angularLocalStorage": "0.1.7",
     "angular-cookies": "~1.2.0-rc.2",
-    "angular-animate": "1.2"
+    "angular-animate": "~1.2"
   }
 }

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/a935c7ba/webapp/grunt.json
----------------------------------------------------------------------
diff --git a/webapp/grunt.json b/webapp/grunt.json
index 9a4499f..fa272c9 100755
--- a/webapp/grunt.json
+++ b/webapp/grunt.json
@@ -40,6 +40,7 @@
                 "app/components/angular-underscore/angular-underscore.js",
                 "app/components/jquery-ui/jquery-ui.min.js",
                 "app/components/angular-ui-sortable/sortable.js",
+                "app/components/angular-busy/dist/angular-busy.js",
                 "tmp/js/scripts.js"
             ],
             "dest": "tmp/js/scripts.min.js"
@@ -60,6 +61,7 @@
                 "app/components/nvd3/nv.d3.min.css",
                 "app/css/AdminLTE.css",
                 "app/components/bootstrap-sweetalert/lib/sweet-alert.css",
+                "app/components/angular-busy/dist/angular-busy.css",
                 "tmp/css/styles.css"
             ],
             "dest": "tmp/css/styles.min.css"


Mime
View raw message