var Zoeken = new Class({
					 
	Implements: [Options],

	options: {	
		url				: null,
		container		: null,
		verticalsize	: 10,
		horizantalsize	: 10,
		opacity			: 0.9,
		inputValue		: 'Zoeken',
		cookiename		: 'searchterm',
		debug			: 0
	},
	
	tab				: null,
	typeTimer		: null,
	lastSearchTerm	: null,
	searchTerm		: null,
	
	element: {
		input			: null,
		
		searchContainer:	{
			position	: null,
			initpos		: null,
			fx			: null,
			status		: null,
			toggler		: null	
		},
		
		inputOverlay:		{
			element 	: null,
			fx			: null
		},
		
		rightcorner		: null,
		tabsearch		: null,
		tab1			: null,
		tab2			: null,
		leftcorner		: null,
		
		resultContainer:	{
			element		: null,
			fx			: null,
			toggler		: null,
			status		: null		
		},
		
		notify:				{
			element		: null,
			fx			: null
		}	
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.options.container = $$(this.options.container)[0];
		this.options.container.empty();
		this.relativecontainer();
		this.createForm();
		this.getCookie();
		this.searchContainerInit();
		this.searchResultsInit();
		
		
	},
	
	relativecontainer: function(){
		new Element('div', {'style':'position: relative; right: 10px; top: -20px;'}).wraps(this.options.container);
	},
	
	createForm: function(){
		this.element.input = new Element('input', {'value': this.options.inputValue}).addEvents({
			// keydown
			'keydown':	 function(event){
				//enter
				if (event.code == "13"){ this.search();	}
		
				this.typeTimer = $clear(this.typeTimer);
				this.typeTimer = (function(){ this.search(); }).bind(this).delay(1000);
				
			}.bind(this),
			
			//focus
			'focus':	function(){
				if (this.element.input.get('value') == this.options.inputValue){
					this.element.input.set('value','');
				}
			}.bind(this),
			
			//blur
			'blur':		function(){
				if (this.element.input.get('value') == ''){
					this.element.input.set('value', this.options.inputValue);	
				}		
			}.bind(this)
		});
	
		var ul = new Element('ul', {'class':'formulier'}).inject(this.options.container);
		
		this.element.rightcorner = new Element('li', {'class':'rightc corner'}).inject(ul);
	
		this.element.tabsearch = new Element('li', {'class':'tab'}).adopt(
			this.element.input
		).addEvent('click', function(){
			if (this.tab != 'search'){
				if (this.searchTerm != 'zoeken' && this.searchTerm != '' && this.searchTerm){
					this.setCurrent(this.element.tabsearch);
					this.tab = 'search';
					this.search();
				}
			}
		}.bind(this)).inject(ul);
		
		this.element.tab1 = new Element('li', {'class':'tab'}).adopt(
			new Element('div', {'text':'Veel gestelde vragen'})
		).addEvent('click', function(){
			if (this.tab != 'tab1'){
			
				this.setCurrent(this.element.tab1);
				this.tab = 'tab1';
				
				this.tab1();
			}
		}.bind(this)).inject(ul);
		
		
		this.element.tab2 = new Element('li', {'class':'tab'}).adopt(
			new Element('div', {'text':'Contactgegevens'})
		).addEvent('click', function(){
			if (this.tab != 'tab2'){
				
				this.setCurrent(this.element.tab2);
				
				this.tab = 'tab2';
				this.tab2();
			}
		}.bind(this)).inject(ul);
		
		this.element.leftcorner = new Element('li', {'class':'leftc corner'}).inject(ul);
	
		this.element.searchContainer.toggler = new Element('div', {'class': 'toggle leftbutton', 'html':' '}).inject(this.options.container).addEvent('click', function(){
			this.searchContainerToggle();
		}.bind(this));
	},
	
	setCurrent: function(tab){
		this.options.container.getElements('ul li').each(function(li){
			li.removeClass('current');
		});
		if (tab){
			tab.addClass('current');
			if (tab == this.element.tabsearch){
				this.element.leftcorner.addClass('current');
			}
		}
	},
	
	search: function(page){	
		if (!this.resultcontainer){
			this.searchResultsInit();
		}
		
		if (this.element.input.get('value') != this.searchTerm){	
			this.pagenr = null;
			this.searchTerm = this.element.input.get('value');
		}
		
		if (page){
			var pagenr = page.indexOf('pagina');
			this.pagenr = (pagenr > 0) ? page.slice(pagenr+6, -1) : false;
		} else {			
			page = this.options.url;
			if (this.pagenr && page.indexOf('pagina') == '-1'){
				page += 'pagina'+this.pagenr;
			}
		}		
					
				
		var page = (!page) ?  this.options.url : page;
		if (this.searchTerm != 'zoeken' && this.searchTerm != '' && this.searchTerm){
			this.searchContainerOpen();
			
			this.tab = 'search';
			this.setCurrent(this.element.tabsearch);
			
			new Request.HTML({
				'url'			: page,
				'method'		: 'post',
				'update'		: this.updatecontainer,
				'data'			: {	'zoekterm' : this.searchTerm },
				'onComplete'	: function(){
									this.searchResultsOpen();
									this.lastSearchTerm = this.searchTerm;
									this.setCookie();
								  }.bind(this)
			}).send();
		} else {
			this.searchResultsInstantClose();
		}
	},
	
	setCookie: function(){
		var cookieoptions = {'path':'/'};
		if (this.searchTerm != 'undefined' && this.searchTerm){
			Cookie.write(this.options.cookiename, this.searchTerm, cookieoptions);
		} else {
			Cookie.dispose(this.options.cookiename);
		}
		
		if (this.pagenr != 'undefined' && this.pagenr){
			Cookie.write('ajaxpagenr', this.pagenr, cookieoptions);
		} else {
			Cookie.dispose('ajaxpagenr');
		}
	},
	
	getCookie: function(){
		var searchTerm = Cookie.read(this.options.cookiename);
		var pagenr = Cookie.read('ajaxpagenr');
		
		if (searchTerm != 'undefined' && searchTerm){
			this.searchTerm = searchTerm;
			this.element.input.set('value', searchTerm);
		}
		
		if (pagenr != 'undefined' && pagenr){			
			this.pagenr = pagenr;
		} else {
			this.pagenr = false;
		}
	},
	
	tab1: function(){
		new Request.HTML({
			'url'			: this.options.tab1url,
			'update'		: this.updatecontainer,
			'onComplete'	: function(){
								this.searchResultsOpen();
							  }.bind(this)
		}).send();
	},
	
	tab2: function(){
		new Request.HTML({
			'url'			: this.options.tab2url,
			'update'		: this.updatecontainer,
			'onComplete'	: function(){
								this.searchResultsOpen();
							  }.bind(this)
		}).send();
	},
	
	searchContainerInit: function(){
		this.element.searchContainer.fx = new Fx.Morph(this.options.container, {
			duration	: 'normal',
			link		: 'chain',
			transition	: Fx.Transitions.Quart.easeInOut,
			onComplete	: function(){
							this.element.searchContainer.position = this.options.container.getCoordinates();
						  }.bind(this)
		});
		
		this.element.searchContainer.initpos = this.element.searchContainer.positie = this.options.container.getCoordinates();
		
		this.element.searchContainer.status = 'closed';
		
		this.options.container.setStyles({
			'position'		: 'absolute',
			'right'			: 0
		});
	},
	
	searchContainerToggle: function(){
		if (this.element.searchContainer.status == 'closed'){
			//this.searchContainerOpen();
			this.search();
		} else {
			this.searchContainerClose();		
		}
	},
	
	searchContainerOpen: function(){
		if (this.element.searchContainer.status == 'closed'){
			this.element.searchContainer.fx.start({
			    'width'		: [this.element.searchContainer.positie.width+this.options.horizantalsize]
			});
			this.hideNotify();
			this.element.searchContainer.status = 'open';
			this.element.searchContainer.toggler.set('class', 'toggle rightbutton');
			this.searchResultsOpen();
		}
	},
	
	searchContainerClose: function(){
		if (this.element.searchContainer.status != 'closed'){		
			this.searchResultsClose();
			this.setCurrent();
			this.element.searchContainer.fx.start({
				'width'			: [this.element.searchContainer.positie.width]
			});
			this.element.searchContainer.status = 'closed';
			this.element.searchContainer.toggler.set('class', 'toggle leftbutton');
			if (this.searchTerm != 'zoeken' && this.searchTerm != '' && this.searchTerm){
				this.showNotify();
			}
		}
	},
	
	
	
	searchResultsInit: function(){
		this.element.resultContainer.toggler = new Element('div', {'class':'resulttoggle', 'html':' ', 'class': 'toggle downbutton'}).addEvent('click', function(){
			this.searchResultsToggle();	
		}.bind(this));
		
		this.resultcontainer = new Element('div', {'class':'results', 'opacity': this.options.opacity}).adopt(
			new Element('h3', {'text':''}),
			this.element.resultContainer.toggler
		).inject(this.options.container);
		
		this.updatecontainer = new Element('div', {'id':'resultcontainer'}).inject(this.resultcontainer);
	
		this.element.resultContainer.status = 'closed';
	},
	
	
	searchResultsToggle: function(){
		if (this.element.resultContainer.status == 'closed'){
			this.searchResultsOpen();
		} else {
			this.searchResultsClose();	
		}
	},
	
	searchResultsOpen: function(){
		if (this.element.resultContainer.status == 'closed' && this.tab != null){
			this.element.searchContainer.fx.start({
			    'height'	: [this.element.searchContainer.positie.height+this.options.verticalsize]
			});
			this.element.resultContainer.status = 'open';
			this.element.resultContainer.toggler.set('class', 'toggle crossbutton');
		}
	},
	
	searchResultsClose: function(){
		if (this.element.resultContainer.status == 'open'){
			this.element.searchContainer.fx.start({
			    'height'	: [this.element.searchContainer.positie.height]
			});
			this.element.resultContainer.status = 'closed';
		}
	},
	
	searchResultsInstantClose: function(){
		if (this.element.resultContainer.status == 'open'){
			
			this.updatecontainer.empty();
				
			this.element.searchContainer.fx.set({
			    'height'	: this.element.searchContainer.positie.height
			});
			
			this.element.resultContainer.status = 'closed';
		}
	},
	
	openDetail: function(url){
		this.searchContainerClose();
		new Request.HTML({
			url				: url,
			update			: $$('.right')[0],
			method			: 'post',
			data			: {'ajax':'true'}
		}).send();
	},
	
	initNotify: function(){
		this.element.notify.element = new Element('div', {
			'class'		: 'zoeknotify',
			'opacity'	: '0'
		}).adopt(
			new Element('span', {'html':'» Heropen uw zoekresultaten'})
		).injectAfter(this.options.container).addEvent('click', function(){
			this.searchContainerOpen();
		}.bind(this));
		
		this.element.notify.fx = new Fx.Morph(this.element.notify.element, {
			duration	: 'normal',
			link		: 'chain',
			transition	: Fx.Transitions.Quart.easeInOut,
			onComplete	: function(){
						  }.bind(this)
		});
		
		
		this.element.notify.element.setStyles({
			'position'		: 'absolute',
			'right'			: 0,
			'cursor'		: 'pointer',
			'width'			: this.element.searchContainer.initpos.width-3,
			'top'			: this.element.searchContainer.initpos.height
		});
	},
	
	showNotify: function(){
		if (!this.element.notify.element){
			this.initNotify();
		}		
		
		this.element.notify.fx.start({
		    'bottom'			: [this.element.searchContainer.positie.bottom+22],
		    'height'			: [22],
		    'opacity' 			: [0.7]
		});
	},
	
	hideNotify: function (){
		if (!this.element.notify.element){
			this.initNotify();
		}	
		this.element.notify.fx.start({
		    'bottom'	: [this.element.searchContainer.positie.bottom],
		    'height'	: [0],
	    	'opacity' 	: [0]
		});			
	}
});