﻿$(function() {
    var $ac_background	= $('#ac_background'),
    $ac_bgimage		= $ac_background.find('.ac_bgimage'),
    $ac_loading		= $ac_background.find('.ac_loading'),

    $ac_content		= $('#ac_content'),
    $title			= $ac_content.find('div:first'),
    $menu			= $ac_content.find('.ac_menu'),
    $submenu        = $ac_content.find('.ac_submenu'),
    $mainNav		= $menu.find('ul:first'),
    $menuItems		= $mainNav.children('li'),
    $subNav         = $submenu.find('ul').not('.ps_nav'),
    $submenuItems   = $subNav.children('li'),
    $backtomain     = $('.ac_submenu ul li a.backtomain'),
    totalItems		= $menuItems.length,
    $ItemImages		= new Array();
    $subItemImages  = new Array();
    var $loadsecondimg = false;
    var $currLoadedImage, $currLoadedParentImage;
    
    /* 
    for this menu, we will preload all the images. 
    let's add all the image sources to an array,
    including the bg image
    */
    $menuItems.each(function(i) {
	    $ItemImages.push($(this).children('a:first').attr('href'));
    });
    $ItemImages.push($ac_bgimage.attr('src'));
    
    $submenuItems.each(function(i) {
	    $subItemImages.push($(this).children('a:first').attr('href'));
    });
    $subItemImages.push($ac_bgimage.attr('src'));
    	  

    var Menu 			= (function(){
	    var init				= function() {
		    loadPage();
		    initWindowEvent();
	    },
	    loadPage			= function() {
		    /*
			    1- loads the bg image and all the item images;
			    2- shows the bg image;
			    3- shows / slides out the menu;
			    4- shows the menu items;
			    5- initializes the menu items events
		     */
		    $ac_loading.show();//show loading status image
		    $currLoadedParentImage = $ac_background.find(".ac_bgimage:eq(1)").attr("src");
		    $.when(loadImages()).done(function(){
			    $.when(showBGImage()).done(function(){
				    //hide the loading status image
				    $ac_loading.hide();
				    
			        $(".ac_menu > ul > li:not(.quick), .ac_submenu > ul > li:not(.terug)").hover(function() {
                        $('.submenutitle').css("top","112px");
                        $(this).stop().animate({top: '-6px'},{queue:false,duration:100});
                        if($.browser.safari && parseInt($.browser.version.substr(0,1))>3){
	                        $('.submenutitle', this).stop().animate({top: '106px'},{queue:false,duration:100});
                        }else {
                            $('.submenutitle', this).stop().animate({top: '112px'},{queue:false,duration:100});
                        }
                        
			        }, function() {
			            $(this).stop().animate({top: '0'},{queue:false,duration:100});
			            $('.submenutitle', this).stop().animate({top: '112px'},{queue:false,duration:100});
			        });
			        
				    $.when(slideOutMenu()).done(function(){
					    $.when(toggleMenuItems('up', $menuItems)).done(function(){
					        initEventsSubMenu();
					        initEventsSubSubMenu();
				        });
				    });
			    });
		    });
	    },
	    showBGImage			= function() {
		    return $.Deferred(
		    function(dfd) {
			    //adjusts the dimensions of the image to fit the screen
			    adjustImageSize($ac_bgimage);
			    $ac_bgimage.fadeIn(1000, dfd.resolve);
		    }
	    ).promise();
	    },
	    slideOutMenu		= function() {
		    /* calculate new width for the menu */
		    $(".ac_menu ul").css("display","block");
		    var new_w	= $(window).width() - $title.outerWidth(true);
		    return $.Deferred(
		    function(dfd) {
			    //slides out the menu
			    $menu.stop()
			    .animate({
				    width	: new_w + 'px'
			    }, 300, dfd.resolve);
		    }
	    ).promise();
	    },
		    /* shows / hides the menu items */
		    toggleMenuItems		= function(dir, $itemsToToggle) {
		    return $.Deferred(
		    function(dfd) {
			    /*
			    slides in / out the items. 
			    different animation time for each one.	    */
			    
			    
			    $itemsToToggle.each(function(i) {
			        var $el_title	= $(this).children('a:first'),
				        marginTop, opacity, easing;
			        if(dir === 'up'){
				        marginTop	= '37px';
				        opacity		= 1;
				        easing		= 'easeOutBack';
			        }
			        else if(dir === 'down'){
				        marginTop	= '60px';
				        opacity		= 0;
				        easing		= 'easeInBack';
		            }
		            
				    $el_title.stop()
				    .animate({
					    marginTop	: marginTop,
					    opacity		: opacity
				     }, 100 + i * 150 , easing, function(){
					    if(i === totalItems - 1)
						    dfd.resolve();
				    }).fadeTo(200, opacity);
			    });
		    }
	    ).promise();
	    },
	    initEventsSubMenu	= function() {
		    $menuItems.each(function(i) {
			    var $item		= $(this), // the <li>
			    $el_title	= $item.children('a:first'),
			    el_image	= $el_title.attr('href'),
			    $sub_menu	= $item.find('.ac_subitem'),
			    $ac_close	= $sub_menu.find('.ac_close');
			    var index;
    			
			    /* user clicks one item : appetizers | main course | desserts | wines | specials */
			    $el_title.bind('click.Menu', function(e) {
                    index = ($(this).parent().index() + 1); 
				    $('.menutitle').css("display","none");
	                    if($item.is('.quick, .gastenboek, .quicktwee, .quickthree')) {
	                     $.when(toggleMenuItems('down', $menuItems)).done(function(){
	                        openSubMenu($item, $sub_menu, el_image);	                        
	                        $ac_close.bind('click.subMenu', function(e) {
				                showItemImage($currLoadedParentImage);
				                closeSubMenu($sub_menu);			
				                $('.menutitle').css("display","block");	                
				                return false;
			                });			                
			                showItemImage(el_image);
			                });                            
	                    } else if($item.hasClass("book")) {	
	                        $('.menutitle').css("display","block");	 
	                    } else if($item.hasClass("bookbinnen")) {	
	                        $('.menutitle').css("display","block");	 
	                    } else {
	                        $submenu.find('ul').css("display","none");                                                    
                            $subNav = $submenu.find('.ac_submenu_'+index);
                            $submenuItems = $subNav.children('li');
                            $submenuItems.parent().css("display","block"); 
                            
	                        $.when(toggleMenuItems('down', $menuItems)).done(function(){                    
	                            $menu.css("display","none");
	                            $submenu.css("display","block");
	                            var newsub_w = $(window).width() - $title.outerWidth(true);
				                $submenu.css("width", newsub_w);  
	                            toggleMenuItems('up', $submenuItems);
	                            $currLoadedImage = el_image;
		                        showItemImage(el_image);
		                    });
	                    }		        
			        return false;
			    });
		    });
	    },
	    initEventsSubSubMenu	= function() {
	        /* user clicks on back to main button */
		    $backtomain.click(function(e) {    
			    toggleMenuItems('down', $submenuItems);
			    $menu.css("display","block");
                $submenu.css("display","none"); 
		        toggleMenuItems('up', $menuItems);
		        showItemImage($currLoadedParentImage);
		        $('.menutitle').css("display","block");
			    return false;
		    });
		    
		    $submenuItems.each(function(i) {
			    var $item		= $(this), // the <li>
			    $el_title	= $item.children('a:first'),
			    el_image	= $el_title.attr('href'),
			    $sub_menu	= $item.find('.ac_subitem'),
			    $ac_close	= $sub_menu.find('.ac_close');
    			
			    /* user clicks on a submenu item */
			    $el_title.bind('click.subMenu', function(e) {
					 $.when(toggleMenuItems('down', $submenuItems)).done(function(){});			    
				    openSubMenu($item, $sub_menu, el_image);
					showItemImage(el_image);
				    return false;
			    });
			    /* closes the submenu */
			    $ac_close.bind('click.subMenu', function(e) {
				    $.when(closeSubMenu($sub_menu)).done(function(){
				        toggleMenuItems('up', $submenuItems);
				        showItemImage($currLoadedImage);
				    });				    
				    return false;
			    });
		    });
	    },
	    openSubMenu	= function($item, $sub_menu, el_image) {
		    $sub_menu.stop()
		    .animate({
			    height		: '480px',
			    marginTop	: '-240px'
		    }, 400, function() {
						    //the bg image changes
			    showItemImage(el_image);
                google.maps.event.trigger(map, 'resize');
                $(".ps_nav").css("display","block");
		    });
	    },
		    /* changes the background image */
	    showItemImage		= function(source) {
			//if its the current one return
		    if($ac_bgimage.attr('src') === source)
			    return false;
			var is_webkit = (/chrome/.test( navigator.userAgent.toLowerCase() ) || /safari/.test( navigator.userAgent.toLowerCase() ));
    		if($loadsecondimg){
    		    $ac_bgimage = $ac_background.find(".ac_bgimage:eq(1)");
    		    if(is_webkit){
    		       if(source == '#') {source = 'images/backgrounds/1.jpg'};
		           $ac_background.find(".ac_bgimage:eq(1)").stop().fadeTo(800,1);
                   $ac_background.find(".ac_bgimage:eq(0)").stop().fadeTo(0,1);
                   $ac_bgimage.attr("src", source);
    		    }else{
    		        $ac_bgimage.load(function(){
		                $ac_background.find(".ac_bgimage:eq(1)").stop().fadeTo(800,1);
		                $ac_background.find(".ac_bgimage:eq(0)").stop().fadeTo(0,1);
		            }).attr("src", source);
		        }
    		    $loadsecondimg = false;
    		}else{
    		    $ac_bgimage = $ac_background.find(".ac_bgimage:eq(0)");
    		    if(is_webkit){
    		        if(source == '#') {source = 'images/backgrounds/1.jpg'};
    		        $ac_background.find(".ac_bgimage:eq(1)").stop().fadeTo(800,0);
                    $ac_background.find(".ac_bgimage:eq(0)").stop().fadeTo(0,1);
                    $ac_bgimage.attr("src", source);
    		    } else {
    		        $ac_bgimage.load(function(){
		                $ac_background.find(".ac_bgimage:eq(1)").stop().fadeTo(800,0);
		                $ac_background.find(".ac_bgimage:eq(0)").stop().fadeTo(0,1);
		            }).attr("src", source);
		        }
    		    $loadsecondimg = true;
    		}
	    },
	    closeSubMenu = function($sub_menu) {
		    $sub_menu.stop()
		    .animate({
			    height		: '0px',
			    marginTop	: '0px'
		    }, 400, function() {
			    //show items
				toggleMenuItems('up', $menuItems);				
		    });
	    },
		    /*
		    on window resize, ajust the bg image dimentions,
		    and recalculate the menus width
		    */
	    initWindowEvent		= function() {
		    /* on window resize set the width for the menu */
		    
		    $(window).bind('resize.Menu' , function(e) {
			    adjustImageSize($ac_bgimage);
			    /* calculate new width for the menu */
			    var new_w	= $(window).width() - $title.outerWidth(true);
			    $menu.css('width', new_w + 'px');
		    });
		    
		    $(window).bind('resize.subMenu' , function(e) {
			    adjustImageSize($ac_bgimage);
			    /* calculate new width for the menu */
			    var newsub_w	= $(window).width() - $title.outerWidth(true);
			    $submenu.css("width", newsub_w);
		    });
	    },
		    /* makes an image "fullscreen" and centered */
	    adjustImageSize		= function($img) {
		    var w_w	= $(window).width(),
		    w_h	= $(window).height(),
		    r_w	= w_h / w_w,
		    i_w	= $img.width(),
		    i_h	= $img.height(),
		    r_i	= i_h / i_w,
		    new_w,new_h,
		    new_left,new_top;
    			
		    if(r_w > r_i){
			    new_h	= w_h;
			    new_w	= w_h / r_i;
		    }
		    else{
			    new_h	= w_w * r_i;
			    new_w	= w_w;
		    }
    			
		    $img.css({
			    width	: new_w + 'px',
			    height	: new_h + 'px',
			    left	: (w_w - new_w) / 2 + 'px',
			    top		: (w_h - new_h) / 2 + 'px'
		    });
	    },
		    /* preloads a set of images */
	    loadImages			= function() {
		    return $.Deferred(
		    function(dfd) {
			    var total_images 	= $ItemImages.length,
			    loaded			= 0;
			    for(var i = 0; i < total_images; ++i){
				    $('<img/>').load(function() {
					    ++loaded;
					    if(loaded === total_images)
						    dfd.resolve();
				    }).attr('src' , $ItemImages[i]);
			    }
		    }
	    ).promise();
	    };
    		
	    return {
		    init : init
	    };
    })();

    /*
    call the init method of Menu
     */
    Menu.init();
});

