var tabs = null;

Class.Mutators.Binds = function(self, methods) {
	$splat(methods).each(function(method){
		var fn = self[method];
		self[method] = function(){
			return fn.apply(self, arguments);
		};
	});
};

function preview(el)
{
	var form = el.getParent('form');
	var defaultAction = form.get('action');
	form.set('action', el.get('href'));
	form.set('target', '_blank');
	form.submit();
	
	form.set('action', defaultAction);
	form.set('target', '');
	/*
	var data = form.toQueryString();
	new Request.HTML({
		'url': el.get('href'),
		onComplete: function(result)
		{
			console.log(result);
		}
	}).post(form);
	*/
	return false;
}

function goRegister()
{
	SqueezeBox.fromElement($('hastoregister'), {handler: 'clone',size: {x: 530, y: 586}}).chain(function() {
		$('sbox-content').getElement('input[type=submit]').addEvent('click', function(e) {
			registerUser(this);
			e.preventDefault();
		});
	});
	return false;
}

function goActivate(el)
{
	var form = $(document.body).getElement('input[name=activation]').get('value');
	var el = $(document.body).getElement('.activation_box');
	new Request.JSON({
		url: 'nl_/account_activeren/',
		onComplete: function(result)
		{
			if(result.activated)
			{
				el.getElement('div.result').setStyle('display', 'block');
				el.getElement('div.error').setStyle('display', 'none');
				el.getElement('div.dontshow').setStyle('display', 'none');
				closeBox.delay(2500);
				if(!Browser.Engine.trident) $('advertentie').submit();
				else $('plaats_advertentie').fireEvent('click');
			}
			else
			{
				el.getElement('div.error').setStyle('display', 'block');
			}
		}
	}).post({'activation':form});
}

function closeBox()
{
	SqueezeBox.close();
}

function loginUser(el)
{
	
	var form = el.getParent('form');
	
	new Request.JSON({
		url: './nl_/inloggen/',
		onComplete: function(res) {
			if($chk(res) && $chk(res.loggedIn) && res.loggedIn == 1)
			{
				form.getElement('div.result').setStyle('display','block');
				form.getElement('div.error').setStyle('display','none');
				closeBox.delay(2500);
				
				if($chk($('advertentie')) && !Browser.Engine.trident) $('advertentie').submit();
			}
			else
			{
				form.getElement('div.error').setStyle('display','block');
			}
		}
	}).post(form);
}

function registerUser(el)
{
	new Request.HTML({
		url: 'nl_/maak_account_ajax/',
		onComplete: function(html)
		{
			var parent = el.getParent().getParent('div');
			parent.empty().adopt(html);
			
			parent.getElement('input[type=submit]').addEvent('click', function(e) {
				registerUser(this);
				e.preventDefault();
			});
			
			if(parent.getElement('div.result'))
			{
				SqueezeBox.fromElement(parent.getElement('div.result'), {handler: 'clone',size: {x: 300, y: 200}});
			}
		}
	}).post(el.getParent('form'));
	return false;
}

function setDate()
{
	var date = new Date();
	var year = date.getFullYear();
	var month = date.getMonth()+1;
	var day = date.getDate();
	
	if(day < 10)
	{
		day = '0' + day;
	}
	
	if(month < 10)
	{
		month = '0'+month;
	}
	return day+'/'+month+'/'+year;
}

