//delayed foreach function
jQuery.fn.eachDelay = function(callback, speed){
	return jQuery.eachDelay( this, callback, speed)
}
jQuery.extend({
	eachDelay: function(object,callback, speed){ 
		var name, i = -1, length = object.length, $div = $('<div>'), id;
		if (length === undefined) { //not an array process as object
			var arr = [], x = -1;
			for (name in object) arr[++x] = name; 
			id = window.setInterval(function(){
			 if( ++i === arr.length || callback.call(object[ arr[i] ], arr[i], object[ arr[i] ]) === false) 
			 	 clearInterval(id);
			}, speed);	
		}
		else { //array-compatible element ie. [], jQuery Object
			id = window.setInterval(function(){ 
				if (++i === object.length || callback.call(object[i], i, object[i]) === false) 
					clearInterval(id);
			}, speed);
		}
		return object;
	}
});




$(document).ready(function($){

	//initial status	   
	$('.location').removeClass("active");
	$('#dot-volendam').addClass("active");
	$('#volendam a').addClass("active");
	$('.portal-sfeer-image').hide();
	$('#sfeer-volendam').show();


	//cycle effects
	var cyclecities = [ "almere", "amsterdam", "gemert", "hoekvanholland", "volendam" ];
	
	$.eachDelay(cyclecities,function(key,val){
  	
   	 	 	 var city = this;
   	 	 	 
			 $('.location').removeClass("active");
			 $('#portalmenu-ul li a').removeClass("active");
		     $('#dot-' + city).addClass("active");
		     $('#' + city + ' a').addClass("active");
		     
   	    	 $('.portal-sfeer-image').hide();
	    	 $('#sfeer-' + city).show();

		     //$('#sfeer-' + city).show("slow");
		     
		     //add current city to the end, so its infinite
		     cyclecities.push(city);
			
	},4000);


   
	//mouseover effects
	var cities = [ "volendam", "almere", "amsterdam", "gemert", "hoekvanholland" ];

    jQuery.each(cities, function() {
   	 	 	 var city = this;
   	 	 $('#' + city + ',#dot-' + city).mouseover(function() {
			 $('.location').removeClass("active");
			 $('#portalmenu-ul li a').removeClass("active");
		     $('#dot-' + city).addClass("active");
		     $('#' + city + ' a').addClass("active");
	    	 $('.portal-sfeer-image').hide();
		     $('#sfeer-' + city).show();
		});
   });
	   	     
	     

});