/*
the images preload plugin
*/
(function($) {
	$.fn.preload = function(options) {
		var opts 	= $.extend({}, $.fn.preload.defaults, options),
			o		= $.meta ? $.extend({}, opts, this.data()) : opts;
		return this.each(function() {
			var $e	= $(this),
				t	= $e.attr('rel'),
				i	= $e.attr('href'),
				l	= 0;
			$('<img/>').load(function(i){
				++l;
				if(l==2) o.onComplete();
			}).attr('src',i);	
			$('<img/>').load(function(i){
				++l;
				if(l==2) o.onComplete();
			}).attr('src',t);	
		});
	};
	$.fn.preload.defaults = {
		onComplete	: function(){return false;}
	};
})(jQuery);



$(function() {
	var $ps_container		= $('#ps_container'),
		$ps_image_wrapper 	= $ps_container.find('.ps_image_wrapper'),
		$ps_next			= $ps_container.find('.ps_next'),
		$ps_prev			= $ps_container.find('.ps_prev'),
		$ps_nav				= $ps_container.find('.ps_nav'),
		$tooltip			= $ps_container.find('.ps_preview'),
		$ps_preview_wrapper = $tooltip.find('.ps_preview_wrapper'),
		$links				= $ps_nav.children('li').not($tooltip),
		total_images		= $links.length,
		currentHovered		= -1,
		current				= 0,
		$loader				= $('#loader');
	
	/*check if you are using a browser*/	
	var ie 				= false;
	if ($.browser.msie) {
		ie = true;//you are not!Anyway let's give it a try
	}
	if(!ie)
		$tooltip.css({
			opacity	: 0
		}).show();
		
		
	/*first preload images (thumbs and large images)*/
	var loaded	= 0;
	$('.ps_image_wrapper img').attr('alt', $('.ps_nav li:first').find('a').attr('title'));
	var title = $('.ps_nav li:first').find('a').attr('title');
	$('.ps_title').html(title);
	$links.each(function(i){
		var $link 	= $(this);
		$link.find('a').preload({
			onComplete	: function(){
				++loaded;
				if(loaded == total_images){
					//all images preloaded,
					//show ps_container and initialize events
					$loader.hide();
					$ps_container.show();
					//when mouse enters the pages (the dots),
					//show the tooltip,
					//when mouse leaves hide the tooltip,
					//clicking on one will display the respective image	
					$links.bind('click',showImage);
					//navigate through the images
					$ps_next.bind('click',nextImage);
					$ps_prev.bind('click',prevImage);
					
					var Breedte = 0;
					$("#ps_container ul.ps_nav").children('li').each(function() {
					    Breedte += parseInt($(this).width());
					});
                    $("#ps_container ul.ps_nav").css("width",Breedte);
			    }
			}
		});
	});
	
	function showImage(e){
		var $link				= $(this),
			idx					= $link.index(),
			$image				= $link.find('a').attr('href'),
			$currentImage 		= $ps_image_wrapper.find('img'),
			currentImageWidth	= $currentImage.width();
		
		
		
		//if we click the current one return
		if(current == idx) return false;
		
		//add class selected to the current page / dot
		$links.eq(current).removeClass('selected');
		$link.addClass('selected');
		
		//the new image element
		var $newImage = $('<img/>').css('left',currentImageWidth + 'px')
								   .attr('src',$image).attr('alt',$link.find('a').attr('title'));
		
		//get title
		var title = $('<span/>').html($link.find('a').attr('title'));
		$('.ps_title').html(title);						  
		
		//if the wrapper has more than one image, remove oldest
		if($ps_image_wrapper.children().length > 1)
			$ps_image_wrapper.children(':last').remove();
		
		//prepend the new image
		$ps_image_wrapper.prepend($newImage);
		
		//the new image width. 
		//This will be the new width of the ps_image_wrapper
		var newImageWidth	= $newImage.width();
	
		//check animation direction
		if(current > idx){
			$newImage.css('left',-newImageWidth + 'px');
			currentImageWidth = -newImageWidth;
		}	
		current = idx;
		//animate the new width of the ps_image_wrapper 
		//(same like new image width)
		$ps_image_wrapper.stop().animate({
		    width	: newImageWidth + 'px'
		},350);
		//animate the new image in
		$newImage.stop().animate({
		    left	: '0px'
		},350);
		//animate the old image out
		$currentImage.stop().animate({
		    left	: -currentImageWidth + 'px'
		},350);
	
		e.preventDefault();
	}				
	
	function nextImage(){
		if(current < total_images){
			$links.eq(current+1).trigger('click');
		}
	}
	function prevImage(){
		if(current > 0){
			$links.eq(current-1).trigger('click');
		}
	}
});

