$.jqm.params.toTop = true;
$(document).ready( function() {
	$('#modalWindow').jqm({toTop: true, onShow: customModal});
});

var customModal = function(hash) { 
	hash.w.show();
};

function openModal() {
	var widths = [];
	var captions = [];
	var images = [];
    for (i = 0; i < arguments.length; i++) { // pull data out of arguments array and sort into images and captions
    	if (isEven(i)) { // even items in the array are images
    		var tempImage = new Image(); // for image preloading.
    		$(tempImage).attr("src", "/assets/images/kitchenplanningsuites/" + arguments[i]);
    		$(tempImage).addClass("pic");
    		images.push(tempImage); 
    	} else { // odd items are captions
    		captions.push(arguments[i]);
    	}
    }
    for (i = 0; i < images.length; i++) {
    	$(images[i]).load( function() {
    		if (jQuery.browser.msie == true)  {
    			widths.push(this.width + 40);
			} else {
				widths.push(this.width);
			}
    		if (widths.length == images.length) {
    			processModal(images, captions, widths);
    		}
		});
    }
}

function processModal(images, captions, widths) {
	var $win = $("#modalWindow");
	var $modal = $("#modalContent");
	var $winWrappers = $(".winWrappers");
	var	currentPic = 0; // tracks status based on next/prev links
	
	$modal.children("img.pic").remove();	 // clears any existing image
	$modal.prepend( $(images[currentPic]) ); // adds new one from the array we created above
	var caption = captions[currentPic];
	$("#modalCaption").text(caption); // captions are a second array, same order as images
	var numberOf = "Image 1  of " + images.length;
	$("#imageNum").text(numberOf);
	$modal.width(widths[currentPic]);
	if (jQuery.browser.msie == true) {
		$winWrappers.width(widths[currentPic]);
	} else {
		$winWrappers.width(widths[currentPic] + 40);
	}
	// $modal.css('-moz-border-radius', '16px');
	// $modal.css('-webkit-border-radius', '16px');
	$win.jqmShow();
	if (images.length < 2) {
		$(".prevNext").hide();
	} else {
		$(".prevNext").show();
	}
	
	$(".prevNext").click(function(e) { // same function for both links
		e.preventDefault();
		// nextPic and prevPic have different logic for treating currentPic variable but functionally it's all the same
		if ($(this).attr("id") == "nextPic") { 
			if (currentPic < images.length-1) {
				currentPic++;
			} else {
				currentPic = 0;
			}
		} else {
			if (currentPic > 0) {
				currentPic--;
			} else {
				currentPic = images.length-1;
			}
		}
		$modal.children("img.pic").remove();	// clear current image
		$modal.width(widths[currentPic]);
		if (jQuery.browser.msie == true) {
			$winWrappers.width(widths[currentPic]);
		} else {
			$winWrappers.width(widths[currentPic] + 40);
		}
		$modal.prepend($(images[currentPic])); // add the new one
		var caption = captions[currentPic];
		$("#modalCaption").text(caption); // grab new caption
		var currentImgNum = "Image " + parseInt(currentPic + 1) + " of " + parseInt(images.length); 
		$("#imageNum").text(currentImgNum); // update text
	});
}

function isEven(value) {
	if (value%2 == 0)
		return true;
	else
		return false;
}