add initial statistics ui

Change-Id: If8ab7eecf4dfcea3ded78b226b168ee4356cae44
Reviewed-on: http://review.couchbase.org/70461
Reviewed-by: Pavel Blagodov <[email protected]>
Tested-by: Pavel Blagodov <[email protected]>

priv/public/ui/app/app.js

@@ -25,7 +25,7 @@
 
     angular.element($window).on("storage", function (storage) {
       if (storage.key === "mnLogIn") {
-        $state.go("app.admin.overview");
+        $state.go("app.admin.overview.statistics");
       }
     });
 

priv/public/ui/app/app_config.js

@@ -5,6 +5,19 @@
     .module('app')
     .config(appConfig);
 
+  //https://github.com/angular-ui/ui-select/issues/1560
+  angular.module('ui.select').run(function($animate) {
+    var origEnabled = $animate.enabled
+    $animate.enabled = function (elem) {
+      if (arguments.length !== 1) {
+        return origEnabled.apply($animate, arguments);
+      } else if (origEnabled(elem)) {
+        return (/enable-ng-animation/).test(elem.classNames);
+      }
+      return false
+    }
+  });
+
   function appConfig($httpProvider, $stateProvider, $urlRouterProvider, $uibModalProvider, $transitionsProvider, $uibTooltipProvider, $animateProvider, $qProvider, $sceDelegateProvider) {
     $httpProvider.defaults.headers.common['invalid-auth-response'] = 'on';
     $httpProvider.defaults.headers.common['Cache-Control'] = 'no-cache';
@@ -40,7 +53,7 @@
     $urlRouterProvider.otherwise(function ($injector, $location) {
       $injector.get("mnPools").get().then(function (pools) {
         if (pools.isInitialized) {
-          return $injector.get("$state").go("app.admin.overview");
+          return $injector.get("$state").go("app.admin.overview.statistics");
         }
       });
       return true;

priv/public/ui/app/components/mn_filters.js

@@ -594,12 +594,14 @@
   function mnFormatServices() {
     return function (service) {
       switch (service) {
-        case 'kv': return 'Data';
-        case 'n1ql': return 'Query';
-        case 'index': return 'Index';
-        case 'fts': return 'Search';
-        case 'eventing': return 'Eventing';
-        case 'cbas': return 'Analytics';
+      case 'kv': return 'Data';
+      case 'query':
+      case 'n1ql': return 'Query';
+      case 'index': return 'Index';
+      case 'fts': return 'Search';
+      case 'eventing': return 'Eventing';
+      case 'cbas': return 'Analytics';
+      default: return service;
       }
     }
   }

priv/public/ui/app/components/mn_poll.js

@@ -34,14 +34,28 @@
     }
   }
 
-  function mnPollerFactory($q, $timeout, mnTasksDetails, mnPromiseHelper) {
+  function mnPollerFactory($q, $timeout, mnTasksDetails, mnPromiseHelper, $window) {
 
     function Poller(scope, request) {
       this.deferred = $q.defer();
       this.request = request;
       this.scope = scope;
+      var self = this;
+
+      scope.$on('$destroy', function () {
+        $window.removeEventListener('visibilitychange', onVisibilitychange);
+        self.onDestroy();
+      });
+
+      function onVisibilitychange() {
+        if (document.hidden) {
+          self.stop();
+        } else {
+          self.reload();
+        }
+      }
 
-      scope.$on('$destroy', this.stop.bind(this));
+      $window.addEventListener('visibilitychange', onVisibilitychange);
 
       this.latestResult = undefined;
       this.stopTimestamp = undefined;
@@ -60,9 +74,14 @@
     Poller.prototype.showSpinner = showSpinner;
     Poller.prototype.reload = reload;
     Poller.prototype.reloadOnScopeEvent = reloadOnScopeEvent;
+    Poller.prototype.onDestroy = onDestroy;
 
     return Poller;
 
+    function onDestroy() {
+      this.stop();
+    }
+
     function isStopped(startTimestamp) {
       return !(angular.isUndefined(this.stopTimestamp) || startTimestamp >= this.stopTimestamp);
     }
@@ -112,6 +131,11 @@
       return query;
     }
     function cycle() {
+      if (this.isLaunched) {
+        return this;
+      }
+
+      this.isLaunched = true;
       this.doCycle();
       return this;
     }
@@ -140,6 +164,7 @@
     }
     function stop() {
       var self = this;
+      self.isLaunched = false;
       self.stopTimestamp = new Date();
       $timeout.cancel(self.timeout);
     }

priv/public/ui/app/css/cbui-components.css

@@ -2292,3 +2292,11 @@ nav.nav-sidebar-hidden {
   content: '\007C';
   color: #d1d1d1;
 }
+
+.pipe:nth-child(2):before {
+  content: none !important;
+}
+
+.nvd3.nv-scatter.nv-single-point .nv-groups .nv-group .nv-point:not(.hover) {
+  fill-opacity: .0 !important;
+  stroke-opa

priv/public/ui/app/mn_admin/mn_admin.html

@@ -97,11 +97,11 @@
 </div>
 
 <header>
-  <a ui-sref="app.admin.overview" class="logobug-wrapper">
+  <a ui-sref="app.admin.overview.statistics" class="logobug-wrapper">
     <img src="../cb_logo_bug_white_2.svg" width="48" height="48" alt="Couchbase Server" class="logobug" title="Couchbase Server {{::adminCtl.implementationVersion | mnPrettyVersion}}">
   </a>
   <h1>
-    <a ui-sref="app.admin.overview" class="resp-txt-xsml ellipsis">
+    <a ui-sref="app.admin.overview.statistics" class="resp-txt-xsml ellipsis">
       {{adminCtl.tabName}} <!-- the cluster name -->
     </a>
     <span class="resp-hide-xsml" ng-show="adminCtl.tabName">
@@ -143,7 +143,7 @@ <h1>
 
     <a
       mn-tab="overview"
-      ui-sref="app.admin.overview"
+      ui-sref="app.admin.overview.statistics"
       ui-sref-active="currentnav">
       Dashboard
     </a>

priv/public/ui/app/mn_admin/mn_admin_config.js

@@ -9,6 +9,7 @@
     'mnPromiseHelper',
     'mnBuckets',
     'mnAnalytics',
+    'mnStatisticsNew',
     'mnLogs',
     'mnOverview',
     'mnIndexes',
@@ -81,6 +82,7 @@
       })
       .state('app.admin.overview', {
         url: '/overview',
+        abstract: true,
         views: {
           "[email protected]": {
             controller: 'mnOverviewController as overviewCtl',
@@ -202,6 +204,34 @@
       .state('app.admin.logs.collectInfo.form', {
         url: '/form',
         templateUrl: 'app/mn_admin/mn_logs/collect_info/mn_logs_collect_info_form.html'
+      })
+      .state('app.admin.overview.statistics', {
+        url: '/stats?zoom&scenario&scenarioBucket',
+        controller: 'mnStatisticsNewController as statisticsNewCtl',
+        templateUrl: 'app/mn_admin/mn_statistics/mn_statistics.html',
+        redirectTo: function (trans, permissions) {
+          var mnPermissionsService = trans.injector().get("mnPermissions");
+          var params = _.clone(trans.params(), true);
+          return mnPermissionsService.check().then(function (permissions) {
+            var statsRead = permissions.bucketNames['.stats!read']
+            if (!params.scenarioBucket && statsRead && statsRead[0]) {
+              params.scenarioBucket = statsRead[0];
+              return {state: "app.admin.overview.statistics", params: params};
+            }
+          });
+        },
+        params: {
+          scenarioBucket: {
+            value: null
+          },
+          scenario: {
+            value: null,
+            dynamic: true
+          },
+          zoom: {
+            value: null
+          }
+        }
       });
 
   addAnalyticsStates("app.admin.servers.list");

priv/public/ui/app/mn_admin/mn_admin_controller.js

@@ -87,7 +87,7 @@
       var etagPoller = new mnEtagPoller($scope, function (previous) {
         return mnPoolDefault.get({
           etag: previous ? previous.etag : "",
-          waitChange: $state.current.name === "app.admin.overview" ? 3000 : 10000
+          waitChange: $state.current.name === "app.admin.overview.statistics" ? 3000 : 10000
         }, {group: "global"});
       }).subscribe(function (resp, previous) {
         if (!_.isEqual(resp, previous)) {

priv/public/ui/app/mn_admin/mn_analytics/mn_analytics_service.js

@@ -75,8 +75,7 @@
         queries.push(isSpecificStat ? $q.when({
           data: resp.data.directory.value,
           origTitle: resp.data.directory.origTitle
-        }) : getStatsDirectory(resp.data.directory.url));
-
+        }) : getStatsDirectory("/pools/default/buckets//" + params.$stateParams.bucket + "/statsDirectory"));
         return $q.all(queries).then(function (data) {
           return prepareAnaliticsState(data, params);
         });
@@ -114,7 +113,14 @@
     function getStatsDirectory(url) {
       return $http({
         url: url,
-        method: 'GET'
+        method: 'GET',
+        params: {
+          adde: '"all"',
+          adda: '"all"',
+          addi: '"all"',
+          addf: '"all"',
+          addq: "1"
+        }
       });
     }
     function prepareAnaliticsState(data, params) {

priv/public/ui/app/mn_admin/mn_overview/mn_overview.html

@@ -139,6 +139,8 @@ <h3>{{overviewCtl.nodes.all.down.length || '0'}}</h3>
     </div>
   </div>
 
+  <div ui-view=""></div>
+
   <div class="content-box-dashboard max-width-12 margin-top-2 resp-wrap-med resp-med">
     <div
        class="column width-6">

priv/public/ui/app/mn_admin/mn_security/mn_user_roles/mn_user_roles_service.js

@@ -24,7 +24,10 @@
       getRolesGroupsState: getRolesGroupsState,
 
       ldapSettingsValidate: ldapSettingsValidate,
-      postLdapSettings: postLdapSettings
+      postLdapSettings: postLdapSettings,
+
+      getUserProfile: getUserProfile,
+      putUserProfile: putUserProfile
     };
 
     return mnUserRolesService;
@@ -45,6 +48,21 @@
       });
     }
 
+    function putUserProfile(data) {
+      $http.put("/settings/rbac/profiles/@self", JSON.stringify(data));
+    }
+
+    function getUserProfile() {
+      return $http.get("/settings/rbac/profiles/@self").then(function (resp) {
+        return resp.data;
+      }, function (resp) {
+        switch (resp.status) {
+        case "404":
+        default: return {scenarios: []};
+        }
+      });
+    }
+
     function getRoles() {
       return $http({
         method: "GET",