Refactor the gallery dialog into a jQuery widget

1 files changed, 22 insertions, 5 deletions

diff --git a/lib/gallery.common.js b/lib/gallery.common.js
index 1eaa6db2..e063462e 100644
--- a/lib/gallery.common.js
+++ b/lib/gallery.common.js
@@ -2,17 +2,15 @@
  * To change this template, choose Tools | Templates
  * and open the template in the editor.
  */
-(function () {
+(function ($) {
   $.fn.showMessage = function(message) {
     return this.each(function(i){
       $(this).effect("highlight", {"color": "white"}, 3000);
       $(this).animate({opacity: 1.0}, 6000);
     });
   };
-})(jQuery);
 
 // Vertically align a block element's content
-(function () {
   $.fn.vAlign = function(container) {
     return this.each(function(i){
       if (container == null) {
@@ -26,10 +24,8 @@
       $(el).css('margin-top', nh);
     });
   };
-})(jQuery);
 
 // Get the viewport size
-(function () {
   $.getViewportSize = function() {
     return {
       width : function() {
@@ -40,4 +36,25 @@
       }
     };
   };
+
+  /**
+   * Toggle the processing indicator, both large and small
+   * @param elementID Target ID, including #, to apply .gLoadingSize
+   */
+  $.fn.showLoading = function() {
+    return this.each(function(i){
+      var size;
+      switch ($(this).attr("id")) {
+      case "#gDialog":
+        case "#gPanel":
+          size = "Large";
+        break;
+      default:
+        size = "Small";
+        break;
+      }
+      $(this).toggleClass("gLoading" + size);
+    });
+  };
+
 })(jQuery);