$(function() {
	//some elements..
	var $ps_container		= $('#ps_container2'),
		$ps_image_wrapper 	= $ps_container.find('.ps_image_wrapper'),
		$ps_next			= $ps_container.find('.ps_next'),
		$ps_prev			= $ps_container.find('.ps_prev'),
		$ps_nav				= $ps_container.find('.ps_nav'),
		$tooltip			= $ps_container.find('.ps_preview'),
		$ps_preview_wrapper = $tooltip.find('.ps_preview_wrapper'),
		$links				= $ps_nav.children('li').not($tooltip),
		total_images		= $links.length,
		currentHovered		= -1,
		current				= 0,
		$loader				= $('#loader');
	
	/*check if you are using a browser*/	
	var ie 				= false;
	if ($.browser.msie) {
		ie = true;//you are not!Anyway let's give it a try
	}
	if(!ie)
		$tooltip.css({
			opacity	: 0
		}).show();
		
		
	/*first preload images (thumbs and large images)*/
	var loaded	= 0;
	$('.ps_image_wrapper img').attr('alt', $('.ps_nav li:first').find('a').attr('title'));
	var title = $('.ps_nav li:first').find('a').attr('title');
	$('.ps_title').html(title);
	$links.each(function(i){
		var $link 	= $(this);
		$link.find('a').preload({
			onComplete	: function(){
				++loaded;
				if(loaded == total_images){
					//all images preloaded,
					//show ps_container and initialize events
					$loader.hide();
					$ps_container.show();
					//when mouse enters the pages (the dots),
					//show the tooltip,
					//when mouse leaves hide the tooltip,
					//clicking on one will display the respective image	
					$links.bind('click',showImage);
					//navigate through the images
					$ps_next.bind('click',nextImage);
					$ps_prev.bind('click',prevImage);

                   var Breedte = 0;
					$("#ps_container2 ul.ps_nav").children('li').each(function() {
					    Breedte += parseInt($(this).width());
					});
                    $("#ps_container2 ul.ps_nav").css("width",Breedte);
                    
			    }
			}
		});
	});
	
	function showImage(e){
		var $link				= $(this),
			idx					= $link.index(),
			$image				= $link.find('a').attr('href'),
			$currentImage 		= $ps_image_wrapper.find('img'),
			currentImageWidth	= $currentImage.width();
		
		
		
		//if we click the current one return
		if(current == idx) return false;
		
		//add class selected to the current page / dot
		$links.eq(current).removeClass('selected');
		$link.addClass('selected');
		
		//the new image element
		var $newImage = $('<img/>').css('left',currentImageWidth + 'px')
								   .attr('src',$image).attr('alt',$link.find('a').attr('title'));
		
		//get title
		var title = $('<span/>').html($link.find('a').attr('title'));
		$('.ps_title').html(title);						  
		
		//if the wrapper has more than one image, remove oldest
		if($ps_image_wrapper.children().length > 1)
			$ps_image_wrapper.children(':last').remove();
		
		//prepend the new image
		$ps_image_wrapper.prepend($newImage);
		
		//the new image width. 
		//This will be the new width of the ps_image_wrapper
		var newImageWidth	= $newImage.width();
	
		//check animation direction
		if(current > idx){
			$newImage.css('left',-newImageWidth + 'px');
			currentImageWidth = -newImageWidth;
		}	
		current = idx;
		//animate the new width of the ps_image_wrapper 
		//(same like new image width)
		$ps_image_wrapper.stop().animate({
		    width	: newImageWidth + 'px'
		},350);
		//animate the new image in
		$newImage.stop().animate({
		    left	: '0px'
		},350);
		//animate the old image out
		$currentImage.stop().animate({
		    left	: -currentImageWidth + 'px'
		},350);
	
		e.preventDefault();
	}				
	
	function nextImage(){
		if(current < total_images){
			$links.eq(current+1).trigger('click');
		}
	}
	function prevImage(){
		if(current > 0){
			$links.eq(current-1).trigger('click');
		}
	}
});

