function CJlightbox(LightboxContainer) {
	var Active = LightboxContainer;
	var largeTitle = $(Active + " .image").children("img").attr("title");
    var CurrentPosition = $(Active + " img.current").parent().attr("rel");       
    var NumberImages = $(Active + " .thumbnails > a").length;

    $(Active + " p.title").html(largeTitle);
    $(Active + " p.numberOf span.total").html(NumberImages);
    $(Active + " span.current").html(CurrentPosition);
    $(Active + " p.previousImage").addClass("hidden");

    if (NumberImages < "10") {
        $("#" + Active + " a.next").addClass("disabled");
    }

    if (NumberImages == "1") {
        $("#" + Active + " p.nextImage").addClass("hidden");    
    }
}

function CJlightboxLoad(LightboxContainer) {
    CJlightbox(LightboxContainer);
	$(LightboxContainer).modal({
		onOpen: function (dialog) {
		dialog.overlay.fadeIn('slow', function() {  
			      dialog.container.fadeIn('slow');
			      dialog.data.fadeIn('slow');
	      });
		},
		onClose: function (dialog) {	
			dialog.data.fadeOut('slow');
			dialog.container.fadeOut('slow', function () {
			      dialog.overlay.fadeOut('slow', function () {
			      $.modal.close();
			      $(".thumbnails-scrolling").scrollable({ size: 9, items: ".thumbnails", speed: 400 }); 
	      });
	      });
	  }
	});
	return false;
}

$(document).ready(function() {
    $(".thumbnails-scrolling").scrollable({ size: 9, items: ".thumbnails", speed: 400 });

    // What happens when a thumbnail is clicked
    $(".thumbnails a").click(function() {
        // Set Variables
        var Active = $(this).parent().parent().parent().attr("id");
        var NumberImages = $("#" + Active + " .thumbnails > a").length;
        var largePath = $(this).attr("href");
        var largeAlt = $(this).children("img").attr("title");
        var largeTitleNew = $(this).children("img").attr("title");
        var CurrentPosition = $(this).attr("rel");

        // If any thumbnails have class="current" - remove and add class="current" to click image
        $("#" + Active + " .thumbnails a img").removeClass("current");
        $(this).children("img").addClass("current");

        // Transition effects
        $("#" + Active + " .image").fadeOut('slow', function() {
            // Update values of large image, desciprtion and current position
            $("#" + Active + " .image img").attr({ src: largePath, alt: largeAlt, title: largeAlt });
            $("#" + Active + " p.title").html(largeTitleNew);
            $("#" + Active + " span.current").html(CurrentPosition);
            $(Active + " p.title").html(largeTitleNew);
        });

        // Finish Transition              
        $("#" + Active + " .image").fadeIn('slow');

        // Pagination Controls
        if (CurrentPosition == "1") {
            $("#" + Active + " p.previousImage").addClass("hidden");
        }
        if (CurrentPosition > "1") {
            $("#" + Active + " p.previousImage").removeClass("hidden");
        }
        if (CurrentPosition == NumberImages) {
            $("#" + Active + " p.nextImage").addClass("hidden");
        }
        if (CurrentPosition < NumberImages) {
            $("#" + Active + " p.nextImage").removeClass("hidden");
        }
        return false;
    });

    // What happens when the previous button is clicked
    $("p.previousImage a").click(function() {
        var Active = $(this).parent().parent().attr("id");
        var CurrentPosition = $("#" + Active + " img.current").parent().attr("rel");
        var PreviousPosition = CurrentPosition - 1;
        $("#" + Active + " .thumbnails a[rel=" + PreviousPosition + "]").click();
        return false;
    });

    // What happens when the next button is clicked
    $("p.nextImage a").click(function() {
        var Active = $(this).parent().parent().attr("id");
        var CurrentPosition = $("#" + Active + " img.current").parent().attr("rel");
        var NextPosition = ++CurrentPosition;
        $("#" + Active + " .thumbnails a[rel=" + NextPosition + "]").click();
        return false;
    });

});