// PRELOAD
menu = new Image();
menu.src = "/images/menu.png";
balk = new Image();
balk.src = "/images/adresbalk-bg.png";
balk = new Image();
balk.src = "/images/close-hover.png";


// GLOBALS 
var popup;	  
var swiff;
var moviebgfade;
var tabs;
var contact;
var nieuwsbrief;
var theatermagazine;


window.addEvent('domready', function () {
	initmenu();								  
	//$('adresbalk').pin();
	tabs = new Tabs();
	zoek = new Zoek(); 
	
	contact = new Contact();
	nieuwsbrief = new Nieuwsbrief();
	theatermagazine = new Theatermagazine();
	moviebgfade = new Fx.Morph($('moviebg'), {duration: '200', transition: Fx.Transitions.Sine.easeInOut, link: 'chain'});
	moviebgfade.set({'opacity': 0});
	$('movieclose').addEvent('click', function(){
		moviebgfade.start({opacity: 0}); 
		$('moviewrap').setStyles({'width': '1px', 'height': '1px'});
		$('mymovie').stopMovie();
		});
	$('movieclose').addEvent('mouseenter', function(){
		this.src = '/images/close-hover.png';
		});
	$('movieclose').addEvent('mouseleave', function(){
		this.src = '/images/close.png';
		});
	var myDragInstance = new Drag($('moviebg'), {handle: $('moviehandle')});
	
	mandje = new Mandje($('winkelmandje'));
	popup = new PopUp($('popup'), $('popupbody'), $('popuphandle'), $('popupclose'));
});

/*
window.addEvent('load', function () {
	var myEffects = new Fx.Morph( $('lamp'), {duration: 20000, transition: Fx.Transitions.Sine.easeOut});
	myEffects.start({
		'opacity': 0.5
	});
});
*/

function initmenu() {
	$$('#menu li').addEvent('mouseenter', function() {
		this.getElement('.sub').setStyle('visibility', 'visible');
		this.morph({'margin-top': '0px'});
		});
	$$('#menu li').addEvent('mouseleave', function() {
		this.getElement('.sub').setStyle('visibility', 'hidden');
		this.morph({'margin-top': '7px'});
		});
	};
							 
							 
// ADRESBALKTABS

var Tabs = new Class({
					 
	acttab: null,
	//adresfade: null,
	adresfull: null,

	initialize: function() {
		$('adresbalk').pin();
		//var myFx = new Fx.Scroll(window).set (0,0);

		//this.adresfade = new Fx.Morph($('adresbalk'), {link: 'cancel'});
		/*
		window.addEvent('scroll',function() {
			var position = window.getScroll();
			if (this.adresfull && (position.y > 300)) {
				this.adresfade.start({'opacity':0});
				this.adresfull = false;
				}
			if (!this.adresfull && (position.y <= 300)) { 
				this.adresfade.start({'opacity':1});
				this.adresfull = true;
				}
			}.bind(this));
		*/
		$$('.sluiten').addEvent('click', function(e) {
			this.closeall();
			}.bind(this));
		$$('.sluiten').addEvent('mouseenter', function(e) {
			this.setStyle('background-image', 'url(/images/close-hover.png)');
			});
		$$('.sluiten').addEvent('mouseleave', function(e) {
			this.setStyle('background-image', 'url(/images/close.png)');
			});
	},
	
	closeall: function() {
		if ($(this.acttab)) {
			$(this.acttab).morph({'opacity': 0});
			}
	},
	
	opentab: function(el) {
		if ($(this.acttab)) $(this.acttab).setStyle('display', 'none');
		this.acttab = el;
		$(el).setStyles({'opacity': 1});
		$(el).setStyle('display', 'block');
	},
	
	openact: function() {
		if ($(this.acttab)) {
			$(this.acttab).setStyle('display', 'block');
			$(this.acttab).setStyles({'opacity': 1});
			}
	},
	
	dimact: function() {
		if ($(this.acttab)) $(this.acttab).morph({'opacity': 0.8});
	}
	
});


/* CONTACT */