$(function() {
	//some elements..
	var $ps_container		= $('#ps_container3'),
		$ps_image_wrapper 	= $ps_container.find('.ps_image_wrapper'),
		$ps_next			= $ps_container.find('.ps_next'),
		$ps_prev			= $ps_container.find('.ps_prev'),
		$ps_nav				= $ps_container.find('.ps_nav'),
		$tooltip			= $ps_container.find('.ps_preview'),
		$ps_preview_wrapper = $tooltip.find('.ps_preview_wrapper'),
		$links				= $ps_nav.children('li').not($tooltip),
		total_images		= $links.length,
		currentHovered		= -1,
		current				= 0,
		$loader				= $('#loader');
	
	/*check if you are using a browser*/	
	var ie 				= false;
	if ($.browser.msie) {
		ie = true;//you are not!Anyway let's give it a try
	}
	if(!ie)
		$tooltip.css({
			opacity	: 0
		}).show();
		
		
	/*first preload images (thumbs and large images)*/
	var loaded	= 0;
	$('.ps_image_wrapper img').attr('alt', $('.ps_nav li:first').find('a').attr('title'));
	var title = $('.ps_nav li:first').find('a').attr('title');
	$('.ps_title').html(title);
	$links.each(function(i){
		var $link 	= $(this);
		$link.find('a').preload({
			onComplete	: function(){
				++loaded;
				if(loaded == total_images){
					//all images preloaded,
					//show ps_container and initialize events
					$loader.hide();
					$ps_container.show();
					//when mouse enters the pages (the dots),
					//show the tooltip,
					//when mouse leaves hide the tooltip,
					//clicking on one will display the respective image	
					$links.bind('click',showImage);
					//navigate through the images
					$ps_next.bind('click',nextImage);
					$ps_prev.bind('click',prevImage);

                   var Breedte = 0;
					$("#ps_container3 ul.ps_nav").children('li').each(function() {
					    Breedte += parseInt($(this).width());
					});
                    $("#ps_container3 ul.ps_nav").css("width",Breedte);
                    
			    }
			}
		});
	});
	
	function showImage(e){
		var $link				= $(this),
			idx					= $link.index(),
			$image				= $link.find('a').attr('href'),
			$currentImage 		= $ps_image_wrapper.find('img'),
			currentImageWidth	= $currentImage.width();
		
		
		
		//if we click the current one return
		if(current == idx) return false;
		
		//add class selected to the current page / dot
		$links.eq(current).removeClass('selected');
		$link.addClass('selected');
		
		//the new image element
		var $newImage = $('<img/>').css('left',currentImageWidth + 'px')
								   .attr('src',$image).attr('alt',$link.find('a').attr('title'));
		
		//get title
		var title = $('<span/>').html($link.find('a').attr('title'));
		$('.ps_title').html(title);						  
		
		//if the wrapper has more than one image, remove oldest
		if($ps_image_wrapper.children().length > 1)
			$ps_image_wrapper.children(':last').remove();
		
		//prepend the new image
		$ps_image_wrapper.prepend($newImage);
		
		//the new image width. 
		//This will be the new width of the ps_image_wrapper
		var newImageWidth	= $newImage.width();
	
		//check animation direction
		if(current > idx){
			$newImage.css('left',-newImageWidth + 'px');
			currentImageWidth = -newImageWidth;
		}	
		current = idx;
		//animate the new width of the ps_image_wrapper 
		//(same like new image width)
		$ps_image_wrapper.stop().animate({
		    width	: newImageWidth + 'px'
		},350);
		//animate the new image in
		$newImage.stop().animate({
		    left	: '0px'
		},350);
		//animate the old image out
		$currentImage.stop().animate({
		    left	: -currentImageWidth + 'px'
		},350);
	
		e.preventDefault();
	}				
	
	function nextImage(){
		if(current < total_images){
			$links.eq(current+1).trigger('click');
		}
	}
	function prevImage(){
		if(current > 0){
			$links.eq(current-1).trigger('click');
		}
	}
});