var Gallery = new Class({

	Binds: ['getNext','getPrevious', 'getImage'],

	initialize: function(el) {
		if(!$chk(el)) return false;
		this.element = el;
		this.bindElement();
	},
	
	bindElement:function(){
		this.next = this.element.getElement('.next');
		this.previous = this.element.getElement('.previous');
		this.thumbs = this.element.getElement('.thumbnails');
		this.images = this.thumbs.getElements('img');
		
		this.images.each(function(img,i) {
			img.addEvent('click', this.getImage.bindWithEvent(this, i));
			if(i == 0) 
			{
				img.addClass('active');
			}
		}, this);
		
		var related = this.element.get('id').replace('gallery','related');
		
		if($(related))
		{
			this.related = $(related).getElements('img');
			this.related.each(function(relImg,i) {
				relImg.addEvent('click', this.getImage.bindWithEvent(this, i));
				relImg.setStyle('cursor','pointer');
				if(i == 0) 
				{
					relImg.addClass('active');
				}
			}, this);
		}
		
		this.preview = this.element.getElement('.preview').getElement('img');
		
		this.scroll = new Fx.Scroll(this.thumbs).toLeft();
		
		this.length = this.images.length;
		this.current = 0;
		
		this.previous.addEvent('click', this.getPrevious.bindWithEvent());
		this.next.addEvent('click', this.getNext.bindWithEvent());
	
	},
	
	getNext: function(e)
	{
		e.preventDefault();
		e.target.blur();
		if( (this.current+1) > (this.length-1) )
		{
			return false;
		}
		else
		{
			this.current += 1;
			this.showImage();
		}
	},
	
	getPrevious: function(e)
	{
		e.preventDefault();
		e.target.blur();
		if( (this.current-1) < 0 )
		{
			return false;
		}
		else
		{
			this.current -= 1;
			this.showImage();
		}
	},
	
	getImage: function(e, i) {
		e.preventDefault();
		this.current = i;
		this.showImage();
	},
	
	showImage: function()
	{
		this.images.each(function(img) { img.removeClass('active'); });
		this.images[this.current].addClass('active');
		if($chk(this.related))
		{
			this.related.each(function(img) { img.removeClass('active'); });
			this.related[this.current].addClass('active');
		}
		
		var left = this.images[this.current].getCoordinates().left - this.thumbs.getCoordinates().left;
		this.scroll.start(left, 0);			
		this.preview.set('src', this.images[this.current].get('src').replace('thumb_',''));
		
		tabs.select(1);
	}

});

