/**
 * @author Peppered 
 * @author AK
 * jQuery 1.2.3
 * 
 */

$(function(){
	/**
	 * anchors (external/popup)
	 */
	$("a[rel='external']").click(function(){window.open(this.href); return false});
	var oPopWin = null;
	$("a[rel='popup']").click(function(){
		popWin = new PopupWindow();
		popWin.anchor = $(this);
		popWin.width = 650;
		popWin.height = 500;
		if (popWin.spawn())
			return false;
	});

	// dropmenu
	var menuDropSearch = new dropMenu("genreDrop", "genreKeuze");
	var menuDropSearch = new dropMenu("maandDrop", "maandKeuze");
	var menuDropSearch = new dropMenu("seizoenDrop", "seizoenKeuze");
	
	// submitHovers
	$('input.submit').hover(function(){
		$(this).addClass('submitHover');
	},function(){
		$(this).removeClass('submitHover');
	});
	$('input.button').hover(function(){
		$(this).addClass('buttonHover');
	},function(){
		$(this).removeClass('buttonHover');
	});
	$('input.textSubmit').hover(function(){
		$(this).addClass('textSubmitHover');
	},function(){
		$(this).removeClass('textSubmitHover');
	});
	
});


/**
 * slowhide
 */
function slowhide() {
	var status = readCookie("winkelmandje");
	// altijd dichtklappen op info page.
	var blnInfoPage = window.location.href.indexOf('informatie');
	var blnVriendenPage = window.location.href.indexOf('vrienden');
	//alert (blnVriendenPage);
	if (aantalBestelItems == 0 || (blnInfoPage > 1 && blnVriendenPage  < 0)|| (status == null && !aantalBestelItems)) {
		tabItem.registry["winkelmandje"]['button'].className = "visible";
		tabItem.registry["winkelmandje"]['object'].className = "invisible";
	}
	else {
		tabItem.registry["winkelmandje"]['button'].className = "invisible";
		tabItem.registry["winkelmandje"]['object'].className = "visible";
	}
//	else if(status == 'invisible' && false) { //tijdelijk opengeklapt
//		tabItem.hideTab("winkelmandje");
//	}
//					if(status == 'invisible' || status == null)
//						tabItem.hideTab("winkelmandje");
}
//addLoadEvent(slowhide);



/**
 * loadevent
 */
function addLoadEvent(func) {
	$(func);
}


/**
 * cookies
 */
