$(function() {
	//cufon text replacements
    Cufon.replace('h1', { fontFamily: 'FrutigerNextLT' }); 
	Cufon.replace('h2', { fontFamily: 'FrutigerNextLT' });
	Cufon.replace('h2.red', { fontFamily: 'FrutigerNextLT' });
	Cufon.replace('h3', { fontFamily: 'FrutigerNextLT' });
	Cufon.replace('h4', { fontFamily: 'FrutigerNextLT' });
	Cufon.replace('p.quote', { fontFamily: 'FrutigerNextLT' });
	Cufon.replace('p.kidspicture', { fontFamily: 'Lewis' });
	
	//load progress
	
	//var settings = {
	//  'wrapper': $('#album'),
	//  'container': $('#album'),
	//  'loadingClass': 'loading',
	//  'callback': function(){}
	//};

	//$('div#loader').loader(settings);
						
	//cursus inschrijven ajax
	$("select#fotocursus-course-data", this) .click(
		function() { 
			sCourseData = $(this.options[this.selectedIndex]).attr("value");
			$("select#fotocursus-course-id").removeAttr('disabled');
			$("select#fotocursus-course-id").load("/ajax.getCourseTimes.php?blok-id="+eval(sCourseData)+"");
		}
	); 
	
	//form value empty
	$("input#amount", this).click( 
		function() { 
			$(this).removeAttr("value");
		}
	);
	
	//open link in new window

	$('.new-window', this).live("click", (
		function(){
			url = $(this).attr('url');
			window.open(url,'Foto Verschoore Beeldbeleving', 'width=400,height=500,scrollbars=yes,toolbar=no,location=no');
			return false;
		})
	);

	//set focus on requested fields
	$(document).ready(function() {
		$("input.focus").focus();
	});
	
	//hover buttons
	$("button", this) .hover(
		function() { 
			$(this).css("cursor", "pointer");
		}
	);
	
	//hide and show submenu
	$("img.submenu", this) .hover(
		function() { 
			$(this).parent().children("ul").css("display", "inline");	
		}
	);
	$("ul.submenu", this) .hover(
		function() {},
		function() { 
			$(this).css("display", "none");
		}
	);
	
	var hoverLoginConfig = {    
		sensitivity: 3,
		interval: 200, 
		over: loginShow,
		timeout: 500, 
		out: loginHide 
	};
	var hoverLoginConfigFocus = {    
		sensitivity: 3,
		interval: 200, 
		over: loginShow,
		timeout: 500
	};

	//hide and show login fields
	$("div#login input", this).focus(function() {
		if ($(this).attr("value") == 'e-mailadres' || $(this).attr("value") == 'wachtwoord') {
			$(this).attr("value", '');
		}
		$("div#login").hoverIntent(hoverLoginConfigFocus);
	});
	$("div#login input").blur(function() {
		$("div#login").hoverIntent(hoverLoginConfig);
	});
	$("div#login").hoverIntent(hoverLoginConfig);

	function loginShow() {
		$("div#login-content").fadeIn('fast');
		$("div#login-content form").show();
		$("div#login").animate({ 
			height: "135px"
		}, 300 );
	}
	function loginHide() {
		$("div#login-content").fadeOut('fast');
		$("div#login-content form").hide();
		$("div#login").animate({ 
			height: "25px"
		}, 300 );
	}
	/*
	$("div#login", this) .hover(
		function() { 
			$("div#login-content").fadeIn('fast');
			$("div#login-content form").show();
			$("div#login").animate({ 
				height: "135px"
			}, 300 );
		}, 
		function() { 
			$("div#login-content").fadeOut('fast');
			$("div#login-content form").hide();
			$("div#login").animate({ 
				height: "25px"
			}, 300 );
		}
	); /*/
	
	var hoverSearchConfig = {    
		sensitivity: 3,
		interval: 200, 
		over: searchShow,
		timeout: 500, 
		out: searchHide 
	};

	//hide and show login fields
	//$("div#search").hoverIntent(hoverSearchConfig);
	
	function searchShow() {
		$("div#search-content").fadeIn('fast');
		$("div#search").animate({ 
			height: "120px"
		}, 300 );
	}
	function searchHide() {
		$("div#search-content").fadeOut('fast');
		$("div#search").animate({ 
			height: "40px"
		}, 300 );
	}
	
	/*
	//hide and show search fields
	$("div#search", this) .hover(
		function() { 
			$("div#search-content").fadeIn('fast');
			$("div#search").animate({ 
				height: "120px"
			}, 300 );
		}, 
		function() { 
			$("div#search-content").fadeOut('fast');
			$("div#search").animate({ 
				height: "40px"
			}, 300 );
		}
	); */
	
	//floating shoppingcart
	var name = "#shoppingcart-float";
	var menuYloc = null;
		
	menuYloc = parseInt($("#shoppingcart-float").css("top").substring(0,$("#shoppingcart-float").css("top").indexOf("px")))
	$(window).scroll(function () { 
		offset = menuYloc+$(document).scrollTop()+"px";
		$("#shoppingcart-float").animate({top:offset},{duration:500,queue:false});
	});
	
	$("#shoppingcart-float").hover(
	  function () {
		$("#shoppingcart-float").css("width", "120px");
		$("#shoppingcart-float").css("cursor", "pointer");
		$("#shoppingcart-float-summary").show();
	  }, 
	  function () {
		$("#shoppingcart-float").css("width", "50px");
		$("#shoppingcart-float-summary").hide();
	  }
	);
	$("#shoppingcart-float").click(function () { 
	  parent.location='/winkelmand/';
	});
	$("#shoppingcart").click(function () { 
	  parent.location='/winkelmand/';
	});
	$("#shoppingcart").hover(function () {
	  $("#shoppingcart").css("cursor", "pointer");
	});
					
	//profile box clickable
	$("div.profile-album-container", this).click(function() {
		url = $(this).attr("url");
		parent.location=url;
	});
	
	//glow images on hover
	$("img.glow, input:image.glow", this) .hover(
		function() { 
			if($(this).attr("src").indexOf("-on") == -1) {
				$(this).fadeTo("250", 0.5);
				$(this).attr("src", $(this).attr("src").replace(".png","-on.png#hover"));
				$(this).fadeTo("250", 1);
			} 
		}, 
		function() { 
			if($(this).attr("src").indexOf("-on.png#hover") != -1) {
				$(this).attr("src", $(this).attr("src").replace("-on.png#hover", ".png"));
			}
		}
	); 

	//album hover background
	$("div.subalbum-container", this).hover(
	  function () {
		$(this).addClass("hover");
	  }, 
	  function () {
		$(this).removeClass("hover");
	  }
	);
	$("div.profile-album-container", this).hover(
	  function () {
		$(this).addClass("hover");
	  }, 
	  function () {
		$(this).removeClass("hover");
	  }
	);
	
	
	//lightbox album photos
	
	$('div.thumb a').lightBox(); 
	
	/* DRAG & DROP BASED SHOPPINGCART */
	
	//define draggable shoppingcart items
	$(".shoppingcart-draggable").livequery(function() { 
		$(this).draggable({ 
			grid: [5, 5],
			opacity: 0.35, 
			zIndex: 2500,
			revert: 'invalid',
			addClasses: false
		});
	});
	
	//handle click events
	$(".shoppingcart-draggable").livequery(function() {
		$(this).dblclick(function (){ 
			//determine current item position (in selection or cart)
			sCurrentPosition = $(this).parent().attr("id");
			//determine item
			sItem = $(this).attr("item");
			if (sCurrentPosition == 'shoppingcart-selection') {
				$("#shoppingcart-container").append(this);
				
				//remove style attribute and reset floating position
				$(this).removeAttr("state");
				$(this).children("img.large-image").remove();
				$(this).children("img:small-image").show();
				$(this).removeAttr("style");
				$(this).attr("class", "shoppingcart-draggable");
				$(this).children("img.enlarge-image").remove();
				
				//handle the drop
				dropInCart(sItem);
			} 
			if (sCurrentPosition == 'shoppingcart-container') {
				$("#shoppingcart-selection").append(this);
				$(this).append("<img src=\"/img/icon-enlarge-thumb.gif\" class=\"enlarge-image\" />");
				//handle the drop
				dropInSelection(sItem);
			}
		});
	});
	$(".shoppingcart-draggable").livequery(function() {
		$(this).click(function (){ 
			//determine current item position (in selection or cart)
			sCurrentPosition = $(this).parent().attr("id");
			//determine item
			sItem = $(this).attr("item");
			if (sCurrentPosition == 'shoppingcart-container') {
				configureItem(sItem);		
			}
		});
	});
	//handle adding or removing items from cart
    $("#shoppingcart-container").droppable({
		drop: function(event, ui) { 
			//determine item
			sItem = $(ui.draggable).attr("item");
			//add item to shoppingcart container
			$(this).append(ui.draggable);
			
			//remove style attribute and reset floating position
			$(ui.draggable).removeAttr("state");
			$(ui.draggable).children("img.large-image").remove();
			$(ui.draggable).children("img:small-image").show();
		
			$(ui.draggable).removeAttr("style");
			$(ui.draggable).attr("class", "shoppingcart-draggable");
			$(ui.draggable).children("img.enlarge-image").remove();
			//handle the drop
			dropInCart(sItem);
		}
		
    });
	 $("#shoppingcart-selection").droppable({
      drop: function(event, ui) { 
			//determine item
			sItem = $(ui.draggable).attr("item");
			//add item to shoppingcart selection
			$(this).append(ui.draggable);
			
			//remove style attribute and reset floating position
			$(ui.draggable).removeAttr("style");
			$(ui.draggable).attr("class", "shoppingcart-draggable");
			$(ui.draggable).children("img.enlarge-image").remove();
			$(ui.draggable).append("<img src=\"/img/icon-enlarge-thumb.gif\" class=\"enlarge-image\" />");
			
			//handle the drop
			dropInSelection(sItem);
	  }
    });
	
	
	function dropInCart(sItem) {
		configureItem(sItem);
	}
	function dropInSelection(sItem) {

	}
	function configureItem(sItem) {
		$("#shoppingcart-configurator-item").empty();
		$("#shoppingcart-configurator-item").append("<img src=\""+sItem+"\" />");
		$("#shoppingcart-configurator").fadeIn("fast");
	}
	
	//rotate banner
	$("div#banner-rotator").cycle({ 
			fx:      			'fade', 
			speedIn:  			600, 
			speedOut: 			1000, 
			sync:     			1, 
			delay:    			500,
			pager:    			'#pager', 
			containerResize:	0,
			pagerAnchorBuilder: pagerFactory
	});
	function pagerFactory(idx, slide) {
        var s = idx > 10 ? ' style="display:none"' : '';
        return '<li'+s+'><a href="#">'+(idx+1)+'</a></li>';
    };
	
	//enlarge or shrink thumbnails 
	$("img.enlarge-image").livequery(function() {
		$(this).click( function () {
			sHoverState = $(this).parent().attr("state");
			oThumbnail = $(this).parent();
			if (sHoverState == 'active') {
				$(this).attr("src", "../img/icon-enlarge-thumb.gif");
				shrinkThumbnail(oThumbnail);
			} else {
				$(this).attr("src", "../img/icon-shrink-thumb.gif");
				enlargeThumbnail(oThumbnail);
			}
		});
	});

	function enlargeThumbnail(oThumbnail) {
		sImage = $(oThumbnail).attr("item");
		$(oThumbnail).animate({ 
			width: "242px",
			height: "242px"
		}, 500 );
		$(oThumbnail).attr("state", "active");
		$(oThumbnail).children("img:first").hide();
		$(oThumbnail).children("img:first").css("class", "small-image");
		$(oThumbnail).prepend("<img src=\""+sImage+"\" class=\"large-image\" />");
	}
	function shrinkThumbnail(oThumbnail) {
		sImage = $(oThumbnail).attr("item");
		$(oThumbnail).animate({ 
			width: "110px",
			height: "110px"
		}, 500 );
		$(oThumbnail).removeAttr("state");
		$(oThumbnail).children("img.large-image").remove();
		$(oThumbnail).children("img:small-image").show();
	}
	
	//load configurator 
	
	$("select#shoppingcart-type", this) .click(
		function() { 
			sProductType = $(this.options[this.selectedIndex]).attr("value");
			$("select#shoppingcart-product").removeAttr('disabled');
			$("select#shoppingcart-product").load("ajax.loadShoppingcartProducts.php?sProductType="+sProductType+"");
		}
	); 
	$("select#shoppingcart-product", this) .click(
		function() { 
			iProductId = $(this.options[this.selectedIndex]).attr("value");
			$("#shoppingcart-configurator-options").load("ajax.loadShoppingcartProductOptions.php?iProductId="+iProductId+"");
		}
	); 
	
	/* UL BASED TICKER */
	
	//configuration
	var iInterval = 3000;
	var iSumTickers = $("div#ticker ul:first > li").size();
	var bPause = false;
	var iTickerPosition = 0;
	
	//display pager
	//$("div#ticker-pager > ul").append('<img src="/img/ticker-large-pager-pause.png" class="ticker-play-pause" />');
	for (i=0; i<iSumTickers; i++) {
		$("div#ticker-pager > ul").append("<li id=\"ticker-pager-"+i+"\">"+(i+1)+"</li>");
	}
	
	//listeners
	$("div#ticker-pager > ul > li").click(function () { 
		//go to requested ticker
		iRequestedTicker = $(this).attr("id").substr(13,2);

		gotoTicker(iRequestedTicker);
		//pause ticker
		pauseTicker();
    });
	$("img.ticker-play-pause").click(function () { 
		if (bPause == false) {
			pauseTicker();
		} else {
			playTicker();
		}
    });
	$("div#ticker > ul:first >li").click(function () { 
		//go to requested ticker
		iRequestedTicker = $(this).attr("id").substr(12,2);
		gotoTicker(iRequestedTicker);
		//pause ticker
		pauseTicker();
    });
	
	function setTicker() {
		//set ticker selector
		$("div#ticker ul:first >li").each(function() {
			$(this).removeAttr("class");
		});
		$("div#ticker ul:first >li").slice(iTickerPosition, parseInt(iTickerPosition)+1).attr("class", "activeTicker");
		
		//set ticker content
		$("div.ticker-content").each(function() {
			$(this).hide();
		});
		$("div#ticker-"+iTickerPosition).show();
		
		//set pager
		$("div#ticker-pager > ul > li").each(function() {
			$(this).removeAttr("class");
		});
		$("li#ticker-pager-"+iTickerPosition).attr("class", "activePager");
	}
	function rotateTicker() {
		//show (requested) ticker
		setTicker();
		
		//pause or autoplay ticker
		if (bPause == false) {
			iTickerPosition++;
		}
		//reset ticker
		if (iTickerPosition == iSumTickers) {
			iTickerPosition = 0;
		}
	}
	function gotoTicker(iRequestedTicker) {
		iTickerPosition = iRequestedTicker;
		//show (requested) ticker
		setTicker();
	}
	function pauseTicker() {
		bPause = true;
		$("img.ticker-play-pause").attr("src", "/img/ticker-large-pager-play.png");
	}
	function playTicker() {
		bPause = false;
		$("img.ticker-play-pause").attr("src", "/img/ticker-large-pager-pause.png");
	}

	var aKeyModifiers = [8, 46, 16, 17, 37, 38, 39, 40]; // DELETE, BACKSPACE, SHIFT, CTRL, pijltjes-toetsen
	// Textarea met maxlength-attribuut -> Aantal karakters setten in textareaname-counter
	$("textarea[maxlength]").keydown(function(e) {
		var charsleft = $(this).attr("maxlength") - $(this).val().length;
		if (charsleft < 1 && aKeyModifiers.indexOf(e.keyCode) == -1) {
			return false;
		}
	}).keyup(function() {
		var charsleft = $(this).attr("maxlength") - $(this).val().length;
		if (charsleft < 0) {
			$(this).val($(this).val().substr(0, $(this).attr("maxlength")));
			charsleft = 0;
		}
		$("#" + $(this).attr("name") + "-counter").text("Aantal karakters over: " + charsleft);
	}).triggerHandler("keyup");
});