Explorar o código

[security] Improved collapse, externalized css

Enrico Berti %!s(int64=11) %!d(string=hai) anos
pai
achega
efa58a613a

+ 0 - 2
apps/security/src/security/api/hdfs.py

@@ -56,8 +56,6 @@ def list_hdfs(request, path):
   except:
     json_response = HttpResponse(json.dumps({'files': []}), mimetype="application/json") # AccessControlException: Permission denied: user=test, access=READ_EXECUTE, inode="/tmp/dir":romain:supergroup:drwxr-xr-x:group::r-x,group:bob:---,group:test:---,default:user::rwx,default:group::r--,default:mask::r--,default:other::rwx (error 403)
 
-  print "pass"
-  print json_response
   if json.loads(request.GET.get('isDiffMode', 'false')):
     request.doas = 'hdfs'
     stats = request.fs.stats(path)

+ 4 - 160
apps/security/src/security/templates/hdfs.mako

@@ -27,159 +27,6 @@ ${ commonheader(_('Hadoop Security'), "security", user) | n,unicode }
 ${ layout.menubar(section='hdfs') }
 
 
-<style type="text/css">
-  #hdfsTree {
-    width: 100%;
-    overflow-y: scroll;
-    min-height: 100px;
-  }
-
-  #hdfsTree ul {
-    list-style-type: none;
-    padding: 0;
-  }
-
-  .node-row {
-    margin: 4px;
-    padding: 2px;
-    border: 1px dashed #FFFFFF;
-  }
-
-  .node-row:hover {
-    background-color: #F6F6F6;
-  }
-
-  .node-row a, .node-row i {
-    cursor: pointer;
-  }
-
-  .node-row a.striked {
-    text-decoration: line-through;
-  }
-
-  .node-row.selected {
-    background-color: #F6F6F6!important;
-  }
-
-  .loading-popover {
-    width: 200px;
-    height: 120px;
-    line-height: 120px;
-    color: #999999;
-  }
-
-  .path-container {
-    background-color: #FFF;
-    padding-top: 8px;
-  }
-
-  .acl-panel {
-    border-left: 1px solid #e5e5e5;
-    padding-top: 6px;
-    padding-left: 12px;
-  }
-
-  .acl-panel .nav-tabs {
-    margin-bottom: 0;
-  }
-
-  .acl-panel h4:not(:first-child) {
-    margin-top: 20px;
-  }
-
-  .acl-panel-content {
-    padding: 6px;
-    overflow-y: scroll;
-  }
-
-  .acl-block {
-    background-color: #f6f6f6;
-    padding: 3px;
-    margin-bottom: 4px;
-  }
-
-  .acl-block .checkbox, .acl-block .radio {
-    margin-left: 6px;
-  }
-
-  .add-acl {
-    padding: 5px;
-    text-align: center;
-    color: #CCC;
-    font-size: 20px;
-  }
-
-  .add-acl:hover {
-    color: #999;
-  }
-
-  #path {
-    height: 34px;
-    font-size: 14px;
-  }
-
-  .path-container .btn-inverse {
-    height: 34px;
-    width: 34px;
-    font-size: 14px;
-    line-height: 34px;
-  }
-
-  .fake-pre {
-    display: block;
-    padding: 9.5px;
-    margin: 0 0 10px;
-    font-size: 12px;
-    line-height: 20px;
-    word-break: break-all;
-    word-wrap: break-word;
-    font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
-    background-color: #f5f5f5;
-    border: 1px solid #ccc;
-    border: 1px solid rgba(0, 0, 0, 0.15);
-    -webkit-border-radius: 2px;
-    -moz-border-radius: 2px;
-    border-radius: 2px;
-  }
-
-  .tree-toolbar {
-    padding: 3px;
-    border-bottom: 1px solid #e5e5e5;
-  }
-
-  .tree-toolbar .fa {
-    margin-left: 5px;
-  }
-
-  .tree-toolbar .fa-sitemap {
-    color: #cccccc;
-    margin-right: 6px;
-  }
-
-  .tree-toolbar input {
-    margin-bottom: 0;
-    height: 25px;
-    min-height: 25px;
-  }
-
-  .tree-toolbar .pull-right {
-    margin-top: -5px;
-  }
-
-  .inline-block {
-    display: inline-block;
-  }
-
-  .force-word-break {
-    word-break: break-all;
-  }
-
-  .pointer {
-    cursor: pointer;
-  }
-
-</style>
-
 <script type="text/html" id="acl-display">
   <div data-bind="visible: status() != 'deleted'">
     <span data-bind="text: printAcl($data)"></span>
