瀏覽代碼

[security] Support for hive tree linking

Enrico Berti 11 年之前
父節點
當前提交
386556083e
共有 2 個文件被更改,包括 113 次插入73 次删除
  1. 52 47
      apps/security/src/security/templates/hive.mako
  2. 61 26
      apps/security/static/js/hive.ko.js

+ 52 - 47
apps/security/src/security/templates/hive.mako

@@ -78,8 +78,8 @@ ${ layout.menubar(section='hive') }
       <div class="sidebar-nav">
       <div class="sidebar-nav">
         <ul class="nav nav-list">
         <ul class="nav nav-list">
           <li class="nav-header">${ _('Privileges') }</li>
           <li class="nav-header">${ _('Privileges') }</li>
-          <li class="active"><a href="#edit"><i class="fa fa-sitemap  fa-rotate-270"></i> ${ _('Browse') }</a></li>
-          <li><a href="#roles"><i class="fa fa-cubes"></i> ${ _('Roles') }</a></li>
+          <li class="active"><a href="javascript:void(0)" data-toggleSection="edit"><i class="fa fa-sitemap  fa-rotate-270"></i> ${ _('Browse') }</a></li>
+          <li><a href="javascript:void(0)" data-toggleSection="roles"><i class="fa fa-cubes"></i> ${ _('Roles') }</a></li>
           <li class="nav-header"><i class="fa fa-group"></i> ${ _('Groups') }
           <li class="nav-header"><i class="fa fa-group"></i> ${ _('Groups') }
             </br>
             </br>
             <input type="checkbox" checked> All
             <input type="checkbox" checked> All
