/*
* Cache van javascripts.script.js
* Created: 2010-12-09 23:10:38
*/

/*
$Author: sjors $
$LastChangedDate: 2006-10-19 14:05:31 +0200 (do, 19 okt 2006) $
$Id: javascripts.js 28 2006-10-19 12:05:31Z sjors $
$Rev: 28 $
*/

window.addEvent('domready', function() {
	if ($('newsimages')) {
		new imageRotator($('newsimages').getElement('div.images'));
	}

	if ($('aanbodsearch')) {
		$('aanbodsearch').addEvent('submit', function(e) {
			new Event(e).stop();
			var url = $('aanbodsearch').get('action');
			url += $('qs_soort').get('value') + '/';
			if ($('qs_discipline').get('value') != 'alle+disciplines') {
				url += $('qs_discipline').get('value') + '/';
			}
			window.location.href = url;
		});
	}

	if ($('aanbieder_keuze')) {
		new Accordion($('aanbieder_keuze').getElements('a.used'), 'div.aanbieders');
		$('aanbieder_keuze').getElements('a').each(function(letters) {
			letters.addEvent('click', function(e) {new Event(e).stop();});
		});
	}

	if ($('fotoalbum')) {
		new photoAlbum($('fotoalbum'), $('fotoalbum').getElements('a'));
	}

	if ($('addaanbieder')) {
		$('addaanbieder').getElement('input').focus();
		var frmvalidator = new Validator($('addaanbieder'));
		frmvalidator.addValidation("name",               "req",   "De naam van uw organisatie is verplicht");
		frmvalidator.addValidation("address",            "req",   "Het adres van uw organisatie is verplicht");
		frmvalidator.addValidation("zipcode",            "req",   "De postcode van uw organisatie is verplicht");
		frmvalidator.addValidation("city",               "req",   "De plaatsnaam van uw organisatie is verplicht");
		frmvalidator.addValidation("phonenumber",        "req",   "Het telefoonnummer van uw organisatie is verplicht");
		frmvalidator.addValidation("email",              "email", "Het door u opgegeven e-mailadres is niet geldig");
		frmvalidator.addValidation("contactlastname",    "req",   "U dient uw naam op te geven");
		frmvalidator.addValidation("contactemail",       "req",   "Geef het e-mail adres waarop u bereikbaar bent op");
		frmvalidator.addValidation("contactemail",       "email", "Het door u opgegeven e-mailadres is niet geldig");
	}

	if (Browser.Engine.trident) {
		$$('hr').each(function(hr) {
			new Element('div')
				.setStyles(hr.getStyles('background-image', 'background-repeat', 'height', 'margin', 'clear'))
				.replaces(hr);
		});
	}

	if ($('content')) {
		$('content').addEvent('ygresize', function() {
			var contentbottom = $('content').getCoordinates();
			var kaderbottom = $('kader').getCoordinates();
			var windowbottom = window.getScrollSize();
			contentbottom = contentbottom.bottom + 10;
			kaderbottom = kaderbottom.bottom - $('footer').getStyle('height').toInt();
			windowbottom = windowbottom.y - $('footer').getStyle('height').toInt();
			$('footer').setStyle('top', Math.max(contentbottom, kaderbottom, windowbottom) + 'px');
			var windowbottom = window.getScrollSize();
			$('wrapper').setStyle('height', windowbottom.y + 'px');
		});
		$('content').fireEvent('ygresize');
		$('content').watchResize();
	}
});

var imageRotator = Fx.Tween.extend({
	options: {
  	controlEvent: 'click',
  	autoInterval: 5000
	},
	
	initialize: function(element, options) {
		this.element  = element;
		this.property = 'top';
		this.images   = this.element.getElements('img');
		this.setOptions(options);
		this.controls = [];

		var me = this;
		this.images.each(function(el, i) {
			this.controls.push(
				new Element('div', {
					'class': 'imgrotator'+(i == this.images.length-1?'last':''),
					'styles': {'top': (i*24)+'px'}
				})
					.setText(i+1)
					.addEvent('mouseenter', function() {this.addClass('hover'); $clear(me.autotimer)})
					.addEvent('mouseleave', function() {this.removeClass('hover'); me.autotimer = me.auto.periodical(me.options.autoInterval, me)})
					.addEvent(this.options.controlEvent, this.display.bind(this, i))
					.injectBefore(el.getParent()
				)
			);
		}, this);

  	if (this.controls[0]) {
			this.controls[0].fireEvent('mouseleave');
			this.display(0);
		}
	},

	auto: function() {
		this.curimage++;
		if (!this.controls[this.curimage]) {
			this.curimage = 0;
		}
		this.controls[this.curimage].fireEvent(this.options.controlEvent);
	},

	display: function(i) {
		this.curimage = i;
		this.controls.each(function(ctrl, j) {
			if (i == j) {
				ctrl.addClass('current');
			} else {
				ctrl.removeClass('current');
			}
		});
		this.start(i*-120);
	}
});

