var gIsDragged = false;
	var weatherIsDragged = false;
	var draggers = [];
	var zIndex = 10;
	var gWobbleTimeout = '';
	
	
	startHomePage = function(){
		unWaiter();
		// replace spaces in ID's of all img-elements:
		$$('img').each(function(img){
			var imgID = img.id.toString();
			imgID = imgID.replace(/( )/g,'_');
			img.id = imgID;
			// wobble functions
			img.observe('mouseover', setWobbleTimer)
			img.observe('mouseout', unsetWobbleTimer)
		})
		$$('.containerPlus').each(function(elem){
			var imgID = elem.getAttribute('imgID').toString();
			imgID = imgID.replace(/( )/g,'_');
			imgID = imgID.replace(/(\?)/g,'_');
			elem.setAttribute('imgID', imgID);
			elem.setAttribute('id', "containerPlus_"+imgID);
		});
		$$('.tooltip').each(function(elem){
			var imgID = elem.getAttribute('imgID').toString();
			imgID = imgID.replace(/( )/g,'_');
			imgID = imgID.replace(/(\?)/g,'_');
			elem.setAttribute('imgID', imgID);
//			elem.setAttribute('id', "containerPlus_"+imgID);
		});

		$$('.tooltip').each(assignTooltip);
		$$('.containerPlus').each(assignFloater);
		
		var draggables = $$('.boekje'); //document.getElementsByClassName(className);
		$A(draggables).each(
			function(dragger){
				dragger.observe('mouseover', setWobbleTimer)
				dragger.observe('mouseout', unsetWobbleTimer)
				makeZIndexedDraggable(dragger);	
			}
		);

		$$('.newsDragMe').each(
			function(dragger){
				dragger.observe('mouseover', setWobbleTimer)
				dragger.observe('mouseout', unsetWobbleTimer)
				makeZIndexedDraggable(dragger);	
			}
		);

		initDraggables('dragMe');
	}
	
	startBoekPage = function(){
		unWaiter();
		// replace spaces in ID's of all img-elements:
		$$('img').each(function(img){
			var imgID = img.id.toString();
			imgID = imgID.replace(/( )/g,'_');
			imgID = imgID.replace(/(\?)/g,'_');
			img.id = imgID;
			// wobble functions
			img.observe('mouseover', setWobbleTimer)
			img.observe('mouseout', unsetWobbleTimer)
		})
		$$('.containerPlus').each(function(elem){
			if (elem.getAttribute('imgID')){
				var imgID = elem.getAttribute('imgID').toString();
				imgID = imgID.replace(/( )/g,'_');
				imgID = imgID.replace(/(\?)/g,'_');
				elem.setAttribute('imgID', imgID);
				elem.setAttribute('id', "containerPlus_"+imgID);
			}
		});
		$$('.tooltip').each(function(elem){
			var imgID = elem.getAttribute('imgID').toString();
			imgID = imgID.replace(/( )/g,'_');
			imgID = imgID.replace(/(\?)/g,'_');
			elem.setAttribute('imgID', imgID);
//			elem.setAttribute('id', "containerPlus_"+imgID);
		});

		$$('.tooltip').each(assignTooltip);
		$$('.containerPlus').each(assignFloater);
		initDraggables('dragMe');
		setWeatherPos();
		// check for hashtag:
		var hash = window.location.hash;
		if (hash){
			hash = hash.toString().replace('#', '');
			hash = hash.split('.');
			$$('.containerPlus').each(
				function(elem){
					if (hash.indexOf(elem.getAttribute('clientID')) > -1){
						_showFloater(elem.getAttribute('imgID'))
					}
				}
			)
			
		}
	}
	
	setWobbleTimer = function(e){
		if (gIsDragged) return;
		var elem = e.element();
		gWobbleTimeout = setTimeout(function(){wobbleElem(elem)}, 3000);
	}
	
	unsetWobbleTimer = function(){
		if (gIsDragged) return;
		clearTimeout(gWobbleTimeout);
	}
	
	wobbleElem = function(elem){
		elem.style.cursor = 'move';
		new Effect.Shake(elem);
		setTimeout(function(){elem.style.cursor = 'pointer';makeZIndexedDraggable(elem);}, 3000);
		
		
	}
	
	assignFloater = function(elem){
		var img = elem.getAttribute('imgID');
		if (!img || !$(img)) {
			if (window.console) console.log("ImgID:" + img + " was not found!", elem);
			return;
		}
		// move elem outside image container if parent is dragMe:
		var parentNode = getParentDragMe($(img));
		if (parentNode) $(document.body).insert(elem);
		$(img).observe('click', showFloater);
	}
	
	showFloater = function(e){
		var srcImg = e.element();
		if (gIsDragged) return;
		var img = srcImg.getAttribute('id');
		if (!img){
			if (window.console) console.log(img + " WAS nog found.. boohoo");
			return;
		}
		_showFloater(img);
	}
	
	_showFloater = function(img){
		$('containerPlus_'+img).show();
		var container = $j('#containerPlus_'+img).buildContainers({
			containment:"document",
			elementsPath:"/images/elements/",
			position:'absolute',
			top:'0px'
		});
		// get parentNode "dragMe":
		var parentNode = getParentDragMe($(img));
//		alert("KOM IK HIER?")
		if (parentNode){
			var absLeft = parseInt($(img).offsetLeft) + parseInt(parentNode.style.left);
			var absTop  = parseInt($(img).offsetTop) + parseInt(parentNode.style.top);
		}
		// give container new spot:
		var containerID = container.id;
		var containerBottom = container.offset().top + container.outerHeight() + 5;
		var documentBottom = $j('body').height();
		var overhead = documentBottom - containerBottom;
		if (overhead < 0){
			var newTop = container.offset().top + overhead;
			if (newTop < 0){
				// window's top will be above the document-top; set window top to match the document-top;
				overhead = 0-container.offset().top;
			}
			container.css({top:overhead});
		}
		container.find('.mbcontainercontent').find('img').each(
			function(){
				resizeContainer(this,container)
			}
		)
		// now resize the container so it won't trigger a overflow:scroll on the document:
		var diff = container.find('.mbcontainercontent').height()  - container.find('.mbcontainercontent').height()// difference between content container and de parent
		if ( (container.find('.mbcontainercontent').height() + diff) > documentBottom){
			container.mb_resizeTo((documentBottom - diff))
		}else{
			container.mb_resizeTo((container.height()+5))
		}
		if (parentNode){
			$('containerPlus_'+img).style.left = absLeft + 'px';
			$('containerPlus_'+img).style.top = absTop + 'px';
		}
		
		
		//move container if it looks to be out of screen;
//		var containerBottom = 
		setTimeout(function(){
			var containerBottom = container.offset().top + container.outerHeight() + 0;
			var diff =  documentBottom - containerBottom;
			if (diff < 0){
				var moveToTop = container.offset().top + diff;
				if (moveToTop < 10) moveToTop = 10;
				$('containerPlus_'+img).setStyle('top:' + moveToTop + 'px')
			}
		}, 500)
	}
	
	getParentDragMe = function(elem){
		if (!elem) return false;
		if (elem.className=='dragMe') return elem;
		
		return getParentDragMe(elem.parentNode);
			
	}

	resizeContainer = function(elem,container){
		if ($j(elem).width() > container.find('.mbcontainercontent').width()){
			// container is too small:
			var newWidth = $j(elem).width() + (container.width() - container.find('.mbcontainercontent').width())
			container.css({width:newWidth})
		}
	}
	
	assignTooltip = function(elem){
		var img = elem.getAttribute('imgID');
		if (!img || !$(img)) return;
		$(img).setAttribute('title', elem.getAttribute('title'));
		$j('#'+img).mbTooltip({ 
	      wait:100,
	      cssClass:"default", 
	      timePerWord:0,  
	      hasArrow:false,
	      hasShadow:true,
	      imgPath:"/images/",
	      ancor:"mouse",
	      shadowColor:"black", 
	      mb_fade:100
	    });		
	}

	makeZIndexedDraggable = function (element){
		var tmpDraggable= new Draggable(
			element,
			{
				endeffect: setZindex,
				onDrag : setIsDragging,
				onStart : function(){return false;}
			}
		)
		var drag = {'elem': element,'dragger' : tmpDraggable}
		draggers.push(drag);
	}
	
	setIsDragging = function(e){
		if (gWobbleTimeout) clearTimeout(gWobbleTimeout);
		var obj = e;
		obj.element.afterDragLeft= obj.delta[0];
		obj.element.afterDragTop = obj.delta[1];
		gIsDragged = true;
	}
	
	setZindex = function(element){
		setTimeout(
			function(){gIsDragged = false;}, 150
		);
		//gIsDragged = false;
		var currIndex = parseInt(zIndex);
		element.style.zIndex = currIndex+10;
		zIndex = element.style.zIndex;
	}

	function dragUpdate(){
		return true;
	}

	function getCachedBin(URI, parentNode){
		var img = new Image();
		img.src= URI.unescapeHTML();
	}

    savePositions = function(){
		$$('.dragMe').each(
			function(dragger){
				if (dragger.getAttribute('cid')){
					if (dragger.getAttribute('cid') != '68'){ // yeah.. I know, nasty.. but it's late, And I wanna sleep...
						var rgList = '';
						var outArr = new Array();
						outArr.push('contentID=' + dragger.getAttribute('cid'));
						outArr.push('leftPos=' + dragger.offsetLeft);
						outArr.push('topPos=' + dragger.offsetTop);
						var wpsRPC = new wps.rpc;
						wpsRPC.debug = true;
						wpsRPC.attachWaiter(waiter, this);
						wpsRPC.attachUnWaiter(unWaiter, this);
						wpsRPC.createCall('content', function(){}, this);
						wpsRPC.call('saveBlockProperties', outArr);
					}					
				}
			}
		);
		$$('.newsDragMe').each(
				function(dragger){
					dragger.absolutize();
					if (dragger.getAttribute('nid')){
						var rgList = '';
						var outArr = new Array();
						outArr.push('newsID=' + dragger.getAttribute('nid'));
						outArr.push('leftPos=' + dragger.offsetLeft);
						outArr.push('topPos=' + dragger.offsetTop);
						
						var wpsRPC = new wps.rpc;
						wpsRPC.debug = true;
						wpsRPC.attachWaiter(waiter, this);
						wpsRPC.attachUnWaiter(unWaiter, this);
						wpsRPC.createCall('news', function(){}, this);
						wpsRPC.call('saveNewsPosition', outArr);
					}
				}
			);
		
    }

    function showBookTitle(elem, title, plank){
		$('boekMsgBoard_'+plank).show();
		$('boekMsgBoard_'+plank).update(title);
    }
    
    function hideBookTitle(plank){
    	$('boekMsgBoard_'+plank).hide();
//		$('boekMsgBoard_'+plank).update('');
    }

    waiter = function(){
    	if ($('waiter')){
    		$('waiter').style.display = 'block';
    	}
    }
    
    unWaiter = function(){
    	if ($('waiter')){
    		$('waiter').style.display = 'none';
    	}
    }
    
    sendContactRequest = function(){
    	// check values:
    	var ok = true;
    	var lWps = new wps.base();
    	var name = $('contactName').getValue();
    	if (!name){
    		$('contactNameError').show();
    		ok = false;
    	}else{
    		$('contactNameError').hide();
    	}

    	var email = $('contactEmail').getValue();
    	if (!email || !lWps.is_email(email) ){
    		$('contactEmailError').show();
    		ok = false;
    	}else{
    		$('contactEmailError').hide();
    	}

    	var message = $('contactMessage').getValue();
    	if (!message){
    		$('contactMessageError').show();
    		ok = false;
    	}else{
    		$('contactMessageError').hide();
    	}    	
    	
    	if (ok){
			var wpsRPC = new wps.rpc;
			wpsRPC.debug = true;
			wpsRPC.attachWaiter(waiter, this);
			wpsRPC.attachUnWaiter(unWaiter, this);
			wpsRPC.createCall('leesmijClient', function(){$j('#containerPlus_contact').mb_close();alert("Je bericht is verzonden!")}, this);
			wpsRPC.call('sendMessage', 'fromName=' + name, 'from=' +email, 'message=<![CDATA[' + message +']]>');		
    	}
    }
    
    function setWeatherPos(){
    	if ($("weatherWidgetImage")){
    		// get outer most position of divs;
    		var outerRight =0;
    		$$('.dragMe').each(
    			function(elem){
    				var right = parseInt(elem.offsetLeft) + elem.getWidth();
    				if (right > outerRight) {
    					outerRight = right;
    				}
    			}
    		)
        	if ($(document.body).getWidth() > outerRight){
        		$('weatherWidgetImage').setStyle('top:10px;left:' + ((parseInt($(document.body).getWidth()) - parseInt($('weatherWidgetImage').getWidth())) - 30) + 'px;');
        		$('containerPlus_weatherWidgetImage').setStyle('top:50px;left:' + (parseInt($(document.body).getWidth()) - 330) + 'px;');
        	}else{
        		outerRight = outerRight + 40;
        		$('weatherWidgetImage').setStyle('top:10px;left:' + outerRight + 'px;');
        		$('containerPlus_weatherWidgetImage').setStyle('top:10px;left:' + (outerRight -300) + 'px;');
        	}
    		$('weatherWidgetImage').show();
    	}
		$j('#weatherWidgetContainer').mbTooltip({ 
		      wait:100,
		      cssClass:"default", 
		      timePerWord:0,  
		      hasArrow:false,
		      hasShadow:true,
		      imgPath:"/images/",
		      ancor:"mouse",
		      shadowColor:"black", 
		      mb_fade:100
		    });		
    	
    	$$('#weatherWidgetContainer img').each(
    		function(elem){

    			elem.observe('click', 
        				function(){
    						$('containerPlus_weatherWidgetImage').show();
    	    				var ding = $j('#containerPlus_weatherWidgetImage').buildContainers({
    	    					containment:"document",
    	    					elementsPath:"/images/elements/",
    	    					position:'absolute',
    	    					top:'50px'
    	    				});
        				}
        			);

    		}
    	)
    }
    
    showWeatherWidget = function(){
    	
    }
    
    sendToFriends = function(){
    	// check values:
    	var ok = true;
    	var lWps = new wps.base();
    	var name = $('send2FriendName').getValue();
    	if (!name){
    		$('send2FriendNameError').show();
    		ok = false;
    	}else{
    		$('send2FriendNameError').hide();
    	}

    	var email = $('send2FriendEmail').getValue();
    	if (!email || !lWps.is_email(email) ){
    		$('send2FriendEmailError').show();
    		ok = false;
    	}else{
    		$('send2FriendEmailError').hide();
    	}

    	var friends = $('send2FriendFriends').getValue();
    	if (!friends){
    		$('send2FriendFriendsError').show();
    		ok = false;
    		return;
    	}else{
    		if (friends.indexOf(",") < -1){
    			if (!lWps.is_email(friends) ){
    				$('send2FriendFriendsError').show();
    				ok = false;
    				return;
    			}
    		}else{
    			var friendsArray = friends.split(",");
    			friendsArray.each(
    				function(email){
    					email = email.replace(' ', '');
    					if (!lWps.is_email(email) ){
    	    				$('send2FriendFriendsError').show();
    	    				ok = false;
    	    				return;
    					}
    				}
    			)
    		}
    	}
		$('send2FriendFriendsError').hide();
    	
    	if (ok){
			var wpsRPC = new wps.rpc;
			wpsRPC.debug = true;
			wpsRPC.attachWaiter(waiter, this);
			wpsRPC.attachUnWaiter(unWaiter, this);
			wpsRPC.createCall('leesmijClient', function(){$j('#containerPlus_send2Friend').mb_close();alert("Je bericht is verzonden!")}, this);
			wpsRPC.call('send2Friend', 'fromName=' + name, 'from=' +email, 'email='+email, 'friends=<![CDATA[' + friends +']]>');		
    	}    	
    }
    // facades;
    showRegistration = function(){}
    showAlt = function(){}
    
    
	// yeah I know: strange hack/procedure; it's time to go live.. 

	var aanmeldFormName = '';
	var aanmeldFormEmail = '';
	var aanmeldFormURL = '';
	var aanmeldFormAge = ''; 
	
	function sendAanmeldForm(){
		var lWps = new wps.base();
		var form = $('aanmeldPostForm');
		$('formAanmeldName').value = aanmeldFormName;
		$('formAanmeldEmail').value = aanmeldFormEmail;
		$('formAanmeldURL').value = aanmeldFormURL;
		$('formAanmeldAge').value = aanmeldFormAge;
		if (!lWps.is_email(aanmeldFormEmail)){
			createError(form['formAanmeldEmail'], "Email is verplicht!");
			return;
		}
		if (!form['formAanmeldName'].value){
			createError(form['formAanmeldName'], "Naam is verplicht!");
			return;
		}
		if (form['formAanmeldAge'].value){
			if (!lWps.is_numeric(parseInt(form['formAanmeldAge'].value))){
				createError(form['formAanmeldAge'], "Dat is geen getal!");
				return;	
			}else if (parseInt(form['formAanmeldAge'].value) > 100){
				createError(form['formAanmeldAge'], "Zou oud kan je helemaal niet zijn!");
				return;
			}
		}
		$('aanmeldPostForm').submit();
		alert('Je aanmelding is voltooid!');
		return false;
	}
	
	function setAanmeldFormValue(elem){
		switch (elem.id){
			case 'formAanmeldName':	
				aanmeldFormName = elem.value;
			break;
			case 'formAanmeldEmail':
				 aanmeldFormEmail = elem.value;
			break;
			case 'formAanmeldURL':
				aanmeldFormURL = elem.value;
			break;
			case 'formAanmeldAge':
				aanmeldFormAge = elem.value;
			break;
		}
	}
	
	function createError(elem, msg){
			alert(msg);
	}