[extensions-web] Add a "Loading, please wait..." element when loading a page

[Jasper St. Pierre <jstpierre src gnome org>]

commit d3aea12df51835a73f5e293d6c7cfe9b7972eb70
Author: Jasper St. Pierre <jstpierre mecheye net>
Date:   Wed Dec 14 15:09:21 2011 -0500

    Add a "Loading, please wait..." element when loading a page

 sweettooth/static/css/sweettooth.css |   22 ++++++++++++++++++++++
 sweettooth/static/js/paginator.js    |    4 ++++
 2 files changed, 26 insertions(+), 0 deletions(-)
---
diff --git a/sweettooth/static/css/sweettooth.css b/sweettooth/static/css/sweettooth.css
index 5093d32..ae03952 100644
--- a/sweettooth/static/css/sweettooth.css
+++ b/sweettooth/static/css/sweettooth.css
@@ -178,6 +178,28 @@ hr.bottom_shadow {
 /* Extension view */
 /* ==================================================================== */
 
+#extensions-list {
+    position: relative;
+}
+
+#extensions-list.loading {
+    opacity: 0.5;
+}
+
+#extensions-list .loading-page {
+    background: #EEEEEC;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
+    padding: .5em;
+    text-align: center;
+
+    position: absolute;
+    left: 50%;
+    width: 300px;
+    margin-left: -150px;
+}
+
 ul.extensions {
     margin-top: 0;
 }
diff --git a/sweettooth/static/js/paginator.js b/sweettooth/static/js/paginator.js
index 2ef2ba6..cbd6a54 100644
--- a/sweettooth/static/js/paginator.js
+++ b/sweettooth/static/js/paginator.js
@@ -40,6 +40,9 @@ define(['jquery', 'jquery.hashchange'], function($) {
         if (context === undefined)
             context = 3;
 
+        var $loadingPageContent = $('<div>', {'class': 'loading-page'}).
+            text("Loading page... please wait");
+
         var $elem = $(this);
         var numPages = 0;
         var $beforePaginator = null;
@@ -47,6 +50,7 @@ define(['jquery', 'jquery.hashchange'], function($) {
 
         function loadPage() {
             $elem.addClass('loading');
+            $loadingPageContent.prependTo($elem);
 
             $.ajax({
                 url: url,