var Contact = new Class({
						
	initialize: function() {
		new Request.HTML({url: '/include/contact.php' , method: 'get', update: $('contactformulier'), onComplete: function(){this.initform();}.bind(this)}).get();
	},
	
	initform: function() {
		$('contactform').addEvent('submit', function(e) { 
			new Event(e).stop();												 
			if (this.validate()) {												 
				$('contactform').set('send', {
					 url: 'include/contact.php', 
					 method: 'post', 
					 update: $('contactbevestiging'),
					 onComplete: function(response) {
						$('contactbevestiging').set('html', response);
						}
					 });
				$('contactform').send();
				}
			}.bind(this));

		$('opmerkingen').addEvent('focus', function(e) {
			e = new Event(e).stop();
			if ($('opmerkingen').value.substr(0,8) == 'Typ hier') $('opmerkingen').value = '';
			});
		
		$$('#contactform input').addEvent('keypress', function(e){
			return !(e.code == 13); 
			});
		
		$$('#contactform input[type=text]').addEvent('focus', function(e){
			this.setStyle('backgroundColor', '#FFF');
			});
		
		$$('#contactform input[type=text]').addEvent('blur', function(e){
			this.setStyle('backgroundColor', '#F8F8F8');
			});
		
		$$('#contactform .bestemmingkeuze').addEvent('click', function(e) {
			this.checkverplicht();
			}.bind(this));
	},
	
	checkverplicht: function() {
		$$('.verplicht').setStyle('visibility' , 'hidden');
		if ($('contactform').actie[0].checked) {
			$$('.kverplicht').setStyle('visibility' , 'visible');
			}
		else {
			$$('.overplicht').setStyle('visibility' , 'visible');
			}
		$$('#contactform input[type=text]').each(function(item, index){
			item.setStyle('backgroundColor', '#F8F8F8');	
			});
	},

	validate: function() {
		var ok = true;
		var bestemming = false;
		var form = $('contactform');
			
		if ($('checkkassa').checked) {
			bestemming = true;
			$$('#contactform .kv').each(function(item, index){
			item.setStyle('backgroundColor', '#F8F8F8');												 
				if (item.value == '') {
					item.setStyle('backgroundColor', '#FCC');
					ok = false;
					}
				});
			}
			
		if ($('checkoverig').checked) {
			bestemming = true;
			$$('#contactform .ov').each(function(item, index){
			item.setStyle('backgroundColor', '#F8F8F8');
				if (item.value == '') {
					item.setStyle('backgroundColor', '#FCC');
					ok = false;
					}
				});
			}
			
		if (!bestemming) {
			alert ('Geef de bestemming van uw bericht aan.');
			return false;
			}
			
		if (!ok) {
			alert ('Vul de verplichte gegevens in.');
			return false;
			}
		return true;
	}
	
});


// NIEUWSBRIEF

var Nieuwsbrief = new Class({

	initialize: function() {
		new Request.HTML({url: '/include/tmailform.php' , method: 'get', update: $('theatermail'), onComplete: function(){this.initform();}.bind(this)}).get();
	},
	
	initform: function() {
		$('adres').addEvent('focus', function(e) { 
			e = new Event(e).stop();
			if ($('adres').value == 'uw e-mailadres') $('adres').value = '';
			});
		
		$('tmailform').addEvent('submit', function(e) {
			new Event(e).stop();												 
			if (this.validate()) {												 
				$('tmailform').set('send', {
					 url: 'include/tmailform.php', 
					 method: 'post', 
					 update: $('tmailbevestiging'),
					 onComplete: function(response) {
						$('tmailbevestiging').set('html', response);
						}
					 });
				$('tmailform').send();
				}
			}.bind(this));
			
	},
		
	validate: function() {
		var adres = $('adres').value;
		if (adres == '' || adres == 'uw e-mailadres') return false;
		return true;
	}
	
	
});



// THEATERMAGAZINE

var Theatermagazine = new Class({

	initialize: function() {
		new Request.HTML({url: '/include/theatermagazine.php' , method: 'get', update: $('theatermagazine'), onComplete: function(){this.initform();}.bind(this)}).get();
	},
	
	initform: function() {
		
		$('theatermagazineform').addEvent('submit', function(e) {
			new Event(e).stop();												 
			if (this.validate()) {												 
				$('theatermagazineform').set('send', {
					 url: 'include/theatermagazine.php', 
					 method: 'post', 
					 update: $('theatermagazinebevestiging'),
					 onComplete: function(response) {
						$('theatermagazinebevestiging').set('html', response);
						}
					 });
				$('theatermagazineform').send();
				}
			}.bind(this));
		
		$$('#theatermagazineform input').addEvent('keypress', function(e){
			return !(e.code == 13); 
			});
		
		$$('#theatermagazineform input[type=text]').addEvent('focus', function(e){
			this.setStyle('backgroundColor', '#FFF');
			});
		
		$$('#theatermagazineform input[type=text]').addEvent('blur', function(e){
			this.setStyle('backgroundColor', '#F8F8F8');
			});
			
	},
		
	validate: function() { //todo
		return true;
	}
	
});


// ZOEKEN

