From 1b804c0189a6697a9eb0b747713539b8763d8093 Mon Sep 17 00:00:00 2001
From: Sanj <b@pad.ma>
Date: Wed, 14 Dec 2011 02:40:19 +0530
Subject: [PATCH] start to fix image gallery sizing issues

---
 itf/static/css/noel/inner.css |  3 ++-
 itf/static/js/insidepage.js   | 21 ++++++++++++++++++---
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/itf/static/css/noel/inner.css b/itf/static/css/noel/inner.css
index 2ad7097..c3cdcde 100755
--- a/itf/static/css/noel/inner.css
+++ b/itf/static/css/noel/inner.css
@@ -483,7 +483,8 @@ left:0;
 right:0;
 margin:0 auto;
 width:600px;
-max-height:500px; /*SANJ, PLEASE DO THE RESIZE IN JS*/
+
+/* max-height:500px; */ /*SANJ, PLEASE DO THE RESIZE IN JS*/
 min-height:200px;
 overflow-y:auto;
 background-color:#FFF; 
diff --git a/itf/static/js/insidepage.js b/itf/static/js/insidepage.js
index 0f2cd81..8665d22 100755
--- a/itf/static/js/insidepage.js
+++ b/itf/static/js/insidepage.js
@@ -55,19 +55,34 @@ $('.thumbsDetails').live("click", function(e) {
     if (thisIndex < (totalImages - 1)) {
         var hasNext = true;
         var nextImage = $(this).parent().find(".thumbsDetails").eq(thisIndex + 1);
+        var preloadImage = new Image();
+        preloadImage.src = nextImage.attr("data-bigimage");
     }
+
     if (thisIndex > 0 && totalImages > 1) {
         var hasPrev = true;
         var prevImage = $(this).parent().find(".thumbsDetails").eq(thisIndex - 1);
     }
-
+    var $lbox = $('#lightboxContent');
+    var $cont = $('<div />').addClass("lightboxContainer");
     var bigImage = $(this).attr("data-bigimage");
     var $img = $('<img />').attr("src", bigImage).addClass("lightboxImg");    
+    $img.appendTo($cont);
+    var imgWidth = $img.width();
+    var imgHeight = $img.height();
+    var lightboxWidth = imgWidth + 40;
+    var lightboxHeight = imgHeight + 60;
+    $('#lightboxPanel').width(lightboxWidth);
+    $('#lightboxPanel').height(lightboxHeight);
+    var viewportWidth = $(window).width();
+    var viewportHeight = $(window).height();
+    //FIXME: Add conditionals for if image bigger than viewport
+
 //    showLightbox($img);
     var title = $(this).hasAttr("title") ? $(this).attr("title") : '';
 //    var $c = $('#lightboxContent');
-    var $cont = $('<div />').addClass("lightboxContainer");
-    $img.appendTo($cont);
+
+
     if (title != '') {    
       var $caption = $('<div />').addClass("lightboxCaption").text(title).appendTo($cont);
     }