
var Bladeraar = new Class({
	options: {
		miniHeight: 19, 
		maxiHeight: 60,
		Height: 80,
		Width: 350,
		activeClass: 'active',
		detail: false
	},
	items: [],
	bladen: [],
	bladinit: [],
	tabs: [],
	currentitem: null,
	lastcurrentitem: null,
	currentblad: 0,
	bladclass: null,
	tabclass: null,
	itemclass: null,
	currentshow: null,
	lastcurrentshow: null,
	
	initialize: function(bladclass, itemclass, tabclass, options) {
		this.bladclass = bladclass;
		this.itemclass = itemclass;
		this.tabclass = tabclass;
		this.setOptions(options);
		
		if (tabclass) {
			this.tabs = $$(tabclass);
			this.tabs.each(function (element, tabindex) { //console.log('tab');
				element.addEvent('click', function(){this.toonBlad(tabindex)}.bind(this));
				}.bind(this));
			};
			
		this.bladen = $$(bladclass);
		this.bladen.each(function (element, bladindex) { //console.log('blad');
			this.bladinit[bladindex] = false;
			}.bind(this));
	},
	
	initBlad: function(element, bladindex) {
		this.items[bladindex] = $(element).getElements(this.itemclass);
		element.slide('hide');
		if (this.bladinit[bladindex] == false) {
			this.items[bladindex].each(function(element, itemindex) {
				element.setStyle('z-index', (1000-itemindex));
				if (this.options.detail) {
					element.addEvent('mousedown', function(e){ new Event(e).stop(); mijndetail.preloadDetail(this.id);});
					element.addEvent('click', function(){this.updatecurrentshow(element, bladindex)}.bind(this));
					element.addEvent('click', function(e){ new Event(e).stop(); mijndetail.vulObjDetail(this.id, true, '');});
					}
				element.addEvent('mouseenter', function(){this.bladerNaar(element, bladindex)}.bind(this));
				}.bind(this));
				this.bladinit[bladindex] = true;
			}
	},
	
	updatecurrentshow: function(element, bladindex) {
		this.lastcurrentshow = this.currentshow
		this.currentshow = element;
		this.update(bladindex);
	},
	
	toonBlad: function(bladindex) {
		this.initBlad(this.bladen[bladindex], bladindex);
		this.bladen[this.currentblad].setStyle('display', 'none');
		this.bladen[this.currentblad].slide('out');
		this.currentblad = bladindex;
		this.bladen[bladindex].setStyle('display', 'block');
		this.bladen[bladindex].slide('in');
		this.tabs.each(function(element) {element.removeClass('aktief')}.bind(this));
		this.tabs[bladindex].addClass('aktief');
		//dirty!
		if (this.tabs[bladindex].titel) $('huidige').set({'html':''+this.tabs[bladindex].titel});
	},
	
	toonBladId: function(maand) {
		var tab = $('tab'+maand);
		var bladindex = this.tabs.indexOf(tab);
		this.toonBlad(bladindex);
	},
		
	herInit: function(bladindex) { 
	
		if (this.items[bladindex]) {
			this.items[bladindex].each(function(element, itemindex) {
				//element.removeEvents(); 
				element = null;
				}.bind(this));
			}
		this.items[bladindex] = null;
		
		this.items[bladindex] = this.bladen[bladindex].getElements('.vrstItem');
		this.items[bladindex].each(function (element, itemindex) {
			this.items[bladindex][itemindex].setStyle('z-index', (1000-itemindex));
			element.addEvent('mouseenter', function(){this.bladerNaar(element, bladindex)}.bind(this));
			element.addEvent('mousedown', function(e){ new Event(e).stop(); mijndetail.preloadDetail(this.id);});
			element.addEvent('click', function(){this.updatecurrentshow(element, bladindex)}.bind(this));
			element.addEvent('click', function(e){ new Event(e).stop(); mijndetail.vulObjDetail(this.id, true, '');});
			}.bind(this));

		if (!$('cbgeweest').checked) this.bladen[bladindex].getElements('.geweest').addClass('verberg');
		else this.bladen[bladindex].getElements('.geweest').removeClass('verberg');
			
		if (this.items[bladindex].length == 1) mijndetail.vulObjDetail(this.items[bladindex][0].id, true, this.items[bladindex][0].arg);     //mijndetail.showVrst(this.items[bladindex][0].id);
		//else mijndetail.showVrst(0);
		//this.toonBlad(bladindex);
		this.bladen[this.currentblad].slide('in');
	},
	
	bladerNaar: function(element, bladindex) {
		if (this.currentitem == element) return;
		if (!element) return;
		if (this.currentitem) this.currentitem.removeClass(this.options.activeClass);
		this.lastcurrentitem = this.currentitem;
		this.currentitem = element;
		if (this.currentitem) this.currentitem.addClass(this.options.activeClass);
		this.update(bladindex);
		var plaatje = $(element).getElement('img').src;
		if ((plaatje) && (plaatje.substring(plaatje.length-3, plaatje.length) == "gif")) {
			$(element).getElement('img').src = 'foto/minithumb/'+this.currentitem.id+'.jpg';
			}
	},
	
	ga: function(to) {
		var index = this.items[this.currentblad].indexOf(this.currentshow)+to+0;
		nextitem = this.items[this.currentblad][index];
		if (!nextitem) {
			if (to == 1 && this.currentblad < 19) {
				this.toonBlad(this.currentblad+1);
				nextitem = this.items[this.currentblad][0];
				}
			if (to == -1 && this.currentblad > 0) {
				this.toonBlad(this.currentblad-1);
				laatste = this.items[this.currentblad].length;
				nextitem = this.items[this.currentblad][laatste-1];
				}
			}
		if (nextitem) {
			this.updatecurrentshow(nextitem);
			this.bladerNaar(nextitem, this.currentblad);
			mijndetail.vulObjDetail(nextitem.id, true, '');		
			}
	},

	toonVrstNr: function(nr) {
		var vrstElement = $(''+nr);
		var blad = vrstElement.getParent();
		var i=0;
		for (i=0; i<this.bladen.length; i++) {
			if (this.bladen[i] == blad) break;
			}	
		this.toonBlad(i);
		this.bladerNaar(vrstElement, i);
		this.updatecurrentshow(vrstElement);
		mijndetail.vulObjDetail(nr, true, '');
	},	
	
	toonEerste: function() {
		var element = (this.bladen[this.currentblad]).getElement('.komend');
		this.bladerNaar(element, this.currentblad);
		//element.fireEvent('click');
		if (element) mijndetail.vulObjDetail(element.id, true, '')
		this.updatecurrentshow(element, this.currentblad)
	},
			

	update: function(bladindex) {
		if(this.lastcurrentitem) this.lastcurrentitem.morph({'margin-top':'-61px', 'margin-left':'0px'});
		if(this.lastcurrentshow) this.lastcurrentshow.morph({'margin-top':'-61px', 'margin-left':'0px'});
		if(this.currentitem) this.currentitem.morph({'margin-top':'-16px'});
		if(this.currentshow) this.currentshow.morph({'margin-top':'-16px', 'margin-left':'10px'});
	}
	
});

Bladeraar.implement(new Options);