var Zoek = new Class({
	
	getResult: function(zoekstring) {
		$('zoekload').fade('show');
		new Request.HTML({url: '/include/zoeken.php' , method: 'get', update: $('zoekresultaat'), onScuccess: tabs.opentab('reszoek'), onComplete: function(){$('zoekload').fade('out');} }).get({'z': zoekstring, 'p': pag});
		},
				
	initialize: function() {
		$('zoekinput').addEvent('keyup', function(event) { 
			if (event.key == 'left' || event.key == 'right') event.stopPropagation();	
			if (event.key == 'up' || event.key == 'down') return;
			if ($('zoekinput').value.length > 1) this.getResult($('zoekinput').value);
			//else $('zoekresultaat').set('html', '');
			else $('zoekresultaat').empty();
			}.bind(this));
		
		$('zoekinput').addEvent('keydown', function(event){  
			if (event.key == 'left' || event.key == 'right') event.stopPropagation();
			if (event.key == 'up' || event.key == 'down') return;
			});
		$('zoekinput').addEvent('focus', function(e) {
			if ($('zoekinput').value == 'zoeken') $('zoekinput').value = '';
			else {this.getResult($('zoekinput').value);};
			$('zoekinput').addClass('zoekfocus');
			}.bind(this)),
		
		$('zoekinput').addEvent('blur', function(e) {
			this.removeClass('zoekfocus');									 
			})
		
		$('zoekload').fade('hide');
		
		}
});


// POPUP

var PopUp = new Class({
					  
	element: null,
	contentwrap: null,
	closebutton: null,
	popupfade: null,
	
	initialize: function(element, contentwrap, handle, closebutton) {
		this.element=element;
		this.contentwrap = contentwrap;
		this.closebutton = closebutton;
		this.popupfade = new Fx.Morph(element, {duration: '200', transition: Fx.Transitions.Sine.easeInOut, link: 'chain'});
		this.popupfade.set({'opacity': 0});
		this.closebutton.addEvent('click', function(){
			this.popupfade.start({opacity: 0}); 
			}.bind(this));
		this.closebutton.addEvent('mouseenter', function(){
			this.src = '/images/close-hover.png';
			});
		this.closebutton.addEvent('mouseleave', function(){
			this.src = '/images/close.png';
			});
		var myDragInstance = new Drag(element, {handle: handle});
		},
		
	empty: function() {
		this.contentwrap.empty();
		},
		
	fill: function(content) {
		content.injectInside(this.contentwrap);
		},
	
	show: function() {
		this.element.position();
		this.popupfade.start({opacity: 1}); 
		},
		
	hide: function() {
		this.popupfade.start({opacity: 0}); 
		}

});


// MOVIE

var needflash = (Browser.Plugins.Flash.version < 7);

window.addEvent('load', function(){
	//moviebgfade.start({opacity: 1});
	if(!needflash) {
		swiff = new Swiff('/flash/movieplayer.swf', {
			id: 'mymovie',
			width: 640,
			height: 420,
			container: $('moviewrap')
			});
		}
});


function speelVideo(bestand, bron) {
	if (needflash) alert ('Flash versie 8 of hoger is nodig om de filmpjes te kunnen bekijken.');
	else {
		$('moviebg').position();
		moviebgfade.start({opacity: 1});
		$('moviewrap').setStyles({'width': '640px', 'height': '420px'});
		$('moviewrap').position();
		
		if ($('mymovie')) {
			if (bron == 'yt') {
				(function(){$('mymovie').selectYTMovie(bestand);}).delay(2000);
				}
			else (function(){$('mymovie').selectMovie(bestand);}).delay(2000);
			}
		}		
}


// BESTELLEN

function bestelform (titel, org, vrstnr, label) {
	var bestellenWrap = new Element('div', {'id': 'bestellen'});
	new Element('div', {'class': 'titel'}).set({'html': titel}).injectInside(bestellenWrap);
	var besteltekst = new Element('div', {'class': 'besteltekst'}).set({'html':"Vul hier het aantal toegangskaarten in dat u wilt bestellen in klik op 'in winkelwagen'." }).injectInside(bestellenWrap);
	var bestelaantal = new Element('input', {'class': 'bestelaantal', 'type': 'text', 'id': 'aantalvrst'}).injectInside(bestellenWrap);
	var bestelknop = new Element('a', {'class': 'knop'}).set({'html': "<img src='/images/inwinkelmandje.png' alt='in winkelmandje' />", href:'#', onfocus:'blur()'}).injectInside(bestellenWrap);
	bestelknop.addEvent('click', function(){
		mandje.toevoegenMandje(org, vrstnr, bestelaantal.value, label); 
		$('toevoegenmandje').set({'html': "<a href='#' onclick='javascript: verderwinkelen(); return false;' onfocus='blur()'><img src='/images/verderwinkelen.png' alt='verder winkelen'></a>&nbsp;&nbsp;<a href='#'  onfocus='blur()' onclick='javascript:mandje.bestelUrl(); return false;'><img src='/images/ditbestellen.png' alt='dit bestellen'></a><div id='wachtoplvp'>Momentje, de bestelpagina wordt geladen.</div>"});
		return false;
		});
	bestelaantal.addEvent('keydown', function(event){
		if (event.key == 'enter' ) {										  
			mandje.toevoegenMandje(org, vrstnr, bestelaantal.value, label); 
			$('toevoegenmandje').set({'html': "<a href='#' onclick='javascript: verderwinkelen(); return false;' onfocus='blur()'><img src='/images/verderwinkelen.png' alt='verder winkelen'></a>&nbsp;&nbsp;<a href='#'  onfocus='blur()' onclick='javascript:mandje.bestelUrl(); return false;'><img src='/images/ditbestellen.png' alt='dit bestellen'></a><div id='wachtoplvp'>Momentje, de bestelpagina wordt geladen.</div>"});
			return false;
			}
		});
	$('toevoegenmandje').empty();
	bestellenWrap.injectInside($('toevoegenmandje'));
	toonmandje();
	$('aantalvrst').focus();
}


