Procházet zdrojové kódy

HUE-2411 [useradmin] Lazy load user and group list in permission sharing popup

Moved loading on first modal show
The search input, add button and caret buttons are disabled until the list of users is loaded
Enrico Berti před 11 roky
rodič
revize
e6e27bc

+ 2 - 2
apps/beeswax/src/beeswax/templates/execute.mako

@@ -2750,8 +2750,8 @@ function setupCodeMirrorSubscription() {
 viewModel = new BeeswaxViewModel("${app_name}");
 viewModel = new BeeswaxViewModel("${app_name}");
 ko.applyBindings(viewModel, $("#beeswax-execute")[0]);
 ko.applyBindings(viewModel, $("#beeswax-execute")[0]);
 
 
-shareViewModel = setupSharing("#documentShareModal");
-shareViewModel.setDocId(${doc_id})
+shareViewModel = initSharing("#documentShareModal");
+shareViewModel.setDocId(${doc_id});
 
 
 % if not beeswax_conf.USE_GET_LOG_API.get() and app_name != 'impala':
 % if not beeswax_conf.USE_GET_LOG_API.get() and app_name != 'impala':
   viewModel.shouldAppendLogs = true;
   viewModel.shouldAppendLogs = true;

+ 1 - 1
apps/oozie/src/oozie/templates/editor/bundle_editor.mako

@@ -203,7 +203,7 @@ ${ dashboard.import_bindings() }
   var viewModel = new BundleEditorViewModel(${ bundle_json | n,unicode }, ${ coordinators_json | n,unicode }, ${ can_edit_json | n,unicode });
   var viewModel = new BundleEditorViewModel(${ bundle_json | n,unicode }, ${ coordinators_json | n,unicode }, ${ can_edit_json | n,unicode });
   ko.applyBindings(viewModel, $("#editor")[0]);
   ko.applyBindings(viewModel, $("#editor")[0]);
 
 
-  var shareViewModel = setupSharing("#documentShareModal");
+  var shareViewModel = initSharing("#documentShareModal");
   shareViewModel.setDocId(${ doc1_id });
   shareViewModel.setDocId(${ doc1_id });
 
 
   var tempCoordinator = null;
   var tempCoordinator = null;

+ 1 - 1
apps/oozie/src/oozie/templates/editor/coordinator_editor.mako

@@ -498,7 +498,7 @@ ${ dashboard.import_bindings() }
 
 
   viewModel.coordinator.properties.cron_advanced.valueHasMutated(); // Update jsCron enabled status
   viewModel.coordinator.properties.cron_advanced.valueHasMutated(); // Update jsCron enabled status
 
 
-  var shareViewModel = setupSharing("#documentShareModal");
+  var shareViewModel = initSharing("#documentShareModal");
   shareViewModel.setDocId(${ doc1_id });
   shareViewModel.setDocId(${ doc1_id });
 
 
   function showChooseWorkflow() {
   function showChooseWorkflow() {

+ 1 - 1
apps/oozie/src/oozie/templates/editor/list_editor_bundles.mako

@@ -206,7 +206,7 @@ ${ commonshare() | n,unicode }
     viewModel = new Editor();
     viewModel = new Editor();
     ko.applyBindings(viewModel, $("#editor")[0]);
     ko.applyBindings(viewModel, $("#editor")[0]);
 
 
-    shareViewModel = setupSharing("#documentShareModal");
+    shareViewModel = initSharing("#documentShareModal");
     shareViewModel.setDocId(-1);
     shareViewModel.setDocId(-1);
 
 
     $(document).on("showSubmitPopup", function(event, data){
     $(document).on("showSubmitPopup", function(event, data){

+ 1 - 1
apps/oozie/src/oozie/templates/editor/list_editor_coordinators.mako

@@ -205,7 +205,7 @@ ${ commonshare() | n,unicode }
     viewModel = new Editor();
     viewModel = new Editor();
     ko.applyBindings(viewModel, $("#editor")[0]);
     ko.applyBindings(viewModel, $("#editor")[0]);
 
 
-    shareViewModel = setupSharing("#documentShareModal");
+    shareViewModel = initSharing("#documentShareModal");
     shareViewModel.setDocId(-1);
     shareViewModel.setDocId(-1);
 
 
     $(document).on("showSubmitPopup", function(event, data){
     $(document).on("showSubmitPopup", function(event, data){

+ 1 - 1
apps/oozie/src/oozie/templates/editor/list_editor_workflows.mako

@@ -207,7 +207,7 @@ ${ commonshare() | n,unicode }
     viewModel = new Editor();
     viewModel = new Editor();
     ko.applyBindings(viewModel, $("#editor")[0]);
     ko.applyBindings(viewModel, $("#editor")[0]);
 
 
-    shareViewModel = setupSharing("#documentShareModal");
+    shareViewModel = initSharing("#documentShareModal");
     shareViewModel.setDocId(-1);
     shareViewModel.setDocId(-1);
 
 
     $(document).on("showSubmitPopup", function(event, data){
     $(document).on("showSubmitPopup", function(event, data){

+ 1 - 1
apps/oozie/src/oozie/templates/editor/workflow_editor.mako

@@ -1815,7 +1815,7 @@ ${ dashboard.import_bindings() }
   var viewModel = new WorkflowEditorViewModel(${ layout_json | n,unicode }, ${ workflow_json | n,unicode }, ${ credentials_json | n,unicode }, ${ workflow_properties_json | n,unicode }, ${ subworkflows_json | n,unicode }, ${ can_edit_json | n,unicode }); 
   var viewModel = new WorkflowEditorViewModel(${ layout_json | n,unicode }, ${ workflow_json | n,unicode }, ${ credentials_json | n,unicode }, ${ workflow_properties_json | n,unicode }, ${ subworkflows_json | n,unicode }, ${ can_edit_json | n,unicode }); 
   ko.applyBindings(viewModel, $("#editor")[0]);
   ko.applyBindings(viewModel, $("#editor")[0]);
 
 
-  var shareViewModel = setupSharing("#documentShareModal");
+  var shareViewModel = initSharing("#documentShareModal");
   shareViewModel.setDocId(${ doc1_id });
   shareViewModel.setDocId(${ doc1_id });
 
 
   viewModel.init();
   viewModel.init();

+ 2 - 2
apps/pig/src/pig/templates/app.mako

@@ -789,12 +789,12 @@ ${ commonshare() | n,unicode }
 
 
   var viewModel = new PigViewModel(appProperties);
   var viewModel = new PigViewModel(appProperties);
   ko.applyBindings(viewModel, $("#pig-editor-app")[0]);
   ko.applyBindings(viewModel, $("#pig-editor-app")[0]);
-  var shareViewModel = setupSharing("#documentShareModal");
+  var shareViewModel = initSharing("#documentShareModal");
 
 
   function tryShareQuery() {
   function tryShareQuery() {
     if (viewModel.currentScript().docId() != -1) {
     if (viewModel.currentScript().docId() != -1) {
       shareViewModel.setDocId(viewModel.currentScript().docId())
       shareViewModel.setDocId(viewModel.currentScript().docId())
-      $("#documentShareModal").modal("show");
+      openShareModal();
     }
     }
   }
   }
 
 

+ 1 - 1
apps/rdbms/src/rdbms/templates/execute.mako

@@ -672,7 +672,7 @@ ${ commonshare() | n,unicode }
 
 
   // Knockout
   // Knockout
   viewModel = new RdbmsViewModel();
   viewModel = new RdbmsViewModel();
-  shareViewModel = setupSharing("#documentShareModal");
+  shareViewModel = initSharing("#documentShareModal");
   shareViewModel.setDocId(${doc_id});
   shareViewModel.setDocId(${doc_id});
 
 
   viewModel.fetchServers();
   viewModel.fetchServers();

+ 36 - 38
desktop/core/src/desktop/templates/common_share.mako

@@ -24,48 +24,46 @@ from django.utils.translation import ugettext as _
     <h3>${_('Sharing settings')}</h3>
     <h3>${_('Sharing settings')}</h3>
   </div>
   </div>
   <div class="modal-body">
   <div class="modal-body">
-    <p>
-      <div class="row-fluid">
-        <div class="span6">
-          <h4 class="muted" style="margin-top:0px">${_('Read')}</h4>
-          <div data-bind="visible: (selectedDoc().perms.read.users.length == 0 && selectedDoc().perms.read.groups.length == 0)">${_('The document is not shared for read.')}</div>
-          <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.read.users">
-            <li><span class="badge badge-info badge-left"><i class="fa fa-user"></i> <span data-bind="text: prettifyUsername(id)"></span></span><span class="badge badge-right trash-share" data-bind="click: removeUserReadShare"> <i class="fa fa-times"></i></li>
-          </ul>
-          <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.read.groups">
-            <li><span class="badge badge-info badge-left"><i class="fa fa-users"></i> ${ _('Group') } &quot;<span data-bind="text: name"></span>&quot;</span><span class="badge badge-right trash-share" data-bind="click: removeGroupReadShare"> <i class="fa fa-times"></i></li>
-          </ul>
-        </div>
-
-        <div class="span6">
-          <h4 class="muted" style="margin-top:0px">${_('Read and Modify')}</h4>
-          <div data-bind="visible: (selectedDoc().perms.write.users.length == 0 && selectedDoc().perms.write.groups.length == 0)">${_('The document is not shared for read and modify.')}</div>
-          <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.write.users">
-            <li><span class="badge badge-info badge-left"><i class="fa fa-user"></i> <span data-bind="text: prettifyUsername(id)"></span></span><span class="badge badge-right trash-share" data-bind="click: removeUserWriteShare"> <i class="fa fa-times"></i></li>
-          </ul>
-          <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.write.groups">
-            <li><span class="badge badge-info badge-left"><i class="fa fa-users"></i> ${ _('Group') } &quot;<span data-bind="text: name"></span>&quot;</span><span class="badge badge-right trash-share" data-bind="click: removeGroupWriteShare"> <i class="fa fa-times"></i></li>
-          </ul>
-        </div>
+    <div class="row-fluid">
+      <div class="span6">
+        <h4 class="muted" style="margin-top:0px">${_('Read')}</h4>
+        <div data-bind="visible: (selectedDoc().perms.read.users.length == 0 && selectedDoc().perms.read.groups.length == 0)">${_('The document is not shared for read.')}</div>
+        <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.read.users">
+          <li><span class="badge badge-info badge-left"><i class="fa fa-user"></i> <span data-bind="text: prettifyUsername(id)"></span></span><span class="badge badge-right trash-share" data-bind="click: removeUserReadShare"> <i class="fa fa-times"></i></li>
+        </ul>
+        <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.read.groups">
+          <li><span class="badge badge-info badge-left"><i class="fa fa-users"></i> ${ _('Group') } &quot;<span data-bind="text: name"></span>&quot;</span><span class="badge badge-right trash-share" data-bind="click: removeGroupReadShare"> <i class="fa fa-times"></i></li>
+        </ul>
+      </div>
 
 
+      <div class="span6">
+        <h4 class="muted" style="margin-top:0px">${_('Read and Modify')}</h4>
+        <div data-bind="visible: (selectedDoc().perms.write.users.length == 0 && selectedDoc().perms.write.groups.length == 0)">${_('The document is not shared for read and modify.')}</div>
+        <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.write.users">
+          <li><span class="badge badge-info badge-left"><i class="fa fa-user"></i> <span data-bind="text: prettifyUsername(id)"></span></span><span class="badge badge-right trash-share" data-bind="click: removeUserWriteShare"> <i class="fa fa-times"></i></li>
+        </ul>
+        <ul class="unstyled airy" data-bind="foreach: selectedDoc().perms.write.groups">
+          <li><span class="badge badge-info badge-left"><i class="fa fa-users"></i> ${ _('Group') } &quot;<span data-bind="text: name"></span>&quot;</span><span class="badge badge-right trash-share" data-bind="click: removeGroupWriteShare"> <i class="fa fa-times"></i></li>
+        </ul>
       </div>
       </div>
-      <div class="clearfix"></div>
-      <div style="margin-top: 20px">
-        <div class="input-append">
-          <input id="documentShareTypeahead" type="text" style="width: 460px" placeholder="${_('Type a username or a group name')}">
-          <div class="btn-group">
-            <a id="documentShareAddBtn" class="btn"><i class="fa fa-plus-circle"></i> <span data-bind="text: selectedPermLabel"></span></a>
-            <a class="btn dropdown-toggle" data-toggle="dropdown">
-              <span class="caret"></span>
-            </a>
-            <ul class="dropdown-menu">
-              <li><a data-bind="click: changeDocumentSharePerm.bind(null, 'read')" href="javascript:void(0)">${ _('Read') }</a></li>
-              <li><a data-bind="click: changeDocumentSharePerm.bind(null, 'write')" href="javascript:void(0)">${ _('Read and Modify') }</a></li>
-            </ul>
-          </div>
+
+    </div>
+    <div class="clearfix"></div>
+    <div style="margin-top: 20px">
+      <div class="input-append">
+        <input id="documentShareTypeahead" type="text" style="width: 460px" placeholder="${_('Type a username or a group name')}" disabled="disabled">
+        <div class="btn-group">
+          <a id="documentShareAddBtn" class="btn disabled"><i class="fa fa-plus-circle"></i> <span data-bind="text: selectedPermLabel"></span></a>
+          <a id="documentShareCaret" class="btn dropdown-toggle disabled" data-toggle="dropdown">
+            <span class="caret"></span>
+          </a>
+          <ul class="dropdown-menu">
+            <li><a data-bind="click: changeDocumentSharePerm.bind(null, 'read')" href="javascript:void(0)">${ _('Read') }</a></li>
+            <li><a data-bind="click: changeDocumentSharePerm.bind(null, 'write')" href="javascript:void(0)">${ _('Read and Modify') }</a></li>
+          </ul>
         </div>
         </div>
       </div>
       </div>
-    </p>
+    </div>
   </div>
   </div>
   <div class="modal-footer">
   <div class="modal-footer">
     <a href="#" data-dismiss="modal" class="btn btn-primary disable-feedback disable-enter">${_('Done')}</a>
     <a href="#" data-dismiss="modal" class="btn btn-primary disable-feedback disable-enter">${_('Done')}</a>

+ 2 - 2
desktop/core/src/desktop/templates/home.mako

@@ -332,7 +332,7 @@ ${ commonshare() | n,unicode }
     viewModel = new HomeViewModel(JSON_TAGS, JSON_DOCS);
     viewModel = new HomeViewModel(JSON_TAGS, JSON_DOCS);
     ko.applyBindings(viewModel, $('#documentList')[0]);
     ko.applyBindings(viewModel, $('#documentList')[0]);
 
 
-    shareViewModel = setupSharing("#documentShareModal", viewModel.updateDoc);
+    shareViewModel = initSharing("#documentShareModal", viewModel.updateDoc);
 
 
     var selectedUserOrGroup, map, dropdown = null;
     var selectedUserOrGroup, map, dropdown = null;
 
 
@@ -424,7 +424,7 @@ ${ commonshare() | n,unicode }
 
 
   function shareDoc(doc) {
   function shareDoc(doc) {
     shareViewModel.selectedDoc(doc);
     shareViewModel.selectedDoc(doc);
-    $("#documentShareModal").modal("show");
+    openShareModal();
   }
   }
 
 
   function moveDoc(doc) {
   function moveDoc(doc) {

+ 80 - 50
desktop/core/static/js/share.vm.js

@@ -3,6 +3,9 @@ var shareViewModel;
 function ShareViewModel(updateDocF) {
 function ShareViewModel(updateDocF) {
   var self = this;
   var self = this;
 
 
+  self.hasInitBeenCalled = false;
+  self.hasSetupBeenCalled = false;
+
   self.selectedPerm = ko.observable('read');
   self.selectedPerm = ko.observable('read');
   self.selectedPermLabel = ko.computed(function() {
   self.selectedPermLabel = ko.computed(function() {
     if (self.selectedPerm() == 'write') {
     if (self.selectedPerm() == 'write') {
@@ -39,6 +42,11 @@ function ShareViewModel(updateDocF) {
 
 
 function openShareModal() {
 function openShareModal() {
   $("#documentShareModal").modal("show");
   $("#documentShareModal").modal("show");
+  setupSharing(function(){
+    $("#documentShareAddBtn").removeClass("disabled");
+    $("#documentShareCaret").removeClass("disabled");
+    $("#documentShareTypeahead").removeAttr("disabled");
+  });
 }
 }
 
 
 function isShared() {
 function isShared() {
@@ -60,70 +68,92 @@ function prettifyUsername(userId) {
   return "";
   return "";
 }
 }
 
 
-function setupSharing(id, updateFunc) {
+function initSharing(id, updateFunc) {
   if(!updateFunc) {
   if(!updateFunc) {
     updateFunc = function () {}
     updateFunc = function () {}
   }
   }
   shareViewModel = new ShareViewModel(updateFunc);
   shareViewModel = new ShareViewModel(updateFunc);
   ko.applyBindings(shareViewModel, $(id)[0]);
   ko.applyBindings(shareViewModel, $(id)[0]);
+  shareViewModel.hasInitBeenCalled = true;
+  return shareViewModel;
+}
 
 
-  $.getJSON('/desktop/api/users/autocomplete', function (data) {
-    JSON_USERS_GROUPS = data;
-    dropdown = [];
-    map = {};
-
-    $.each(JSON_USERS_GROUPS.users, function (i, user) {
-      var _display = prettifyUsername(user.id);
-      map[_display] = user;
-      dropdown.push(_display);
-    });
-
-    $.each(JSON_USERS_GROUPS.groups, function (i, group) {
-      map[group.name] = group;
-      dropdown.push(group.name);
-    });
+function setupSharing(id, updateFunc) {
+  if (shareViewModel == null || !shareViewModel.hasInitBeenCalled) {
+    shareViewModel = initSharing(id, updateFunc);
+  }
 
 
-    $("#documentShareTypeahead").typeahead({
-      source: function (query, process) {
-        process(dropdown);
-      },
-      matcher: function (item) {
-        if (item.toLowerCase().indexOf(this.query.trim().toLowerCase()) != -1) {
-          return true;
+  if (! self.hasSetupBeenCalled){
+    $.getJSON('/desktop/api/users/autocomplete', function (data) {
+      self.hasSetupBeenCalled = true;
+      JSON_USERS_GROUPS = data;
+      dropdown = [];
+      map = {};
+
+      $.each(JSON_USERS_GROUPS.users, function (i, user) {
+        var _display = prettifyUsername(user.id);
+        map[_display] = user;
+        dropdown.push(_display);
+      });
+
+      $.each(JSON_USERS_GROUPS.groups, function (i, group) {
+        map[group.name] = group;
+        dropdown.push(group.name);
+      });
+
+      $("#documentShareTypeahead").typeahead({
+        source: function (query, process) {
+          process(dropdown);
+        },
+        matcher: function (item) {
+          if (item.toLowerCase().indexOf(this.query.trim().toLowerCase()) != -1) {
+            return true;
+          }
+        },
+        sorter: function (items) {
+          return items.sort();
+        },
+        highlighter: function (item) {
+          var _icon = "fa";
+          var _display = "";
+          if (map[item].hasOwnProperty("username")) {
+            _icon += " fa-user";
+          }
+          else {
+            _icon += " fa-users";
+          }
+          var regex = new RegExp('(' + this.query + ')', 'gi');
+          return "<i class='" + _icon + "'></i> " + item.replace(regex, "<strong>$1</strong>");
+        },
+        updater: function (item) {
+          selectedUserOrGroup = map[item];
+          return item;
         }
         }
-      },
-      sorter: function (items) {
-        return items.sort();
-      },
-      highlighter: function (item) {
-        var _icon = "fa";
-        var _display = "";
-        if (map[item].hasOwnProperty("username")) {
-          _icon += " fa-user";
-        }
-        else {
-          _icon += " fa-users";
+      });
+
+      $("#documentShareTypeahead").on("keyup", function (e) {
+        var _code = (e.keyCode ? e.keyCode : e.which);
+        if (_code == 13) {
+          handleTypeaheadSelection();
         }
         }
-        var regex = new RegExp('(' + this.query + ')', 'gi');
-        return "<i class='" + _icon + "'></i> " + item.replace(regex, "<strong>$1</strong>");
-      },
-      updater: function (item) {
-        selectedUserOrGroup = map[item];
-        return item;
+      });
+
+      if (typeof id == "function"){
+        id();
       }
       }
     });
     });
 
 
-    $("#documentShareTypeahead").on("keyup", function (e) {
-      var _code = (e.keyCode ? e.keyCode : e.which);
-      if (_code == 13) {
-        handleTypeaheadSelection();
+    $("#documentShareAddBtn").on("click", function () {
+      if (! $(this).hasClass("disabled")){
+        handleTypeaheadSelection();  
       }
       }
     });
     });
-  });
-
-  $("#documentShareAddBtn").on("click", function () {
-    handleTypeaheadSelection();
-  });
+  }
+  else {
+    if (typeof id == "function"){
+      id();
+    }
+  }
 
 
   return shareViewModel;
   return shareViewModel;
 }
 }