var Advertentie = new Class({

	initialize: function(element)
	{
		this.element = element;
		
		$$('.sell_type').each(function(el) {
			el.addEvents({
				'domready': this.checkSellType.bindWithEvent(el),
				'click': this.checkSellType.bindWithEvent(el)
			});
		}, this);
		
		$$('.disable').each(function(el) {
			var target = $(el.get('title'));
			el.addEvent('click', function(e) {
				if(target.hasClass('disabled'))
				{
					target.removeClass('disabled');
				}
				else
				{
					target.set('value', setDate());
					target.addClass('disabled');
				}
			});
		});
		this.submit();
		this.increment();
		this.switches();
		this.parkingSpace();
		this.upload();
		this.deleteImg();
		this.calendar();
	},
	
	calendar: function()
	{
		this.element.getElements('input.calendar').each(function(el) {
			new DatePicker(el);
		});
	},
	
	deleteImg: function()
	{
		this.element.getElements('a.deleteImg').each(function(el) {
		
			el.addEvent('click', function(e) {
				e.preventDefault();
				new Request.JSON({
					'url': el.get('href'),
					onComplete: function(res)
					{
						var fieldset = el.getParent('fieldset');
						el.getParent('span').empty().dispose();
						fieldset.getParent('div.part').setStyle('height', fieldset.getParent('div.checkSize').getSize().y);
						
						if(fieldset.getElements('span').length == 0)
						{
							fieldset.empty().dispose();
						}
					}
				}).post({'action':'deleteImg'});
			});
			
		});
	},
	
	
	parkingSpace: function()
	{
		var el = this.element;
		
		this.element.getElements('select[name=estate_rented]').addEvents({
			'domready': function(e) {
				if(this.value == 'In gebruik')
				{
					$('rented_space').setStyle('display','block');
				}
				else
				{
					$('rented_space').setStyle('display','none');
				}
			},
			'click': function(e) {
				if(this.value == 'In gebruik')
				{
					$('rented_space').setStyle('display','block');
				}
				else
				{
					$('rented_space').setStyle('display','none');
				}
			}
		});
		
		this.element.getElements('input[name=parking_private]').addEvents({
			'domready': function(e) {
				if(this.value == 1)
				{
					$('parking_space_num').setStyle('display','block');
				}
				else
				{
					$('parking_space_num').setStyle('display','none');
				}
			},
			'click': function(e) {
				if(this.value == 1)
				{
					$('parking_space_num').setStyle('display','block');
				}
				else
				{
					$('parking_space_num').setStyle('display','none');
				}
			}
		});
		
		this.element.getElements('input[name=parking_private]').addEvents({
			'domready': function(e) {
				if(this.value == 1)
				{
					$('parking_space_num').setStyle('display','block');
				}
				else
				{
					$('parking_space_num').setStyle('display','none');
				}
			},
			'click': function(e) {
				if(this.value == 1)
				{
					$('parking_space_num').setStyle('display','block');
				}
				else
				{
					$('parking_space_num').setStyle('display','none');
				}
			}
		});
		
		this.element.getElements('input[name=parking_spaces]').addEvents({
			'domready': function(e) {
				if(this.get('checked'))
				{
					if(this.get('value') == 0)
					{
						el.getElement('#parkingspace').setStyle('display','none');
					}
					else
					{
						el.getElement('#parkingspace').setStyle('display','block');
					}
				}

			},
			'click': function(e) {
				if(this.get('checked'))
				{
					if(this.get('value') == 0)
					{
						el.getElement('#parkingspace').setStyle('display','none');
					}
					else
					{
						el.getElement('#parkingspace').setStyle('display','block');
					}
				}
			}
		});
	},
	
	switches: function()
	{
		if($chk(this.element.getElements('p.switch')) && $chk(this.element.getElements('fieldset.toggle')))
		{
			this.element.getElements('p.switch').each(function(el) {
				var slider = new Fx.Slide(el.getNext('fieldset.toggle'), {
					duration: 200
				});
				el.store('slide', slider);
				if(!el.hasClass('open'))
				{
					slider.hide();
				}
			});
			
			this.element.getElements('p.switch').addEvent('click', function(e) {
				
				this.retrieve('slide').toggle();
				this.toggleClass('open');
				
			});
		}
	},
	
	increment: function()
	{
		this.element.getElements('input.increment').addEvents({
		
			'mousewheel': function(e){
				e.preventDefault();
				
				var increment = this.get('title');
				
				if(!$chk(increment))
				{
					increment = 1;
				}
				else
				{
					increment = increment.toInt();
				}
				
				var value = this.get('value').toInt();
				
				if(!value) value = 0;
				if (e.wheel < 0){
					value -= increment;
					if(value < 0) value = 0;
				} else {
					value += increment;
				}
				this.set('value', value);

			}
						
		});
	},
	
	checkSellType: function(e)
	{
		if(this.get('id') == 'sell_type_1')
		{
			if(this.get('checked'))
			{
				$('sell_box').setStyle('display','block');
			}
			else
			{
				$('sell_box').setStyle('display','none');
			}
		}
		else
		{
			if(this.get('checked'))
			{
				$('rent_box').setStyle('display','block');
			}
			else
			{
				$('rent_box').setStyle('display','none');
			}
		}
		
	},
	
	upload: function()
	{
		if($chk(this.element.getElements('p.file_upload')))
		{
			var element = this.element;
			
			if(this.element.getElement('#upload-browse-all'))
			{
				this.element.getElement('#upload-browse-all').addEvent('click', function(e) {
					var oldElement = element.getElement('p.file_upload');
					var newElement = oldElement.clone();
					newElement.getElement('input[type=file]').cloneEvents(oldElement.getElement('input[type=file]'));
					newElement.getElement('span.file-remove').cloneEvents(oldElement.getElement('span.file-remove'));
					
					newElement.inject(oldElement.getParent(), 'inside');
				
				});
			}
			
			this.element.getElements('p.file_upload span.file-remove').addEvent('click', function(e) {
				
				e.preventDefault();

				if(element.getElements('p.file_upload').length > 1)
				{
					this.getParent('p.file_upload').dispose();
				}
				
			});
			
			this.element.getElements('p.file_upload input[type=file]').addEvent('change', function(e) {
				var newElement = this.getParent('p.file_upload').clone();
				
				newElement.getElement('input[type=file]').cloneEvents(this);
				newElement.getElement('span.file-remove').cloneEvents(this.getParent('p.file_upload').getElement('span.file-remove'));
				
				newElement.inject(this.getParent('p.file_upload').getParent(), 'inside');
				
				
			});
			$('upload-status').dispose();
		}
	},
	
	submit: function() {
		
		if($('plaats_advertentie'))
    	{
			$('plaats_advertentie').addEvent('click', function(e) {
				if(e) e.preventDefault();
				var form = this.getParent('form');
				var padding = this.getParent('div#final_part').getParent();
				form.getElement('h2').set('html', 'Bezig met verwerken').setStyle('z-index',100);
				var loader = new Element('div', {
					'class': 'ajax_load',
					'styles': {
						'opacity': 0.8,
						'text-align':'center',
						'width': this.getParent('div#final_part').getSize().x,
						'top':  - padding.getStyle('padding-top').toInt(),
						'height': this.getParent('div#final_part').getSize().y + padding.getStyle('padding-top').toInt() + padding.getStyle('padding-bottom').toInt()
					}
				}).inject(this.getParent('div#final_part'));
				var textLoader = new Element('p',{
					'html': 'Een moment geduld a.u.b.<br />Uw advertentie wordt verwerkt.',
					'class': 'ajax_load_text'
				}).inject(loader);

				new Request.JSON({
					url: 'nl_/checkuser/', 
					onComplete: function(result) {
						if($chk(result.loggedIn) && result.loggedIn != 0)
						{
							form.submit();
						}
						else
						{
						
							
							SqueezeBox.fromElement($('hastologin'), {handler: 'clone',size: {x: 350, y: 230}}).chain(function() {
								$('sbox-content').getElement('input.login').addEvent('click', function(e) {
									e.preventDefault();
									loginUser(this);
								});
								$('sbox-content').getElement('input.register').addEvent('click', function(e) {
									e.preventDefault();
									goRegister();
								});
							});
							loader.dispose();
						}
					}
				}).post();

			});
		}
	}

});