function toonmandje() {
	new Fx.Scroll(window, {duration: 500, transition: Fx.Transitions.quadIn}).toTop();
	mandje.toonMandje();
	tabs.opentab('reswinkelmandje');
}

function verderwinkelen() {
	tabs.closeall();
}



// WINKELMANDJE

var Mandje = new Class({
					   
	contentwrap: null,
	
	initialize: function(content) {
		this.contentwrap = content;
		},
		
	toevoegenMandje: function (org, vrstnr, aantal, label) {
		if (aantal == '') aantal = 0;
		if ((!isNaN(org)) && (!isNaN(vrstnr)) && (!isNaN(aantal))) {
			switch (vrstnr) {
				case '1811': if(aantal > 1) {aantal = 1; break;}
				case '1552': if(aantal > 4) {alert('Maximaal 4 kaarten.'); aantal = 4; return; break}
				case '1553': if(aantal > 4) {alert('Maximaal 4 kaarten.'); aantal = 4; return; break}
				default: if (aantal > 10) {alert('Maximaal 10 kaarten.'); aantal = 10; return}
			
				}
			new Request.HTML({url: '/include/mandje.php', update: this.contentwrap}).get({'actie':'toevoegen', 'org':org, 'vrstnr':vrstnr, 'aantal':aantal, 'label':label});
			}
		},
	
	toonMandje: function() {
		var response = new Request.HTML({url: '/include/mandje.php', method: 'get', update: this.contentwrap}).get({'actie':'tonen'});
		},
		
	mandjeVerwijderen: function() {
		new Request.HTML({url: '/include/mandje.php' , method: 'get', update: this.contentwrap}).get({'actie':'mandjeverwijderen'});
		},
		
	verwijderVrst: function(vrstnr) {
		new Request.HTML({url: '/include/mandje.php', update: this.contentwrap}).get({'actie':'voorstellingverwijderen', 'vrstnr':vrstnr});
		},
		
	bestelUrl: function() {
		$('wachtoplvp').setStyle('visibility', 'visible');
		return new Request({url:'/include/mandje.php', method: 'get', onComplete: function(response) {this.openResponse(response);}.bind(this)}).get({'actie':'bestelurl'});
		},
		
	openResponse: function (response) {
		if ((response == 0) || (response == 1)) alert('Er is een fout opgetreden. '+ response);
		else {
			if (response == -3) alert('Het winkelwagentje is leeg.');
			else {
				//this.mandjeVerwijderen();
				//$('loading').setStyle('visibility', 'visible');	
				window.location = response;
				}
			}
		}
});


function popinfo(info) {
	popup.empty();
	new Request.HTML({'url': 'include/'+info, update: $('popupbody'), onComplete: function() {popup.show()} }).get();
}

function goinfo(pagina, onderwerp) {
	if (pagina == pag) markeer(onderwerp);
	else window.location = pagina+'.php#'+onderwerp;
}

function markeer(id) {
	if ($(id)) {
		$(id).morph({'border': '1px solid #F00', 'background-color': '#FEE'});		
		new Fx.Scroll(window, {offset: {'x': 0, 'y': -200}}).toElement($(id));
		}
}


// NIEUWSITEM

function toonNieuws(id) {
	//$('popup').position();
	popup.empty();
	var nr=id.substring(1);
	new Request.HTML({'url': 'include/getNieuws2.php', update: $('popupbody'), evalScripts: true, onComplete: function() {popup.show()} }).get({'wat':nr});
}


// WACHTLIJST

function wachtlijst(nr) {
	new Request.HTML({url: '/include/wachtlijst.php', update: $('wachtlijst'), onComplete: tabs.opentab('reswachtlijst'),  evalScripts:true}).get({'vrst': nr});	
}