function createCookie(name,value,hours)
{
//	if (hours)
//	{
//		var date = new Date();
//		date.setTime(date.getTime()+(hours*60*60*1000));
//		var expires = "; expires="+date.toGMTString();
//	}
//	else var expires = "";
	var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name)
{
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++)
	{
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

function eraseCookie(name)
{
	createCookie(name,"",-1);
}


/**
 * tabItem
 */
tabItem.registry = [];

function tabItem(id)
{
	tabItem.registry[id] = [];
	tabItem.registry[id]['button'] = document.getElementById(id+"Button");
	tabItem.registry[id]['hider'] = document.getElementById(id+"Hider");
	tabItem.registry[id]['object'] = document.getElementById(id);
	
	if(tabItem.registry[id]['button'] == null)
	{
		delete tabItem.registry[id]['button'];
		return;
	}
	if(tabItem.registry[id]['hider'] == null)
	{
		delete tabItem.registry[id]['hider'];
		return;
	}
	if(tabItem.registry[id]['object'] == null)
	{
		delete tabItem.registry[id]['object'];
		return;
	}
	
	tabItem.registry[id]['button'].onmousedown = function() {tabItem.focusTab(id);}
	tabItem.registry[id]['hider'].onmousedown = function() {tabItem.hideTab(id);}
}

tabItem.focusTab = function(id)
{
	tabItem.registry[id]['button'].className = "invisible";
	tabItem.registry[id]['object'].className = "visible";
	eraseCookie(id);
	createCookie(id, 'visible', 1);
}

tabItem.hideTab = function(id)
{
	tabItem.registry[id]['button'].className = "visible";
	tabItem.registry[id]['object'].className = "invisible";
	eraseCookie(id);
	createCookie(id, 'invisible', 1);
}


/**
 * scroll
 */
// The arguments for this object are as follows:
//  a. - The variable name you are giving this scrollObject
//  b. - ID of the target tag (from step 1)
//  c. - Width (in pixels) of your scroller
//  d. - Height (in pixels) of your scroller
//  e. - Default background colour of the outer tag, can also be hexcode in the form: #rrggbb
//  f. - Scroll direction: one of "up", "down", "left" or "right"
//  g. - Decceleration index as block is moved (nominal range: 1 => 2)
//  h. - Initial speed of a block at beginning of slide:
//         Maximum speed as this value approaches one
//         Minimum speed as this value approaches scroller height
//  i. - Delay between each incremental movement upwards (milliseconds)
//  j. - Amount of time to pause before next scroll begins (milliseconds)
//  k. - CSS class name for blocks (from step 2)

function scrollObject(objName, main, width, height, bkgcol, direct, deccel, begin, speed, pause, classname) {
  this.objName = objName;
  this.main = main;
  this.one = main + "Block1";
  this.two = main + "Block2";
  this.block = new Array();
  this.blockup = 1;
  this.divup = 1;
  this.height = height;
  this.width = width;
  this.bkgcol = bkgcol;
  this.direct = direct;
  this.deccel = Math.max(deccel, 1);
  this.begin = Math.max(Math.min(begin, (direct == "up" || direct == "down") ? height : width), 1);
  this.speed = speed;
  this.pause = pause;
  this.slide = ((direct == "up" || direct == "down") ? height : width) / this.begin;
  this.table = "<table cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td class=\"" + classname + "\" style=\"width:" + width + "px;height:" + height + "px;\">";
  this.active = false;
  this.moving = false;
  this.process = 0;
  this.mouse = false;
  this.scroll = function() {
    if (!document.getElementById) return false;
    document.getElementById(this.main).innerHTML = "<div id=\"" + this.one + "\"></div><div id=\"" + this.two + "\"></div>";
    var divList = [document.getElementById(this.main), document.getElementById(this.one), document.getElementById(this.two)];
    for (var i = 0; i <= 2; i++) {
      if (i > 0) {
        divList[i].style.position = "absolute";
        if (this.direct == "up" || this.direct == "down") {
          divList[i].style.left = "0px";
          divList[i].style.top = (i == 1) ? "0px" : ((this.direct == "up") ? "" : "-") + this.height + "px";
        } else {
          divList[i].style.left = (i == 1) ? "0px" : ((this.direct == "left") ? "" : "-") + this.width + "px";
          divList[i].style.top = "0px";
        } divList[i].innerHTML = this.table + this.block[i - 1] + "</td></tr></table>";
      } else {
        divList[i].style.position = "relative";
        divList[i].style.background = this.bkgcol;
        if (this.block.length > 1) {
          divList[i].onmouseover = new Function("if (" + this.objName + ".active) setTimeout(\"" + this.objName + ".scrollWait();\", " + this.objName + ".pause); " + this.objName + ".active = false; " + this.objName + ".mouse = true;");
          divList[i].onmouseout = new Function(this.objName + ".mouse = false;");
        }
      } divList[i].style.overflow = "hidden";
      divList[i].style.width = this.width + "px";
      divList[i].style.height = this.height + "px";
    } this.active = true;
    if (this.block.length > 1) this.process = setTimeout(this.objName + ".scrollLoop();", this.pause);
  }
  this.scrollLoop = function() {
    clearTimeout(this.process);
    if (this.moving == false && this.active == false) return false;
    var divList = [document.getElementById(this.main), document.getElementById(this.one), document.getElementById(this.two)];
    this.slide = Math.max(this.slide / this.deccel, 1);
    var slideInc = (this.direct == "up" || this.direct == "left") ? -parseInt(this.slide) : parseInt(this.slide);
    if ((this.direct == "up" && Math.max(parseInt(divList[1].style.top) + slideInc, parseInt(divList[2].style.top) + slideInc) <= 0) ||
        (this.direct == "down" && Math.min(parseInt(divList[1].style.top) + slideInc, parseInt(divList[2].style.top) + slideInc) >= 0) ||
        (this.direct == "left" && Math.max(parseInt(divList[1].style.left) + slideInc, parseInt(divList[2].style.left) + slideInc) <= 0) ||
        (this.direct == "right" && Math.min(parseInt(divList[1].style.left) + slideInc, parseInt(divList[2].style.left) + slideInc) >= 0)) {
      this.slide = ((this.direct == "up" || this.direct == "down") ? this.height : this.width) / this.begin;
      if (++this.blockup >= this.block.length) this.blockup = 0;
      this.divup = (this.divup == 1) ? 2 : 1;
      if (this.direct == "up" || this.direct == "down") {
        divList[3 - this.divup].style.top = ((this.direct == "down") ? "-" : "") + this.height + "px";
        divList[this.divup].style.top = "0px";
      } else {
        divList[3 - this.divup].style.left = ((this.direct == "right") ? "-" : "") + this.width + "px";
        divList[this.divup].style.left = "0px";
      } divList[3 - this.divup].innerHTML = this.table + this.block[this.blockup] + "</td></tr></table>";
      this.moving = false;
      this.process = setTimeout(this.objName + ".scrollLoop();", this.pause);
    } else {
      this.moving = true;
      for (var j = 1; j <= 2; j++) {
        if (this.direct == "up" || this.direct == "down") {
          divList[j].style.top = (parseInt(divList[j].style.top) + slideInc) + "px";
        } else divList[j].style.left = (parseInt(divList[j].style.left) + slideInc) + "px";
      } this.process = setTimeout(this.objName + ".scrollLoop();", this.speed);
    }
  }
  this.scrollWait = function() {
    clearTimeout(this.process);
    if (this.active) return false;
    if (!this.mouse) {
      this.active = true;
      this.process = setTimeout(this.objName + ".scrollLoop();", this.pause / 2);
    } else this.process = setTimeout(this.objName + ".scrollWait();", this.pause);
  }
}


/**
 * dropmenu
 */
dropMenu.Registry = [];

function dropMenu(id, elm)
{
	dropMenu.Registry[id] = [];
	dropMenu.Registry[id]['hidden'] = 1;
	
	dropMenu.Registry[id]['containerObj'] = document.getElementById(id+"Container");
	dropMenu.Registry[id]['contentObj']   = document.getElementById(id+"Content");
	
	if(dropMenu.Registry[id]['containerObj'] == null)
	{
		delete dropMenu.Registry[id]['containerObj']
		return;
	}	
	if(dropMenu.Registry[id]['contentObj'] == null)
	{
		delete dropMenu.Registry[id]['contentObj']
		return;
	}		
	
	//create hover effects on all children
	children = dropMenu.Registry[id]['contentObj'].firstChild.childNodes;
	for(i = 0; i < children.length; i++)
	{
		child = children[i].firstChild
		child.onmouseover = function(e) { dropMenu.hover(e)};
		child.onmouseout = function(e) { dropMenu.hoverout(e)};
	}
	
	dropMenu.Registry[id]['textObj']	  = document.getElementById(elm+"Text");
	dropMenu.Registry[id]['inputObj'] 	  = document.getElementById(elm+"Input");
	
	// drop down events
	dropMenu.Registry[id]['containerObj'].onmouseover = function() { dropMenu.showMenu(id); return true;}
	
	// disappear events
	dropMenu.Registry[id]['containerObj'].onmouseout  = function(e) { dropMenu.hideAction(e, id); }
	//dropMenu.Registry[id]['containerObj'].onmouseout  = function(e) { dropMenu.hideAction(e, id); }
	dropMenu.Registry[id]['containerObj'].onblur      = function() { dropMenu.hideMenu(id); }
	
	// select events
	//dropMenu.Registry[id]['contentObj'].onmousedown = function(e) { dropMenu.select(e, id); }
}

dropMenu.showMenu = function(id)
{
	if(dropMenu.Registry[id]['hidden'])
	{
		dropMenu.Registry[id]['contentObj'].style.display = 'inline';
		dropMenu.Registry[id]['hidden'] = 0;
	}
}
var temp = '';

dropMenu.hideAction = function(e, id)  //solver : MAKE ALL ONE BIG container that floats and changes size??? 
{
	if(!dropMenu.Registry[id]['hidden']&&0)
	{
		if (!e) var e = window.event;
		var tg = e.srcElement || e.target;
		if (tg.nodeName != 'DIV') return;
		var reltg = e.relatedTarget || e.toElement;
		while (reltg != tg && reltg.nodeName != 'BODY')
		{
			temp += reltg.nodeName + "->";
			reltg= reltg.parentNode
		}
		temp += reltg.nodeName;
		//window.alert(temp);
		temp = '';
		if (reltg == tg) return;
		
	}
	dropMenu.hideMenu(id);
}

dropMenu.hideMenu = function(id)
{
	dropMenu.Registry[id]['contentObj'].style.display = 'none';
	dropMenu.Registry[id]['hidden'] = 1;
	dropMenu.Registry[id]['containerObj'].blur();
}

dropMenu.select = function(e, id)
{
	var target
	if (!e) var e = window.event
	target = e.target || e.srcElement;
	if (target.nodeType == 3) // defeat Safari bug
	   target = target.parentNode
	
	// get the content of target
	if(target.nodeName == 'SPAN')
	{
		dropMenu.Registry[id]['textObj'].innerHTML = target.innerHTML;
		dropMenu.Registry[id]['inputObj'].value = target.innerHTML;
		dropMenu.hoverout(e);
		dropMenu.hideMenu(id);
	}
}

dropMenu.hover = function(e)
{
	if (!e) var e = window.event
	target = e.target || e.srcElement;
	target.className += " dropMenuHover";
}

dropMenu.hoverout = function(e)
{
	if (!e) var e = window.event
	target = e.target || e.srcElement;
	target.className = target.className.replace(/dropMenuHover/,"");
}


/**
 * flashObject
 */
function flashObject(strFlash, intWidth, intHeight, strId, strWMode, strBGColor, strQuality, strAlign, strNoFlash)
{
	document.write('<object type="application/x-shockwave-flash" data="'+strFlash+'" width="'+intWidth+'" height="'+intHeight+'">');
 	document.write('<param name="movie" value="'+strFlash+'" />');
 	document.write('<param name="wmode" value="'+strWMode+'" />');
 	document.write('<param name="quality" value="'+strQuality+'" />');
 	document.write(strNoFlash);
 	document.write('</object>'); 
}


/**
 * PopupWindow object
 * spwans/handles popup windows
 * 
 * @author AK
 * 
 * dependancies: jQuery 1.2.x
 */

function PopupWindow() {
	this.width = 500;
	this.height = 500;
	this.container = $(window);
	this.offsetLeft = 0;
	this.offsetTop = 0;
	this.menubar = true;
	this.location = false;
	this.resizable = true;
	this.scrollbars = true;
	this.status = true;
	this.name = 'popupWindow';
	this.url = ''; 
}
PopupWindow.prototype.prepare = function () {
	oAnchor = this.anchor;
	if (typeof oAnchor.data('popWinObject') == 'object') {
		oPopWin = oAnchor.data('popWinObject');
		if (!oPopWin.closed)
			oPopWin.close();	
	}
	sHref = oAnchor.attr('href');		
	if (sHref.indexOf('?') < 0)
		sHref += '?';
	else
		sHref += '&';	
	sHref += 'popup=true';
	this.url = sHref;
}
PopupWindow.prototype.spawn = function() {
	this.prepare();
	var x = this.container.width() / 2 - (this.width/2);
    var y = this.container.height() / 2 - (this.hegiht/2);
	if (x < 0) x = 0;
	if (y < 0) y = 0;
	this.offsetLeft = x;
	this.offsetTop = y;
	
	oPopWin = window.open(this.url, this.name, 'width='+this.width+',height='+this.height+',left='+this.offsetLeft+',top='+this.offsetTop);
	
	if (typeof oPopWin != 'undefined') {
		this.anchor.data('popWinObject', oPopWin);
		return true;
	}
	return false;
}