var Site = new Class({

	initialize: function(element)
	{
		if(!$chk(element)) return false;
		
		this.element = element;
		
		if($('advertentie'))
		{
			this.advertentie = new Advertentie($('advertentie'));
		}
		
		this.attach();
	},
	
	attach: function()
	{
		this.accordion();
	},
	
	accordion: function()
	{

		var advertentie = this.element.getElement('#advertentie');

		if(advertentie)
		{
			var boxes = advertentie.getElements('.part');
			var togglers = this.element.getElements('.toggler');
			
			togglers.setStyle('cursor', 'pointer');
			
			boxes.setStyles({ 'display':'none', 'height': 'auto' });
			
			boxes[0].setStyles({'display':'block', 'height': 'auto'});
			
			var error = false;
			boxes.each(function(box,i) {
				if($chk(box.getElement('.error')) && !error)
				{
					boxes.setStyle('display','none');
					boxes[i].setStyle('display','block');
					error = true;
				}
			});
			
			advertentie.setStyle('display', 'block');
			
			togglers.each(function(el, i) {
				el.addEvent('click', function(e) {
					togglers.removeClass('active');
					boxes.setStyle('display','none');
					boxes[i].setStyle('display','block');
					el.addClass('active');
					advertentie.getElement('h2').set('html', boxes[i].get('title'));  
				});
			});
			boxes.each(function(el, i) {
				
				el.getElement('input.volgende').addEvent('click', function(e) {
					if(this.get('type') != 'submit')
					{
						togglers.each(function(el){
							el.removeClass('active');
						});
						togglers[i + 1].addClass('active');
						boxes.setStyle('display','none');
						boxes[i+1].setStyle('display','block');
						advertentie.getElement('h2').set('html', boxes[i+1].get('title'));
					}
				
				});
				
				el.getElement('input.terug').addEvent('click', function(e) {
					if(i < 1)
					{
						history.back(-1);
					}
					else
					{
						togglers.each(function(el){
							el.removeClass('active');
						});
						boxes.setStyle('display','none');
						boxes[i-1].setStyle('display','block');
						advertentie.getElement('h2').set('html', boxes[i-1].get('title'));
					}
					
				});
			});
		}
	}

});