@@ -244,7 +91,7 @@ ${ layout.menubar(section='hdfs') }
             <div class="span8">
               <div class="path-container">
                 <div class="input-append span12">
-                  <input id="path" type="text" data-bind="value: $root.assist.path, valueUpdate: 'afterkeydown'" autocomplete="off" />
+                  <input id="path" class="path" type="text" data-bind="value: $root.assist.path, valueUpdate: 'afterkeydown'" autocomplete="off" />
                   <a data-bind="attr: { href: '/filebrowser/view' + $root.assist.path() }" target="_blank" title="${ _('Open in File Browser') }" class="btn btn-inverse">
                     <i class="fa fa-external-link"></i>
                   </a>
@@ -263,16 +110,13 @@ ${ layout.menubar(section='hdfs') }
                     <select class="user-list" data-bind="options: $root.selectableHadoopUsers, select2: { placeholder: '${ _("Select a user") }', update: $root.doAs, type: 'user'}" style="width: 120px"></select>
                     <i class="fa fa-group" title="List of groups in popover for this user?"></i>
                   </div>
-                  <i class="fa fa-sitemap fa-rotate-270" data-bind="css: {'fa-spin': $root.assist.isLoadingTree()}"></i>
-                  <a href="javascript: void(0)" data-bind="click: $root.assist.collapseTree">
-                    <i class="fa fa-compress"></i> ${_('Collapse')}
-                  </a>
-                  <a href="javascript: void(0)" data-bind="click: $root.assist.expandTree">
-                    <i class="fa fa-expand"></i> ${_('Expand')}
+                  <a href="javascript: void(0)" data-bind="click: $root.assist.collapseOthers">
+                    <i class="fa fa-compress"></i> ${_('Close others')}
                   </a>
                   <a href="javascript: void(0)" data-bind="click: $root.assist.refreshTree">
                     <i class="fa fa-refresh"></i>  ${_('Refresh')}
                   </a>
+                  <i class="fa fa-spinner fa-spin" data-bind="visible: $root.assist.isLoadingTree()"></i>
                 </div>
               </div>
               <div class="path-container-ghost hide"></div>

+ 1 - 1
apps/security/src/security/templates/hive.mako

@@ -77,7 +77,7 @@ ${ layout.menubar(section='hive') }
           </li>
           <li class="nav-header"><i class="fa fa-group"></i> ${ _('Groups') }
             </br>
-            <input type="checkbox" checked></input> All
+            <input type="checkbox" checked> All
             </br>
             <select data-bind="options: $root.availableHadoopGroups" size="10" multiple="true"></select>
           </li>

+ 2 - 0
apps/security/src/security/templates/layout.mako

@@ -46,6 +46,8 @@ def is_selected(section, matcher):
 
 
 <%def name="menubar(section='')">
+  <link href="/security/static/css/security.css" rel="stylesheet">
+
   <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container-fluid">

+ 160 - 0
apps/security/static/css/security.css

