$(function(){
		$(".starify, .starify-disabled").children().not(":input").hide();
		
		$(".starify").stars({
			cancelShow: false,
			oneVoteOnly: true,
			callback: function(ui, type, value)
			{
				$.get("rate.php", { "imageid":$(ui.element).attr("imageid"), "rating":value});	
			}
		});	
		
		$(".starify-disabled").stars({
			cancelShow: false,
			disabled: true
		});	
		
		$("#upload_form, #tippen_form").validate({
			errorPlacement: function() {},
			invalidHandler: function(form, validator) {
				var errors = validator.numberOfInvalids();
				if (errors) {
					var message = errors == 1 
						? 'U heeft 1 veld niet (correct) ingevuld. Dit veld is verplicht voor deelname.'
						: 'U heeft ' + errors + ' velden niet (correct) ingevuld. Deze velden zijn verplicht voor deelname.';					
					if ($(validator.invalidElements()).length == 1 && $(validator.invalidElements()).filter("#checkbox").length) {
						showModalMessage("U kunt alleen doorgaan wanneer u akkoord gaat met de voorwaarden.");
						message = "U kunt alleen doorgaan wanneer u akkoord gaat met de voorwaarden.";
					}
					if ($(validator.invalidElements()).filter("#checkbox").length) {
						$("#voorwaarden").addClass("error");
					} else {
						$("#voorwaarden").removeClass("error");
					}
					$("#error").html(message);
					$("#error").fadeIn().click(function() {$(this).fadeOut()});
				} else {
					$("#error").hide();
				}
			}
		});
		
		$("img.thumbnail").click(function(e){
			e.preventDefault();
			loadImageModal($(this).attr("imageid"));
		});
		
		$("#file").live("change", function(e) {
			var filename = $(this).val();
			if (filename.substring(filename.lastIndexOf('.') + 1, filename.length) != "jpg" &&
					filename.substring(filename.lastIndexOf('.') + 1, filename.length) != "JPG") {
				showModalMessage("Alleen foto's van het type JPG zijn toegestaan. Kies a.u.b. een andere foto.");
				$("#file").replaceWith("<input type='file' id='file' name='file' class='required' />");
			};
		});
		
});

function showModalMessage(msg) {
	$.modal("<p>"+msg+"</p><input style='position: absolute; top: 150px;' type='button' value='Sluiten' class='close' />", {
		overlayClose: true,
		escClose :true,
		closeClass: 'close',
		containerCss: {
			backgroundColor:"#fff",
			borderColor:"#0063dc",
			height:150,
			width:400
		}
	});
}

function loadImageModal(imageid){
	$.get('modal.php', {"imageid": imageid }, function(data) {
		if(data){
			$.modal(data, {
				overlayClose: true,
				onShow: function() {
					$("#simplemodal-container a.modalCloseImg").addClass("imageModal");
					if (!$("#simplemodal-container #prevImg").length) {
						// first image (no prev button)
					} else if (!$("#simplemodal-container #nextImg").length) {
						// last image (no next button)
						$("#simplemodal-container a.modalCloseImg").addClass("last");
					}
				}
			});			
			$("#simplemodal-container .starify, #simplemodal-container .starify-disabled").children().not(":input").hide();
			$("#simplemodal-container .starify").stars({
				cancelShow: false,
				oneVoteOnly: true,
				callback: function(ui, type, value)
				{
					$.get("rate.php", { "imageid":$(ui.element).attr("imageid"), "rating":value});	
				}
			});	
			$("#simplemodal-container .starify-disabled").stars({
				cancelShow: false,
				disabled: true
			});	
		}
	});
}

function openInModal(url){
	$.get(url, function(data) {
		if(data){
			$.modal(data,{
				overlayClose:true,
				containerCss:{
					backgroundColor:"#fff",
					borderColor:"#0063dc",
					height:550,
					width:600
				}
			});
		}
	});
}