function addErrors(errors)
{
	errors.each(function(error) {
	
		var width = error.getCoordinates().width - 10;
		
		if(width < 110)
		{
			width = 110;
		}
	
		var errorMsg = new Element('div', {
			'class': 'errorMsg'
		}).inject(document.body, 'inside');
		
		errorMsg.setStyles({
			'position': 'absolute',
			'visibility': 'hidden',
			'width': width + 'px'
		});
		
		error.setStyles({
			'position': 'relative'
		})
		
		error.addEvents({
			'focus': function(e) {
				if(this.get('title'))
				{
					if(Browser.Engine.trident){
						errorMsg.setStyles({
							'left': error.getBoundingClientRect().left,
							'top': error.getBoundingClientRect().top.toInt() + error.getCoordinates().height.toInt() + 5
						});
						
					}else{
						errorMsg.setStyles({
							'left': error.getPosition().x,
							'top': error.getPosition().y.toInt() + error.getCoordinates().height.toInt() + 5
						});
					}
					errorMsg.set('html', this.get('title'));
					errorMsg.fade('in');
				}
			},
			'blur': function(e) {
				if(this.get('title'))
				{
					errorMsg.fade('out');
				}
			}
		});
		
	});
}

window.addEvent('domready', function(e) {
	
	site = new Site($(document.body));
	
	SqueezeBox.initialize({
        size: {x: 350, y: 400}
    });
	
	if($('tabs'))
    {
		tabs = new SimpleTabs('tabs', {
			selector: 'h3.tabs'
		});
	}
	
	if($$('input.error')) {
		addErrors($$('input.error').combine($$('textarea.error')));
	}
	
	
	$$('.zoekcritereaitem span.hoverable').each(function(item){
		item.addEvents({
			'mouseover': function() {this.addClass('hover')},
			'mouseout': function() {this.removeClass('hover')}			
		})
	})

	$$('.complete').addEvents({
		'blur': function(e) {
		
			this.setStyle('background', '#fff url(/theme/img/address-loader.gif) right no-repeat');
			
			new Request.JSON({
				'url': 'nl_/complete/',
				onComplete: function(result)
				{
					this.setStyle('background', '#fff');
					if(result.Straat)
					{
						$('address').set('value', result.Straat);
						$('city').set('value', result.Woonplaats.capitalize());
						$('huisnr').focus();
					}
				}.bind(this)
			}).post({'zipcode':this.get('value')});
		}
	});

	$$('table.sort').each(function(table) {
	
		var myTable = new sortableTable(table, {
			overCls: 'over', 
			onClick: function(){alert(this.id)}
		});
	});
	
	$$('.collapse').each(function(el) {
		var togglers = el.getElements('.toggler');
		var boxes = el.getElements('.box');
		
		togglers.setStyle('cursor','pointer');
		var accordion = new Accordion(togglers, boxes, {
			'onActive': function(toggler, element) {
				if(toggler.getElement('span.switcher'))
				{
					toggler.getElement('span.switcher').fade('out');
					toggler.getElement('span.switcher').addClass('open');
				}
			},
			'onBackground': function(toggler, element) {
				if(toggler.getElement('span.switcher'))
				{
					toggler.getElement('span.switcher').fade('in');
					toggler.getElement('span.switcher').removeClass('open');
				}
			}
		});
		
		if(el.get('title') && el.get('title').toInt() > 0)
		{
			accordion.display(el.get('title'));
		}
	});
	
	$$('.meer_details').addEvents({
		'click': function(e)
		{
			e.preventDefault();
			
			if(this.getNext().getStyle('display') == 'none') {
				this.addClass('open');
				this.set('html','Minder details');
				this.getNext().setStyle('display', 'block');
			} else {
				this.removeClass('open');
				this.set('html','Meer details');
				this.getNext().setStyle('display', 'none');
			}
		}
	});
	
	
	$$('.photogallery').each(function(el) {
		new Gallery(el);
	});
	
	$$('.favadd').each(function(el) {
		el.addEvent('click', function(e) {
			e.preventDefault();
			
			if(this.hasClass('register'))
			{
				new Request.JSON({
					url: 'nl_/checkuser/', 
					onComplete: function(result) {
						if($chk(result.loggedIn) && result.loggedIn != 0)
						{
							form.submit();
						}
						else
						{
							SqueezeBox.fromElement($('hastologin'), {handler: 'clone',size: {x: 350, y: 225}});
						}
					}
				}).post();
			
			} else {
				new Request.JSON({
					'url': el.get('href'),
					onComplete: function(res)
					{
						if(res.success == 'added')
						{
							el.set('html', '<img src="./theme/img/ico/ico_favadd.gif" alt="Verwijder uit uw BOGonline" class="fLeft ico" />Deze advertentie <strong>niet</strong> meer volgen');
							alert('Dit object is toegevoegd aan uw Mijn BOGonline');
						}
						else
						{
							if(el.hasClass('tr'))
							{
								el.getParent('tr').empty().dispose()
							}
							else if(el.hasClass('div'))
							{
								el.getParent('div').empty().dispose()
							}
							else
							{
								el.set('html', '<img src="./theme/img/ico/ico_favadd.gif" alt="Opslaan in uw BOGonline" class="fLeft ico" />Deze advertentie volgen');
							}
							alert('Dit object is verwijderd uit uw Mijn BOGonline');
						}
					}
				}).post();
			}
			el.blur();
		});
	});

	$$('.searchAdd').each(function(el) {
		el.addEvent('click', function(e) {
			e.preventDefault();
			var title = $('search_title').get('value');
			if(title) {
				new Request.JSON({
					'url': el.get('href')+'/title/'+$('search_title').get('value'),
					onComplete: function(res)
					{
						if(res.success == true)
						{
							alert('Uw zoekopdracht is toegevoegd aan uw Mijn BOGonline');
						}
						else
						{
							alert('Kon uw zoekopdracht niet opslaan');
						}
					}
				}).post(el.getParent('form'));
			}
			else
			{
				alert('U moet een titel opgeven voor uw zoekopdracht');
			}
			
			el.blur();
		});
	});
	
	if($('change_password_slide'))
	{
		
		$('change_password_slide').setStyle('display','none');
		
		if($('change_password'))
		{
			var toggler = $('change_password');
			toggler.addEvent('click', function(e) {
				if($('change_password_slide').getStyle('display') == 'none')
				{
					$('change_password_slide').setStyle('display','block');
				}
				else
				{
					$('change_password_slide').setStyle('display','none');
				}
			});
		}
	}
	
	if($('slide'))
	{
		var slider = new Fx.Slide($('slide'), {duration: 450});
		
		if($('slide').getStyle('display') == 'none')
		{
			$('slide').setStyle('display','block');
		}
		
		if(!$('slide').hasClass('open')) slider.hide();
		
		if($('slider_toggle'))
		{
			var toggler = $('slider_toggle');
			toggler.addEvent('click', function(e) {
				slider.toggle();
				if(toggler.get('text') == 'Uitgebreid zoeken')
				{
					toggler.set('text', 'Snel zoeken');
				}
				else
				{
					toggler.set('text', 'Uitgebreid zoeken');
				}
			});
		}
	}
	
	if($('vergeten'))
	{
		$('vergeten').getElement('a').addEvent('click', function(e){
			
			e.preventDefault();
			
			if($('wwvergeten').getStyle('visibility') == 'visible')
			{
				$('wwvergeten').fade('out');
			}
			else
			{
				$('wwvergeten').fade('in');
			}
		});
	}
	
	SqueezeBox.assign($$('a[rel=boxed]'), {
		size: {x: 550, y: 400},
		ajaxOptions: {
			method: 'get' // we use GET for requesting plain HTML
		}
	});
	
	if($$('.rss').length > 0)
	{
		var myTips = new Tips('.rss');
		$$('.rss').each(function(rss){
			rss.addEvent('click', function(e) {
				window.open(this.get('href'));
				e.preventDefault();
			});
			rss.store('tip:title', 'Wat is RSS?');
			rss.store('tip:text', 'Met RSS kunt u in een feed lezer de nieuwste objecten binnen BOGonline volgen.');
		});
	}
	
	if($$('.verwijder').length > 0)
	{
		var myTips = new Tips('.verwijder');
		$$('.verwijder').each(function(verwijder){
			verwijder.store('tip:title', 'Verwijderen');
			verwijder.store('tip:text', 'klik op deze knop om dit item te verwijderen.');
		});
	}
	
	$$('a[rel=external]').addEvents({
		'click': function(e) {
			e.preventDefault();
			window.open(this.get('href'));
		}
	});
	
	$$('.statusUpdate').each(function(upd) {
		upd.addEvent('change', function(e) {
			new Request.JSON({
				'url': this.getParent('form').get('action'),
				'onComplete': function()
				{
					upd.highlight('#D3ECFF');
				}
			}).post(this.getParent('form'));
		});
	});
	
});