Made it possible to rebuild all content caches from library admin. This is needed to able to view content usage for each library.

js/h5p-library-details.js

@@ -39,8 +39,19 @@ var H5PLibraryDetails= H5PLibraryDetails || {};
       $libraryInfo.append(H5PUtils.createLabeledField(title, value));
     });
     
+    var count;
+    if (H5PLibraryDetails.library.notCached !== undefined) {
+      count = -1;
+    }
+    else if (H5PLibraryDetails.library.content === undefined) {
+      count = 0; 
+    }
+    else {
+      count = H5PLibraryDetails.library.content.length;
+    }
+    
     // List counter:
-    $libraryInfo.append(H5PUtils.createLabeledField(H5PLibraryDetails.library.translations.contentCount, H5PLibraryDetails.currentContent ? H5PLibraryDetails.currentContent.length : 0));
+    $libraryInfo.append(H5PUtils.createLabeledField(H5PLibraryDetails.library.translations.contentCount, count));
     
     return $libraryInfo;
   };
@@ -49,6 +60,10 @@ var H5PLibraryDetails= H5PLibraryDetails || {};
    * Create the content list with searching and paging 
    */
   H5PLibraryDetails.createContentElement = function () {
+    if (H5PLibraryDetails.library.notCached !== undefined) {
+      return H5PUtils.getRebuildCache(H5PLibraryDetails.library.notCached);
+    }
+    
     if (H5PLibraryDetails.currentContent === undefined) {
       H5PLibraryDetails.$content = $('<div class="h5p-content empty">' + H5PLibraryDetails.library.translations.noContent + '</div>');
     }

js/h5p-library-list.js

@@ -8,6 +8,11 @@ var H5PLibraryList= H5PLibraryList || {};
   H5PLibraryList.init = function () {
     var $adminContainer = H5PIntegration.getAdminContainer();
     
+    var libraryList = H5PIntegration.getLibraryList();
+    if (libraryList.notCached) {
+      $adminContainer.append(H5PUtils.getRebuildCache(libraryList.notCached));
+    }
+    
     // Create library list
     $adminContainer.append(H5PLibraryList.createLibraryList(H5PIntegration.getLibraryList()));
   };

js/h5p-utils.js

@@ -17,7 +17,7 @@ var H5PUtils = H5PUtils || {};
         $tr.append('<th>' + value + '</th>');
       });
       
-      $table.append($thead.append($tr))
+      $table.append($thead.append($tr));
     }
     
     return $table;
@@ -51,7 +51,7 @@ var H5PUtils = H5PUtils || {};
     $field.append('<div class="h5p-value">' + value + '</div>');
     
     return $field;
-  }
+  };
   
   /**
    * Replaces placeholder fields in translation strings
@@ -61,9 +61,47 @@ var H5PUtils = H5PUtils || {};
    */
   H5PUtils.translateReplace = function (template, replacors) {
     $.each(replacors, function (key, value) {
-      template = template.replace(new RegExp('\\'+key, 'g'), value)
+      template = template.replace(new RegExp('\\'+key, 'g'), value);
     });
     return template;
+  };
+  
+  /**
+   * Makes it possbile to rebuild all content caches from admin UI.
+   * @param {Object} notCached
+   * @returns {$}
+   */
+  H5PUtils.getRebuildCache = function (notCached) {
+    var $container = $('<div class="h5p-admin-rebuild-cache"><p>' + notCached.message + '</p></div>');
+    var $button = $('<button>' + notCached.button + '</button>').appendTo($container).click(function () {
+      var $spinner = $('<div/>', {class: 'h5p-spinner'}).replaceAll($button);
+      var parts = ['|', '/', '-', '\\'];
+      var current = 0;
+      var spinning = setInterval(function () {
+        $spinner.text(parts[current]);
+        current++;
+        if (current === parts.length) current = 0;
+      }, 100);
+      
+      var $counter = $container.find('.placeholder');
+      var build = function () {
+        $.post(notCached.url, function (left) {
+          if (left === '0') {
+            clearInterval(spinning);
+            $container.remove();
+            location.reload();
           }
+          else {
+            var counter = $counter.text().split(' ', 2);
+            $counter.text(left + ' ' + counter[1]);
+            build();
+          }
+        });
+      };
+      build();
+    });
+    
+    return $container;
+  };
   
 })(H5P.jQuery);

styles/h5p-admin.css

@@ -230,3 +230,8 @@ button.h5p-admin.disabled:hover {
   top: 0;
   right: 0;
 }
+.h5p-spinner {
+  padding: 0 0.5em;
+  font-size: 1.5em;
+  font-weight: bold;
+}