Fix duplicating list display when adding new item to its first list.

- Only add to item/save queue if absent (prevents multiple placeholders)
- Namespace pending classes
- Fix overzealous de-queing
- De-chain jQuery manipulations for clarity

themes/bootstrap3/js/check_item_statuses.js

@@ -12,7 +12,7 @@ function linkCallnumbers(callnumber, callnumber_handler) {
   return callnumber;
 }
 function displayItemStatus(result, $item) {
-  $item.removeClass('.ajax-pending');
+  $item.removeClass('js-item-pending');
   $item.find('.status').empty().append(result.availability_message);
   $item.find('.ajax-availability').removeClass('ajax-availability hidden');
   if (typeof(result.full_status) != 'undefined'
@@ -66,12 +66,11 @@ function displayItemStatus(result, $item) {
   }
 }
 function itemStatusFail(response, textStatus) {
-  $('.ajax-pending').empty();
   if (textStatus === 'abort' || typeof response.responseJSON === 'undefined') {
     return;
   }
   // display the error message on each of the ajax status place holder
-  $('.ajax-pending').addClass('text-danger').append(response.responseJSON.data);
+  $('.js-item-pending').addClass('text-danger').append(response.responseJSON.data);
 }
 
 var itemStatusIds = [];
@@ -107,12 +106,15 @@ function runItemAjaxForQueue() {
 }
 
 function itemQueueAjax(id, el) {
+  if (el.hasClass('js-item-pending')) {
+    return;
+  }
   clearTimeout(itemStatusTimer);
   itemStatusIds.push(id);
   itemStatusEls[id] = el;
   itemStatusTimer = setTimeout(runItemAjaxForQueue, itemStatusDelay);
-  el.addClass('ajax-pending').removeClass('hidden')
-    .find('.status').removeClass('hidden');
+  el.addClass('js-item-pending').removeClass('hidden');
+  el.find('.status').removeClass('hidden');
 }
 
 function checkItemStatus(el) {

themes/bootstrap3/js/check_save_statuses.js

@@ -6,20 +6,19 @@ function displaySaveStatus(itemLists, $item) {
     var html = '<ul>' + itemLists.map(function convertToLi(l) {
       return '<li><a href="' + l.list_url + '">' + htmlEncode(l.list_title) + '</a></li>';
     }).join('') + '</ul>';
-    $item.find('.savedLists')
-      .removeClass('ajax-pending').addClass('loaded')
-      .find('.js-load').replaceWith(html);
+    $item.removeClass('js-save-pending');
+    $item.find('.savedLists').addClass('loaded');
+    $item.find('.js-load').replaceWith(html);
   }
 }
 
 function saveStatusFail(response, textStatus) {
-  $('.ajax-pending').empty();
   if (textStatus === 'abort' || typeof response.responseJSON === 'undefined') {
-    $('.ajax-pending .savedLists').addClass('hidden');
+    $('.js-save-pending .savedLists').addClass('hidden');
     return;
   }
   // display the error message on each of the ajax status place holder
-  $('.ajax-pending .savedLists').addClass('alert-danger').append(response.responseJSON.data);
+  $('.js-save-pending .savedLists').addClass('alert-danger').append(response.responseJSON.data);
 }
 
 var saveStatusObjs = [];
@@ -62,7 +61,6 @@ function runSaveAjaxForQueue() {
         }
       }
     }
-    saveStatusObjs = [];
     saveStatusRunning = false;
   })
   .fail(function checkItemStatusFail(response, textStatus) {
@@ -71,13 +69,17 @@ function runSaveAjaxForQueue() {
   });
 }
 function saveQueueAjax(obj, el) {
+  if (el.hasClass('js-save-pending')) {
+    return;
+  }
   clearTimeout(saveStatusTimer);
   saveStatusObjs.push(obj);
   saveStatusEls[obj.source + '|' + obj.id] = el;
   saveStatusTimer = setTimeout(runSaveAjaxForQueue, saveStatusDelay);
+  el.addClass('js-save-pending');
   el.find('.savedLists')
-    .append('<span class="js-load">' + VuFind.translate('loading') + '...</span>')
-    .addClass('ajax-pending').removeClass('loaded hidden');
+    .removeClass('loaded hidden')
+    .append('<span class="js-load">' + VuFind.translate('loading') + '...</span>');
   el.find('.savedLists ul').remove();
 }