@@ -281,53 +281,58 @@ ${ tree.import_templates(itemClick='$root.assist.setPath', iconClick='$root.assi
 <script src="/security/static/js/hive.ko.js" type="text/javascript" charset="utf-8"></script>
 <script src="/security/static/js/hive.ko.js" type="text/javascript" charset="utf-8"></script>
 
 
 
 
-<script type="text/javascript" charset="utf-8">
-  var viewModel = new HiveViewModel(${ initial | n,unicode });
-  ko.applyBindings(viewModel);
-
-  $(document).ready(function () {
-    viewModel.init();
-
-    function resizeComponents () {
-      $("#path").width($(".tree-toolbar").width() - 64);
-      $("#hdfsTree").height($(window).height() - 260);
-      $(".acl-panel-content").height($(window).height() - 260);
-    }
-
-    resizeComponents();
-
-    function showMainSection(mainSection) {
-    if ($("#" + mainSection).is(":hidden")) {
-      $(".mainSection").hide();
-      $("#" + mainSection).show();
-      highlightMainMenu(mainSection);
-    }
-
-    logGA(mainSection);
-  }
-
-  function highlightMainMenu(mainSection) {
-    $(".nav.nav-list li").removeClass("active");
-    $("a[href='#" + mainSection + "']").parent().addClass("active");
-  }
-
-  routie({
-    "edit": function () {
-      showMainSection("edit");
-    },
-    "roles": function () {
-      showMainSection("roles");
-    },
-    "privileges": function () {
-      showMainSection("privileges");
-    },
-    "view": function () {
-      showMainSection("view");
-    }
-  });
-  });
+  <script type="text/javascript" charset="utf-8">
+    var viewModel = new HiveViewModel(${ initial | n,unicode });
+    ko.applyBindings(viewModel);
 
 
+    $(document).ready(function () {
 
 
+      var _initialPath = "";
+      if (window.location.hash != "") {
+        _initialPath = window.location.hash.substr(1);
+      }
+      viewModel.init(_initialPath);
+
+      function resizeComponents() {
+        $("#path").width($(".tree-toolbar").width() - 64);
+        $("#hdfsTree").height($(window).height() - 260);
+        $(".acl-panel-content").height($(window).height() - 260);
+      }
+
+      resizeComponents();
+
+      function showMainSection(mainSection) {
+        console.log("show", mainSection)
+        if ($("#" + mainSection).is(":hidden")) {
+          $(".mainSection").hide();
+          $("#" + mainSection).show();
+          highlightMainMenu(mainSection);
+        }
+
+        logGA(mainSection);
+      }
+
+      function highlightMainMenu(mainSection) {
+        $(".nav.nav-list li").removeClass("active");
+        $("a[data-toggleSection='" + mainSection + "']").parent().addClass("active");
+      }
+
+      $("[data-toggleSection]").on("click", function(){
+        showMainSection($(this).attr("data-toggleSection"));
+      });
+
+      var _resizeTimeout = -1;
+      $(window).resize(function(){
+        window.clearTimeout(_resizeTimeout);
+        _resizeTimeout = window.setTimeout(resizeComponents, 100);
+      });
+
+      window.onpopstate = function() {
+        viewModel.assist.path(window.location.hash.substr(1));
+      };
+
+
+    });
 </script>
 </script>
 
 
 ${ commonfooter(messages) | n,unicode }
 ${ commonfooter(messages) | n,unicode }

+ 61 - 26
apps/security/static/js/hive.ko.js

@@ -189,9 +189,10 @@ var Assist = function (vm) {
     return 0;
     return 0;
   }
   }
 
 
-  self.path = ko.observable('');
-  self.path.subscribe(function () {
-    self.fetchHivePath();
+  self.path = ko.observable("");
+  self.path.subscribe(function (path) {
+    //self.fetchHivePath();
+    window.location.hash = path;
   });
   });
   self.server = ko.observable('');
   self.server = ko.observable('');
   self.db = ko.computed(function () {
   self.db = ko.computed(function () {
@@ -225,7 +226,7 @@ var Assist = function (vm) {
 
 
   self.growingTree = ko.observable(jQuery.extend(true, {}, self.initialGrowingTree));
   self.growingTree = ko.observable(jQuery.extend(true, {}, self.initialGrowingTree));
 
 
-  self.addDatabases = function (databases) {
+  self.addDatabases = function (path, databases, skipLoading) {
     var _tree = self.growingTree();
     var _tree = self.growingTree();
     databases.forEach(function (db) {
     databases.forEach(function (db) {
       var _mainFound = false;
       var _mainFound = false;
@@ -247,20 +248,22 @@ var Assist = function (vm) {
         _tree.nodes.push(_item);
         _tree.nodes.push(_item);
       }
       }
     });
     });
-    self.loadData(self.growingTree());
+    if (typeof skipLoading == "undefined" || !skipLoading){
+      self.loadData(self.growingTree());
+    }
   }
   }
 
 
-  self.addTables = function (tables) {
+  self.addTables = function (path, tables, skipLoading) {
     var _branch = self.growingTree();
     var _branch = self.growingTree();
     _branch.nodes.forEach(function (node) {
     _branch.nodes.forEach(function (node) {
-      if (node.path == self.path()) {
+      if (node.path == path) {
         _branch = node;
         _branch = node;
       }
       }
     });
     });
 
 
     tables.forEach(function (table) {
     tables.forEach(function (table) {
       var _mainFound = false;
       var _mainFound = false;
-      var _path = self.path() + "." + table;
+      var _path = path + "." + table;
       _branch.nodes.forEach(function (node) {
       _branch.nodes.forEach(function (node) {
         if (node.path == _path) {
         if (node.path == _path) {
           _mainFound = true;
           _mainFound = true;
@@ -279,16 +282,18 @@ var Assist = function (vm) {
         _branch.nodes.push(_item);
         _branch.nodes.push(_item);
       }
       }
     });
     });
-    self.loadData(self.growingTree());
+    if (typeof skipLoading == "undefined" || !skipLoading){
+      self.loadData(self.growingTree());
+    }
   }
   }
 
 
-  self.addColumns = function (columns) {
+  self.addColumns = function (path, columns, skipLoading) {
     var _branch = self.growingTree();
     var _branch = self.growingTree();
     _branch.nodes.forEach(function (node) {
     _branch.nodes.forEach(function (node) {
-      if (node.path == self.path().split(".")[0]) {
+      if (node.path == path.split(".")[0]) {
 
 
         node.nodes.forEach(function (inode) {
         node.nodes.forEach(function (inode) {
-          if (inode.path == self.path()) {
+          if (inode.path == path) {
             _branch = inode;
             _branch = inode;
           }
           }
         });
         });
@@ -298,7 +303,7 @@ var Assist = function (vm) {
 
 
     columns.forEach(function (column) {
     columns.forEach(function (column) {
       var _mainFound = false;
       var _mainFound = false;
-      var _path = self.path() + "." + column;
+      var _path = path + "." + column;
       _branch.nodes.forEach(function (node) {
       _branch.nodes.forEach(function (node) {
         if (node.path == _path) {
         if (node.path == _path) {
           _mainFound = true;
           _mainFound = true;
@@ -317,7 +322,9 @@ var Assist = function (vm) {
         _branch.nodes.push(_item);
         _branch.nodes.push(_item);
       }
       }
     });
     });
-    self.loadData(self.growingTree());
+    if (typeof skipLoading == "undefined" || !skipLoading){
+      self.loadData(self.growingTree());
+    }
   }
   }
 
 
   self.collapseTree = function () {
   self.collapseTree = function () {
@@ -385,6 +392,7 @@ var Assist = function (vm) {
       self.updatePathProperty(self.growingTree(), obj.path(), "isExpanded", obj.isExpanded());
       self.updatePathProperty(self.growingTree(), obj.path(), "isExpanded", obj.isExpanded());
     }
     }
     self.path(obj.path());
     self.path(obj.path());
+    self.fetchHivePath();
   }
   }
 
 
   self.togglePath = function (obj) {
   self.togglePath = function (obj) {
@@ -424,31 +432,50 @@ var Assist = function (vm) {
     return leaf;
     return leaf;
   }
   }
 
 
-  self.fetchHivePath = function () {
-    if (self.path().split(".").length < 3) {
-      var _path = self.path().replace('.', '/');
+  self.loadParents = function () {
+    self.fetchHivePath("", function(){
+      var _crumbs = self.path().split(".");
+      self.fetchHivePath(_crumbs[0], function(){
+        if (_crumbs.length > 1){
+          self.fetchHivePath(_crumbs[0] + "." + _crumbs[1], function(){
+            self.loadData(self.growingTree());
+            self.collapseOthers();
+          });
+        }
+      });
+    });
+
+  }
+
+  self.fetchHivePath = function (optionalPath, loadCallback) {
+    var _originalPath = typeof optionalPath != "undefined" ? optionalPath : self.path();
+    if (_originalPath.split(".").length < 3) {
+      var _path = _originalPath.replace('.', '/');
 
 
       var request = {
       var request = {
         url: '/beeswax/api/autocomplete/' + _path,
         url: '/beeswax/api/autocomplete/' + _path,
         dataType: 'json',
         dataType: 'json',
         type: 'GET',
         type: 'GET',
         success: function (data) {
         success: function (data) {
+          var _hasCallback = typeof loadCallback != "undefined";
           if (data.databases) {
           if (data.databases) {
-            self.addDatabases(data.databases);
+            self.addDatabases(_originalPath, data.databases, _hasCallback);
           }
           }
           else if (data.tables && data.tables.length > 0) {
           else if (data.tables && data.tables.length > 0) {
-            self.addTables(data.tables);
-            var tables = $.map(data.tables, function (table, index) {
-              return self.db() + '.' + table;
-            });
+            self.addTables(_originalPath, data.tables, _hasCallback);
           }
           }
           else if (data.columns && data.columns.length > 0) {
           else if (data.columns && data.columns.length > 0) {
-            self.addColumns(data.columns);
+            self.addColumns(_originalPath, data.columns, _hasCallback);
           }
           }
 
 
           self.getTreeAdditionalDataForPath(self.path()).loaded = true;
           self.getTreeAdditionalDataForPath(self.path()).loaded = true;
 
 
-          vm.list_sentry_privileges_by_authorizable();
+          if (_hasCallback){
+            loadCallback(data);
+          }
+          else {
+            vm.list_sentry_privileges_by_authorizable();
+          }
         },
         },
         cache: false
         cache: false
       };
       };
@@ -501,10 +528,18 @@ var HiveViewModel = function (initial) {
     return _users.sort();
     return _users.sort();
   }, self);
   }, self);
 
 
-  self.init = function () {
+  self.init = function (path) {
     self.fetchUsers();
     self.fetchUsers();
+    self.assist.path(path);
     self.list_sentry_roles_by_group();
     self.list_sentry_roles_by_group();
-    self.assist.fetchHivePath();
+
+    if (path != ""){
+      self.assist.loadParents();
+    }
+    else {
+      self.assist.fetchHivePath();
+    }
+
   };
   };
 
 
   self.removeRole = function (roleName) {
   self.removeRole = function (roleName) {