[Bps-public-commit] rt-extension-automaticassignment branch, master, updated. 78f79c4746d6b7acba9f6acd052e43403d6e22f6

[Shawn Moore]

The branch, master has been updated
       via  78f79c4746d6b7acba9f6acd052e43403d6e22f6 (commit)
      from  a48165f1198aa095811231d6180a5a4926cd9b50 (commit)

Summary of changes:
 html/Admin/Queues/AutomaticAssignment.html |  8 ++++++++
 html/Admin/Queues/Elements/Chooser/Random  | 18 ++++++++++++++++
 static/css/automatic-assignment.css        | 16 +++++++++++++++
 static/js/automatic-assignment.js          | 33 +++++++++++++++++++++---------
 4 files changed, 65 insertions(+), 10 deletions(-)

- Log -----------------------------------------------------------------
commit 78f79c4746d6b7acba9f6acd052e43403d6e22f6
Author: Shawn M Moore <shawn at bestpractical.com>
Date:   Wed Aug 17 16:51:29 2016 +0000

    Improve loading UI

diff --git a/html/Admin/Queues/AutomaticAssignment.html b/html/Admin/Queues/AutomaticAssignment.html
index f780d21..f186828 100644
--- a/html/Admin/Queues/AutomaticAssignment.html
+++ b/html/Admin/Queues/AutomaticAssignment.html
@@ -27,6 +27,10 @@
 
 <input type="submit" class="button" name="AddFilter" value="Add Filter">
 
+<span class="loading">Loading...</span>
+
+<div class="filter-list">
+
 % my $i = 0;
 % my $filters_value = "";
 % for my $filter (@{ $config->{filters} }) {
@@ -39,6 +43,8 @@
 %    $m->comp($path, prefix => $prefix, config => $filter, queue => $QueueObj);
 % }
 
+</div>
+
 <input type="hidden" class="hidden" name="Filters" value="<% $filters_value %>" />
 
 </div>
@@ -68,6 +74,8 @@
 
 </select>
 
+<span class="loading">Loading...</span>
+
 % my $path = "/Admin/Queues/Elements/Chooser/$name";
 % $m->comp($path, prefix => $prefix, config => $chooser_config, queue => $QueueObj);
 
diff --git a/html/Admin/Queues/Elements/Chooser/Random b/html/Admin/Queues/Elements/Chooser/Random
index 036f066..d8689c5 100644
--- a/html/Admin/Queues/Elements/Chooser/Random
+++ b/html/Admin/Queues/Elements/Chooser/Random
@@ -1,5 +1,23 @@
 <&| /Admin/Queues/Elements/SortableBox, prefix => $prefix, is_filter => 0, class_name => 'Random' &>
 <p>This chooser selects a random owner from the pool of eligible users.</p>
+<table>
+<tr>
+<td class="label"><label for="<% $prefix %>_begin">Begin Custom Field:</label></td>
+<td class="value">
+<select id="<% $prefix %>_begin" name="<% $prefix %>_begin">
+<option value="">-</option>
+</select>
+</td>
+</tr>
+<tr>
+<td class="label"><label for="<% $prefix %>_end">End Custom Field:</label></td>
+<td class="value">
+<select id="<% $prefix %>_end" name="<% $prefix %>_end">
+<option value="">-</option>
+</select>
+</td>
+</tr>
+</table>
 </&>
 <%ARGS>
 $prefix
diff --git a/static/css/automatic-assignment.css b/static/css/automatic-assignment.css
index 927cec8..4788728 100644
--- a/static/css/automatic-assignment.css
+++ b/static/css/automatic-assignment.css
@@ -23,3 +23,19 @@ form.automatic-assignment {
 .sortable-box select {
     min-width: 10em;
 }
+
+.replacing .sortable-box {
+    -webkit-filter: grayscale(80%);
+    filter: grayscale(80%);
+    opacity: 0.5;
+}
+
+.filters .loading,
+.chooser .loading {
+    visibility: hidden;
+}
+
+.filters.adding .loading,
+.chooser.replacing .loading {
+    visibility: visible;
+}
diff --git a/static/js/automatic-assignment.js b/static/js/automatic-assignment.js
index 5701bcb..cd7041a 100644
--- a/static/js/automatic-assignment.js
+++ b/static/js/automatic-assignment.js
@@ -3,19 +3,23 @@ jQuery(function () {
     var addFilterSelect = form.find('select[name=FilterType]');
     var filtersField = form.find('input[name=Filters]');
     var chooserField = form.find('input[name=Chooser]');
+    var filterContainer = form.find('.filters');
+    var chooserContainer = form.find('.chooser');
+    var filterList = form.find('.filter-list');
+    var addFilterButton = form.find('input.button[name=AddFilter]');
 
-    var i = form.find('.filters .sortable-box').length;
+    var i = filterList.find('.sortable-box').length;
 
     var refreshFiltersField = function () {
         var filters = "";
-        form.find('.filters .sortable-box').each(function () {
+        filterList.find('.sortable-box').each(function () {
             filters += jQuery(this).data('prefix') + ',';
         });
 
         filtersField.val(filters);
     };
 
-    form.find('input.button[name=AddFilter]').click(function (e) {
+    addFilterButton.click(function (e) {
         e.preventDefault();
         var filter = addFilterSelect.val();
         if (filter) {
@@ -24,13 +28,19 @@ jQuery(function () {
                 i: ++i
             };
 
+            filterContainer.addClass('adding');
+            addFilterSelect.attr('disabled', true);
+            addFilterButton.attr('disabled', true);
+
             jQuery.ajax({
                 url: RT.Config.WebHomePath + "/Helpers/AddFilter",
                 data: params,
                 success: function (html) {
-                    form.find('.filters').append(html);
+                    jQuery(html).prependTo(filterList).hide().slideDown();
                     refreshFiltersField();
-                    addFilterSelect.val('');
+                    filterContainer.removeClass('adding');
+                    addFilterSelect.val('').attr('disabled', false);
+                    addFilterButton.attr('disabled', false);
                 },
                 error: function (xhr, reason) {
                     alert(reason);
@@ -44,18 +54,21 @@ jQuery(function () {
 
     form.find('select[name=ChooserType]').change(function (e) {
         e.preventDefault();
-        var chooser = jQuery(this).val();
+        var chooserName = jQuery(this).val();
         var params = {
-            Name: chooser
+            Name: chooserName
         };
-        jQuery('.chooser .sortable-box').empty();
+
+        chooserContainer.addClass('replacing');
+        chooserContainer.find('.sortable-box :input').attr('disabled', true);
 
         jQuery.ajax({
             url: RT.Config.WebHomePath + "/Helpers/SelectChooser",
             data: params,
             success: function (html) {
-                form.find('.chooser .sortable-box').replaceWith(html);
-                chooserField.val('Chooser_' + chooser);
+                chooserContainer.find('.sortable-box').replaceWith(html);
+                chooserContainer.removeClass('replacing');
+                chooserField.val('Chooser_' + chooserName);
             },
             error: function (xhr, reason) {
                 alert(reason);

-----------------------------------------------------------------------