// NS Er op uit


$(function() {

	//config BlockUI
	$.blockUI.defaults = {
			// styles for the overlay iframe
			//overlayCSS:  { backgroundColor: 'transparent' },
			overlayCSS:  { backgroundColor: '#fff', opacity: '0.5' },
			// styles for the message when blocking the entire page
			pageMessageCSS:    { margin:'-50px 0 0 -144px',width:'288px', top:'25%', left:'500px', cursor:'auto'},
			// styles for the message when blocking an element
			//elementMessageCSS: { width:'250px', padding:'10px', textAlign:'center'},
			// allow body element to be stretched in ie6
			ie6Stretch: 1
	};
	
	// dialog definition
	$.blockUI.defaults.pageMessage = '<div id="popuppanel" class="panel"><div class="top"></div><div class="body"><h2></h2><a id="closepopup" href="#" title="Sluiten">Sluiten</a></div><div class="bottom"></div></div>';

 });

(function($) {

	$.fn.extend({
							
		// log function
		log: function (msg) {
      console.log("%s: %o", msg, this);
      return this;
  	},
		
		collapsablePanel: function(animate) {
			// default no nimation
			if (!animate) animate = false;
			// implicit iteration for maintaining good ref to THIS
			return this.each(function(){	
				// add anchors to collapse head
				$(".collapse-head", this).wrapInner("<a href=\"#\" class=\"collapse-action\"></a>");
				// add click eventhandler
				
				$("a.collapse-action", this).click(function(event) {
					var item = $(this).parent().parent(".collapse-item");
					var body = item.find(".collapse-body");
					// check animation
					if (animate) {
						item.addClass("collapse-animating");
						body.slideToggle("fast", function() {
							item.removeClass("collapse-animating");
						});
					}
					else {
						body.toggle();
					}
					item.toggleClass("collapse-open");
					// stop event
					event.preventDefault();
				});	
				
			});
			
		},
		// end collapsablePanel 
		
		priceSlider: function(outElemId) {
			return this.each(function(){	
				//  get input elem and its change things
				var outElem = $('#'+outElemId);
				var defaultValue = outElem.val();
				var onChangeHandler = outElem.attr("onchange");
				// fix the diff between browsers
				
				var handleChange = function() {
					if (typeof onChangeHandler == "function")
						onChangeHandler(); // ie
					else
						eval(onChangeHandler); // ff 
				}
				// clear the old one just in case
				outElem.attr("onchange","");
				// watch keypress for input
				outElem.keyup(
					function(event) {
						// check for digits, or backspace
						if ((event.keyCode >= 49 && event.keyCode <= 57) || event.keyCode == 8) {
							var val = outElem.val();
							if (val > 9) handleChange(); // two digits
							else setTimeout(handleChange, 1000); // one digit wait
						}
					}
				);
				// add slider
				$(this).append("<div class='ui-slider-handle'></div>");
				$(this).slider({
					minValue: "0", 
					maxValue: "100", 
					startValue: defaultValue, 
					slide: function(e, ui) { outElem.val(ui.slider.curValue); },
					stop: handleChange
				});
			});
		},
		// end priceSlider
		
		addSubmit: function() {
			return this.each(function(){											
				// add ghost anchor for submit button
				$(this).filter(".button").after("<a href=\"#\" class=\"" + $(this).attr("class") + "\"><span>" + $(this).val() + "</span></a>");
				// add click event handler																				
				$("a.submit", $(this).parent()).click(function(event) {
					event.preventDefault();
					
					$(this).parents("form").submit(); // no nested forms 
				});
			});
		},
		// end addSubmit
		
		_openHelperPopup: function(elem, title, caller) {
			this.caller = caller;
			var self = this;
			// create popup
			var pageMessage = $.blockUI.defaults.pageMessage;
			$.blockUI(pageMessage);
			// add content
			var popuppanel = $("#popuppanel div.body");
			popuppanel.append(elem);
			// change title
			$("#popuppanel div.body h2").text(title);
			// add close
			$("#closepopup").click(function(event) {
				$.unblockUI();
				event.preventDefault();
				// refocus on opening icon
				self.caller.focus();
			});
		},
		// end openPopup
		
		openHelperMap: function(title, mapElemId) {
			var mapElem = $('#'+mapElemId);
			return this.each(function() {
							 
				$(this).click(function(event) {	
					this.caller = $(this);
					var self = this;
					var input = $("input", $(this).parent());
					var onchangeHandler = input.attr("onchange");
					
					var provicieName = "";
					// create popup
					$(this)._openHelperPopup(mapElem, title, $(this));
					
					
					
					if(document.getElementById(mapElemId).hasClick != true) {
					
						// add event handlers
						$("area", mapElem).click(
								function(event) {
									input.val($(this).attr('alt'));
									// remove 'labeled' class from these inputs
									input.removeClass("labeled");
									$.unblockUI();
									event.preventDefault();
									// update panel ajaxwicket
							
									if (typeof onchangeHandler == "function") {
										onchangeHandler(); // ie
									}	
									else {
										eval(onchangeHandler); // ff
									}
							
									// refocus on opening icon
									self.caller.focus();
								}
						);
						
						document.getElementById(mapElemId).hasClick = true;
												
					}
					
					
					// stop event
					$("#closepopup").focus();
					event.preventDefault();
					
					
				});
				
				
			});
		},
		// end openHelperMap
		
		openHelperCalendar: function(title, isUpdateable) {
			return this.each(function() {
				// get a date to display 
				$(this).click(function(event) {	
					this.caller = $(this);
					var self = this;
					// get input elems						 
					var inputs = $("input", $(this).parent());
					var calendarDate;
					if (isUpdateable) 	
						calendarDate = [parseInt(inputs[0].value.substring(0,2),10),parseInt(inputs[0].value.substring(3,5),10)-1,parseInt(inputs[0].value.substring(6,10),10)];
					else 
						calendarDate = [parseInt(inputs[0].value,10),parseInt(inputs[1].value,10)-1,parseInt(inputs[2].value,10)];
					if(isNaN(calendarDate[0])||isNaN(calendarDate[1])||isNaN(calendarDate[2])) {
						var now = new Date();
						calendarDate = [now.getDate(),now.getMonth(),now.getFullYear()];
					}
					// build calendar
					var calendar = $(this)._createCalendar(calendarDate);	
					
					// create popup
					$(this)._openHelperPopup(calendar, title, $(this));
					
					// add event handlers
					$("div.calendarheader a.monthminus", calendar).click(function(e) {
						$(this)._recreateCalendar(-1, calendarDate, calendar);
						e.preventDefault();
					});
					$("div.calendarheader a.monthplus",calendar).click(function(e) {
						$(this)._recreateCalendar(1, calendarDate, calendar);
						e.preventDefault();
					});
					// select date based on isUpdateable
					$("div.calendarcontainer", calendar).click(function(event) {
						var day = event.target;
						if (day.parentNode.className.indexOf("current-month")!=-1) {
							if (isUpdateable) {
								var dateString = nulify($(event.target).text())+"/"+nulify(calendarDate[1]+1)+"/"+nulify(calendarDate[2]);
								inputs[0].value = dateString;
								
								onchangeHandler = inputs[0].onchange;
								
								if (typeof onchangeHandler == "function")
									onchangeHandler(); // ie
								else
									eval(onchangeHandler); // ff
							}
							else {
								inputs[0].value = nulify($(event.target).text());
								inputs[1].value = nulify(calendarDate[1]+1); 
								inputs[2].value = nulify(calendarDate[2]);
								
							}
							// remove 'labeled' class from these inputs
							inputs.removeClass("labeled");
							// unblock
							$.unblockUI();
							event.preventDefault();
							// refocus on opening icon
							self.caller.focus();
						}
					});
					// stop event
					$("#closepopup").focus();					
					event.preventDefault();
				});
			});
		},
		// end openHelperCalendar
		
		_createCalendar: function(calendarDate) {
			// create calendar html
			var calendar = $('<div><div class="calendarheader"><a class="monthminus" href="#">Vorige maand</a><h3>'+Date.monthNames[calendarDate[1]]+' '+calendarDate[2]+'</h3><a class="monthplus" href="#">Volgende maand</a></div></div>');
			calendar.append($('<div class="calendarcontainer"></div>').renderCalendar({month:calendarDate[1],year:calendarDate[2]}));
			
			return calendar;
		},
		// end _createCalendar
		
		_recreateCalendar: function(step, calendarDate, panel) {
			// recreate calendar in popup
			calendarDate[1] += step;
			if(calendarDate[1]==-1){calendarDate[1]=11;calendarDate[2]--};
			if(calendarDate[1]==12){calendarDate[1]=0;calendarDate[2]++};
			$("div.calendarheader h3",panel).html(Date.monthNames[calendarDate[1]]+" "+calendarDate[2]);
			$("div.calendarcontainer", panel).renderCalendar({month:calendarDate[1],year:calendarDate[2]});
		},
		// end _recreateCalendar


		openPhotoGallery: function(){
			var gallery = new PhotoGallery();

			return this.click(function(e){
				gallery.open(this.href);	
				e.preventDefault();
			});
		}
		
	});


	// Photogallery

	function PhotoGallery() {
		this.prevReg = /photogallery-prev/i;
		this.nextReg = /photogallery-next/i;
		this.closeReg = /photogallery-close/i;
		this.imgReg = /\.(jpg|png|gif)/i;
		this.speed = 1;

		this.backCompat = /backcompat/i.test(document.compatMode) || 
			/msie\s?6/i.test(navigator.userAgent);
	}

	PhotoGallery.prototype = {
		createContainer:function() {
			$(document.body).append(
				'<div id="photogallery" class="panel box">' + 
					'<span class="top"></span>' + 
					'<div class="body"></div>' + 
					'<span class="bottom"></span>' + 
				'</div>'
			);

			this.container = $('#photogallery');
			this.body = $('div.body', this.container);

			var self = this;
			this.container.click(function(e){
				if(self.handleClick(e)) {
					e.preventDefault();
				}
			});

			if(this.backCompat) {
				this.container.css({position:'absolute'});
			}
		},

		init:function() {
			init(this.body);
			this.current = $('.photogallery-list .active', this.container);
			this.lists = $('.photogallery-list ul', this.container);
			this.image = $('.photogallery-visual img', this.container);
			this.position = 0;

			var self = this;
			this.image.bind('load', function(){
				self.updateFrame();
			});
		},

		handleClick:function(e) {
			var link = e.target;
			if(!/^a$/i.test(link.nodeName)) {
				link = $(link).parents('a')[0];
			}
			
			if(link) {
				var cls = link.className,
					href = link.href,
					prevent = false;

				if(this.imgReg.test(href)) {
					prevent = this.displayImage(link, href);
				
				} else if(this.prevReg.test(cls)) {
					prevent = this.scroll(-this.speed);
				
				} else if(this.nextReg.test(cls)) {
					prevent = this.scroll(this.speed);
				
				} else if(this.closeReg.test(cls)) {
					prevent = this.close();
				}

				return prevent;
			}
		},

		displayImage:function(link, href) {
			if(this.current) {
				this.current.removeClass('active');
			}

			$('.photogallery-visual img', this.container).attr({src: href });

			var title = link.title? new RegExp("([^,]+),\\s?(.*)").exec(link.title) : [];
			var description = $('.photogallery-visual dd', this.container);
			description[0].innerHTML = title[1] || ' ';
			description[1].innerHTML = title[2] || ' ';
		
			this.current = $(link);
			this.current.addClass('active');
			return true;
		},

		updateFrame:function() {
			var frame = this.image.parent(),
				ratio = this.image.width() / this.image.height();

			if(ratio < 1) {
				frame.addClass('vertical');
			} else {
				frame.removeClass('vertical');
			}
		},

		scroll:function(dir) {
			this.position = (this.lists.length + this.position + dir) % this.lists.length;

			this.lists.hide();
			$(this.lists[this.position]).show();
			return true;
		},

		open:function(url) {
			if(!this.container) {
				this.createContainer();
			}

			$.blockUI(' ');
			
			var gallery = this.container, self = this, top = "50%";

			if(this.backCompat) {
				var availHeight = (window.innerHeight || document.documentElement.clientHeight) || document.body.clientHeight;
				var scrollTop = (window.pageYOffset || document.documentElement.scrollTop) || document.body.scrollTop;
				top = (scrollTop + availHeight/2) + 'px';
			}

			this.body.load(url, function(){
				gallery.css({visibility:'hidden', display:'block'});
				var marginTop = - gallery.height()/2; 
				gallery.css({display:'none', visibility:'visible', top:top, marginTop: marginTop }).fadeIn('fast');
				self.init();
			});
		},

		close:function() {
			this.container.hide();
			$.unblockUI(' ');
			return true;
		}
	}


})(jQuery);
 

function nulify(num){//puts a leading zero before 1,2,3,4,5,6,7,8,9
	if(num<10) return "0"+num;
	return num
}