Updated vertical alignment of thumbnails.

1 files changed, 41 insertions, 25 deletions

diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js
index 8be523a5..c6907959 100644
--- a/themes/default/js/ui.init.js
+++ b/themes/default/js/ui.init.js
@@ -10,19 +10,37 @@ var shortForms = new Array(
 );
 
 $(document).ready(function() {
+  
+  // Initilize menus
+  //http://docs.jquery.com/UI/Menu
+  //http://docs.jquery.com/UI/Menu/menu < options
+  // http://jquery-ui.googlecode.com/svn/branches/dev/menu/ui/ui.menu.js
+  //$("#gSiteMenu").menu();
+  
+  $("ul.gMenu").addClass("sf-menu");
+  $("#gViewMenu ul.gMenu").addClass("sf-menu");
+  
+  // Superfish menu options
+  $('ul.sf-menu').superfish({
+    delay: 500,
+    animation: {
+      opacity:'show',
+      height:'show'
+    },
+    speed: 'fast'
+  });
 
   // Album view only
   if ($("#gAlbumGrid").length) {
     // Vertical align thumbnails/metadata in album grid
-    $(".gItem").wrapInner("<div></div>");
     $('.gItem div').vAlign();
   }
 
   // Photo/Item item view only
   if ($("#gItem").length) {
     // Ensure that sized image versions
-	// fit inside their container
-	sizedImage();
+    // fit inside their container
+    sizedImage();
 
     // Add scroll effect for links to named anchors
     $.localScroll({
@@ -32,20 +50,6 @@ $(document).ready(function() {
     });
   }
 
-  // Apply Superfish menus
-  $("ul.gMenu").addClass("sf-menu");
-  $("#gViewMenu ul.gMenu").addClass("sf-menu");
-
-  // Superfish menu options
-  $('ul.sf-menu').superfish({
-    delay: 500,
-    animation: {
-      opacity:'show',
-      height:'show'
-    },
-    speed: 'fast'
-  });
-
   // Apply modal dialogs
   $(".gMenuLink").addClass("gDialogLink");
   $("#gLoginLink").addClass("gDialogLink");
@@ -60,14 +64,26 @@ $(document).ready(function() {
 });
 
 // Vertically align a block element's content
-$.fn.vAlign = function() {
-  return this.each(function(i){
-    var ah = $(this).height();
-    var ph = $(this).parent().height();
-    var mh = (ph - ah) / 2;
-    $(this).css('margin-top', mh);
-  });
-};
+(function ($) {
+  $.fn.vAlign = function(container) {
+    return this.each(function(i){
+     if(container == null) {
+       container = 'div';
+      }
+      var paddingPx = 10; //change this value as you need (It is the extra height for the parent element)
+      $(this).html("<" + container + ">" + $(this).html() + "</" + container + ">");
+      var el = $(this).children(container + ":first");
+      var elh = $(el).height(); //new element height
+      var ph = $(this).height(); //parent height
+      if(elh > ph) { //if new element height is larger apply this to parent
+        $(this).height(elh + paddingPx);
+       ph = elh + paddingPx;
+      }
+      var nh = (ph - elh) / 2; //new margin to apply
+      $(el).css('margin-top', nh);
+    });
+  };
+})(jQuery);
 
 /**
  * Reduce width of sized photo if it's wider than its parent container