var photoAlbum = Fx.Elements.extend({

	options: {
		thumb: {x: 50, y: 50},
		thumbmargin: {x: 15, y: 15}
	},
	
	initialize: function(album, thumbs, options) {
		this.album = album;
		this.thumbs = thumbs;
		this.setOptions(options);

		this.thumbs.setStyle('position', 'absolute');

		var albumsize = this.album.getCoordinates();
		var posx = - this.options.thumb.x - this.options.thumbmargin.x;
		var posy = 0;

		this.elements = [];
		this.thumbs.each(function(thumb, i) {
			posx = posx + this.options.thumb.x + this.options.thumbmargin.x;
			if (posx + this.options.thumb.x > albumsize.width) {
				posx = 0;
				posy = posy + this.options.thumb.y + this.options.thumbmargin.y;
			}
			thumb.addEvent('click', this.showImage.bindWithEvent(this, i));
			this.elements.push(thumb.getElement('img'));
			thumb.setStyles({
				'top': posy,
				'left': posx
			});
		}, this);

		this.album.setStyle('height', posy + this.options.thumb.y + this.options.thumbmargin.y);

		var windowscroll = window.getScrollSize();
		
		if (!$('bodyoverlay')) {
			new Element('div', {
				'id': 'bodyoverlay',
				'styles': {
					'position': 'absolute',
					'top': 0,
					'left': 0,
					'opacity': 0,
					'width': windowscroll.x+'px',
					'height': windowscroll.y+'px',
					'background-color': '#ffffff'
				}
			})
				.injectInside(document.body)
				.store('fx', new Fx.Tween($('bodyoverlay'), 'opacity'), {duration: 1000});
		}
		
		$('album_large').setStyles({
			'display': 'block',
	 		'top': windowscroll.y / 2,
			'left': windowscroll.x / 2
		})
			.injectInside(document.body)
			.store('fx', new Fx.Morph($('album_large', {duration: 1000, wait: false})));

		var me = this;
		$('album_large').getElement('.close').addEvent('click', function(e) {
			new Event(e).stop();
			$('album_large').retrieve('fx').start({
				'top': [$('album_large').getTop(), windowscroll.y / 2],
 				'height': [me.previmgsize.y+'px', 0]
			});
			$('album_large').retrieve('fx').start.delay(600, $('album_large').retrieve('fx'), {
				'width': [me.previmgsize.x+'px', 0],
		 		'padding': 0,
		 		'left': [$('album_large').getLeft(), windowscroll.x / 2]
			});
			me.previmgsize = {x: 0, y: 0};
			$('bodyoverlay').retrieve('fx').start.delay(1200, $('bodyoverlay').retrieve('fx'), 0);
			$('album_largeimg').getElement('img').dispose.delay(1200, $('album_largeimg').getElement('img'));
			$('album_title').setStyle('visibility', 'hidden');
			$('album_large').getElement('.close').setStyle('visibility', 'hidden');
			$('album_large').getElement('.next').setStyle('visibility', 'hidden');
			$('album_large').getElement('.previous').setStyle('visibility', 'hidden');
		});
		$('album_large').getElement('.next').addEvent('click', function(e) {
			new Event(e).stop();
			if (me.thumbs[me.curimg+1]) {
				me.thumbs[me.curimg+1].fireEvent('click');
			}
		});
		$('album_large').getElement('.previous').addEvent('click', function(e) {
			new Event(e).stop();
			if (me.thumbs[me.curimg-1]) {
				me.thumbs[me.curimg-1].fireEvent('click');
			}
		});
	},

	showImage: function(e, idx) {
		if (e) {
			new Event(e).stop();
		}
		var me = this;

		var removeimg = $('album_largeimg').getElement('img');
		if (removeimg) {
			removeimg.setStyle('z-index', 2);
		}
		
		this.curimg = idx;

		$('album_title').setStyle('visibility', 'visible');
		$('album_large').getElement('.close').setStyle('visibility', 'visible');
		$('album_large').getElement('.next').setStyle('visibility', me.thumbs[me.curimg+1]?'visible':'hidden');
		$('album_large').getElement('.previous').setStyle('visibility', me.thumbs[me.curimg-1]?'visible':'hidden');

		if ($('bodyoverlay').getStyle('opacity') != 0.8) {
			$('bodyoverlay').retrieve('fx').start(0.8);
		}

		if (!this.previmgsize) {
			this.previmgsize = {x: 0, y: 0};
		}

		$('album_title').set('html', this.thumbs[idx].getProperty('title'));

		var images = new Asset.images([this.thumbs[idx].getProperty('href')], {onComplete: function() {
			var image = images[0];
			image.setStyles({
				'opacity': 0,
				'z-index': 3
			});
			image.injectInside($('album_largeimg'));
			new Fx.Tween(image, 'opacity', {onComplete: function(){if(removeimg) {removeimg.dispose()}}}).start(1);
			var imgsize = image.getSize();
			imgsize = {x: imgsize.x, y: imgsize.y+40};

			var albumdims = me.album.getCoordinates();
			var windowscroll = window.getScrollSize();
			$('album_large').retrieve('fx').start({
				'left': [$('album_large').getLeft(), (windowscroll.x - imgsize.x) / 2],
				'width': [me.previmgsize.x+'px', imgsize.x+'px'],
				'padding': [$('album_large').getStyle('padding').toInt(), 10]
			});
			$('album_large').retrieve('fx').start.delay(600, $('album_large').retrieve('fx'), {
				'top': [$('album_large').getTop(), (windowscroll.y - imgsize.y) / 2],
				'height': [me.previmgsize.y+'px', imgsize.y+'px']
			});
			me.previmgsize = imgsize;
		}});		
	}
});

Element.implement({
	// Watch height and width of an element and call onResize when it changes
	watchResize: function(interval) {
		if (!interval) interval = 500;
		this.sizeChecksum = this.offsetHeight + '_' + this.offsetWidth;
		this.watchResizeInterval = this.checkResize.periodical(interval, this);
	},
	checkResize: function() {
		if (this.sizeChecksum != this.offsetHeight + '_' + this.offsetWidth) {
			this.sizeChecksum = this.offsetHeight + '_' + this.offsetWidth;
			this.fireEvent('ygresize');
		}
	}
});