@@ -0,0 +1,160 @@
+/*
+ Licensed to Cloudera, Inc. under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  Cloudera, Inc. 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.
+*/
+
+.hue-tree {
+  width: 100%;
+  overflow-y: scroll;
+  min-height: 100px;
+}
+
+.hue-tree ul {
+  list-style-type: none;
+  padding: 0;
+}
+
+.node-row {
+  margin: 4px;
+  padding: 2px;
+  border: 1px dashed #FFFFFF;
+}
+
+.node-row:hover {
+  background-color: #F6F6F6;
+}
+
+.node-row a, .node-row i {
+  cursor: pointer;
+}
+
+.node-row a.striked {
+  text-decoration: line-through;
+}
+
+.node-row.selected {
+  background-color: #F6F6F6 !important;
+}
+
+.path-container {
+  background-color: #FFF;
+  padding-top: 8px;
+}
+
+.acl-panel {
+  border-left: 1px solid #e5e5e5;
+  padding-top: 6px;
+  padding-left: 12px;
+}
+
+.acl-panel .nav-tabs {
+  margin-bottom: 0;
+}
+
+.acl-panel h4:not(:first-child) {
+  margin-top: 20px;
+}
+
+.acl-panel-content {
+  padding: 6px;
+  overflow-y: scroll;
+}
+
+.acl-block {
+  background-color: #f6f6f6;
+  padding: 3px;
+  margin-bottom: 4px;
+}
+
+.acl-block .checkbox, .acl-block .radio {
+  margin-left: 6px;
+}
+
+.add-acl {
+  padding: 5px;
+  text-align: center;
+  color: #CCC;
+  font-size: 20px;
+}
+
+.add-acl:hover {
+  color: #999;
+}
+
+.path {
+  height: 34px;
+  font-size: 14px;
+}
+
+.path-container .btn-inverse {
+  height: 34px;
+  width: 34px;
+  font-size: 14px;
+  line-height: 34px;
+}
+
+.fake-pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  font-size: 12px;
+  line-height: 20px;
+  word-break: break-all;
+  word-wrap: break-word;
+  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
+  background-color: #f5f5f5;
+  border: 1px solid #ccc;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  -webkit-border-radius: 2px;
+  -moz-border-radius: 2px;
+  border-radius: 2px;
+}
+
+.tree-toolbar {
+  padding: 3px;
+  border-bottom: 1px solid #e5e5e5;
+}
+
+.tree-toolbar .fa {
+  margin-left: 5px;
+}
+
+.tree-toolbar .fa-spin {
+  color: #cccccc;
+  margin-right: 6px;
+}
+
+.tree-toolbar input {
+  margin-bottom: 0;
+  height: 25px;
+  min-height: 25px;
+}
+
+.tree-toolbar .pull-right {
+  margin-top: -5px;
+}
+
+.inline-block {
+  display: inline-block;
+}
+
+.force-word-break {
+  word-break: break-all;
+}
+
+.pointer {
+  cursor: pointer;
+}

+ 0 - 68
apps/security/static/css/useradmin.css

@@ -1,68 +0,0 @@
-/*
- Licensed to Cloudera, Inc. under one
- or more contributor license agreements.  See the NOTICE file
- distributed with this work for additional information
- regarding copyright ownership.  Cloudera, Inc. 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.
-*/
-
-.fixed {
-  position: fixed;
-  top: 80px;
-  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
-  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
-  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
-}
-
-.sortable {
-  cursor: pointer;
-}
-
-.file-row {
-  height: 37px;
-}
-
-.steps {
-  padding-top: 20px;
-  margin-bottom: 100px;
-  border: 1px solid #DDDDDD;
-  border-top: transparent;
-}
-
-.section {
-  margin: 20px;
-}
-
-input[type=submit] {
-  margin-left: 50px;
-}
-
-.nav-tabs .active {
-  font-weight: bold;
-}
-
-.form-actions {
-  padding-left: 0 !important;
-}
-
-@media all and (max-height: 800px) {
-  .form-actions {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    margin: 0;
-    padding-left: 20px !important;
-  }
-}

+ 18 - 0
apps/security/static/js/hdfs.ko.js

@@ -248,6 +248,24 @@ var Assist = function (vm, assist) {
     self.loadData(self.growingTree());
   }
 
+  self.collapseOthers = function () {
+    self.updateTreeProperty(self.growingTree(), "isExpanded", false);
+    self.updatePathProperty(self.growingTree(), "/", "isExpanded", true);
+
+    var _path = self.path();
+    var _crumb = "";
+    for (var i = 0; i < _path.length; i++) {
+      if ((_path[i] === "/" && _crumb != "")) {
+        self.updatePathProperty(self.growingTree(), _crumb, "isExpanded", true);
+      }
+      _crumb += _path[i];
+    }
+
+    self.updatePathProperty(self.growingTree(), _path, "isExpanded", true);
+
+    self.loadData(self.growingTree());
+  }
+
   self.expandTree = function () {
     self.updateTreeProperty(self.growingTree(), "isExpanded", true);
     self.loadData(self.growingTree());

+ 1 - 1
desktop/core/src/desktop/templates/common_tree.mako

@@ -123,6 +123,6 @@
 </%def>
 
 <%def name="render(id=None, data=None, afterRender='void(0)')">
-  <div id="${id}" data-bind="template: { name: 'tree-template', data: ${data}, afterRender: ${afterRender} }"></div>
+  <div id="${id}" class="hue-tree" data-bind="template: { name: 'tree-template', data: ${data}, afterRender: ${afterRender} }"></div>
 </%def>