$(document).ready(function() {
    $('.slideshow').cycle({ 
        fx: 'fade', 
        speed: 1200, 
        timeout: 0, 
        next: '.next', 
        prev: '.prev' 
    });
    $("a.booknow").fancybox({
     	'overlayColor': '#f4f4f4',
     	'overlayOpacity': 1,
     	'width': 500,
     	'height': 550
     });
     $(".ac_menu ul").css("display","none");
     $(".ac_submenu").css("display","none");
     
     $("#bookhotel").click(function() {
        $.fancybox([
            'http://www.charmingrooms.be/hotels_search/search_hotels.asp?hotelid=268&taal=nl&booktemplate=1'
        ], {
            'type' : 'iframe',
            'width': 500,
            'height': 550,
            'overlayOpacity': 1,
            'overlayColor': '#f4f4f4'
        });
    });
    $("#bookhotelbinnen").click(function() {
        $.fancybox([
            'http://www.charmingrooms.be/hotels_search/search_hotels.asp?hotelid=268&taal=nl&booktemplate=1'
        ], {
            'type' : 'iframe',
            'width': 500,
            'height': 550,
            'overlayOpacity': 1,
            'overlayColor': '#f4f4f4'
        });
    });
    $("#bookhotelbinnenmedia").click(function() {
        $.fancybox([
            'http://www.charmingrooms.be/hotels_search/search_hotels.asp?hotelid=268&taal=nl&booktemplate=1'
        ], {
            'type' : 'iframe',
            'width': 500,
            'height': 550,
            'overlayOpacity': 1,
            'overlayColor': '#f4f4f4'
        });
    });
    $("#bookhotelbinnenbrugge").click(function() {
        $.fancybox([
            'http://www.charmingrooms.be/hotels_search/search_hotels.asp?hotelid=268&taal=nl&booktemplate=1'
        ], {
            'type' : 'iframe',
            'width': 500,
            'height': 550,
            'overlayOpacity': 1,
            'overlayColor': '#f4f4f4'
        });
    });
    $("#bruggeuit").click(function() {
        window.open('http://www.brugge.be/internet/nl/in_en_uit_in_Brugge/index.htm');
    });
    $("a.fancybox").fancybox({
        'type' : 'iframe',
        'width': 640,
        'height': 420,
        'overlayShow': true,
        'overlayColor': '#000',
        'padding' : 0
    });
    
    $('#aankomst').datepicker({
        showOn: 'button',
        buttonImage: 'images/calendar.png',
        buttonImageOnly: true,
        dateFormat: 'dd-mm-yy',
        firstDay: 1,
        onSelect: function(dateStr) {
            var d = $.datepicker.parseDate('dd-mm-yy', dateStr);
            d.setDate(d.getDate() + 2);
            $('#vertrek').datepicker('setDate', d);
        }
    });
    
    $('#vertrek').datepicker({
        showOn: 'button',
        buttonImage: 'images/calendar.png',
        buttonImageOnly: true,
        dateFormat: 'dd-mm-yy',
        firstDay: 1
    });
    
    $('#wellnessdatum').datepicker({
        showOn: 'button',
        buttonImage: 'images/calendar.png',
        buttonImageOnly: true,
        dateFormat: 'dd-mm-yy',
        firstDay: 1,
        minDate: 0
    });
    
    $("a.videoclick").fancybox({
 		'autoscale': true,
 		'zoomSpeedIn': 0, 
 		'zoomSpeedOut':	0, 
 		'overlayColor': '#000',
 		'overlayOpacity': 0.8,
 		'padding': 0
     });
});

function submitmyform(form) {
    jQuery.fancybox({ href: form.action + '?booktemplate=1&logisid=268&startdatum=' + jQuery("#aankomst", form).val() + '&einddatum=' + jQuery("#vertrek", form).val(), type: 'iframe', width: 500, height: 550, overlayOpacity: 1, overlayColor: '#f4f4f4' });
    return false;
}
