//Front end Java Script File

jQuery(document).ready(function() 
{
		// Script for site search in winkels page
		var browse_url = window.location.href;
		var url_param = browse_url.split('/');
		if(url_param.length > 4)
		{
			if(url_param[3] === 'winkels')
			{
				if(url_param[4].length > 0)
				{
					var cat_name = url_param[4];
					cat_name = cat_name.split('_');
					update_markers('name',cat_name[0]);
				}
			}
		}
		
		// script for adding wmode transparent to the src of iframe for youtube//
		var iframeUrl = jQuery('#content').find('iframe');
		iframeUrl.each(function(){
		      var ifr_source = $(this).attr('src');
		      var wmode = "?&wmode=transparent";
		      $(this).attr('src',ifr_source+wmode);
		});
		
		//variable to count the click next-prev in flickr animate functionality
		var num=0;
		
		loadRightBannerImages();
		
		jQuery("img[src='&matrix']").hide();
		jQuery('#slideshow').cycle({
			fx: 'fade',
			speed: 2000,
			timeout: 1000
			
		}).cycle("resume").hover(function() {
		$(this).cycle('pause');
		       
		},function(){
		$(this).cycle('resume');
		     
		});
		
		
		//next prev flickr functionality	
		jQuery('.flickr_arrows span:nth-child(1)').click(function()
		{
			slideshowPrev();
			jQuery('.flickr_arrows span:nth-child(2)').removeClass('selected_arrow'); 
			jQuery(this).addClass('selected_arrow');
			
		});
		
		jQuery('.flickr_arrows span:nth-child(2)').click(function()
		{
			slideshowNext();
			jQuery('.flickr_arrows span:nth-child(1)').removeClass('selected_arrow');
			jQuery(this).addClass('selected_arrow');
		});
		
		
		//functions to animate flickr images
		function slideshow(slide_num) {	
        	 jQuery('#flicker-images').animate({'left' : num*(-180)});   
	    }

        function slideshowNext() {
            num++;
            //checking the number of images in the container based on which assigning the width of the container(#flicker-images) so that flickr images comes in the combi of 4
            var flickImgCount=jQuery('#flicker-images a').length;
            if(flickImgCount%4==0){
           		 flickrContWidth=flickImgCount*45;
            }else{
            	flickrContWidth=flickImgCount*45+90;
            }
            jQuery('#flicker-images').css('width',flickrContWidth);
            
            //checking the count based on which making the next button disable if there are no images left to show
            imgArray=jQuery('#flicker-images a').length/4;

			//animating the image container
            if(num<imgArray){
                slideshow(num);
            }else{
                num--;
            }
            
        }

        function slideshowPrev() {
            num--;
            //animating the image container
            if(num>-1){
                slideshow(num);
            }else{
                num++;
            }

        }
			
	// carousel intialization
	jQuery('#carousel').cycle({
		fx: 'fade',
		speed: 2000,
		timeout: 1000
		
	}).cycle("resume").hover(function() {
	$(this).cycle('pause');
	       
	},function(){
	$(this).cycle('resume');
	     
	});
		
// Enable Pretty Photo effect for Images 
	
	jQuery("a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'normal',theme:'light_rounded',slideshow:3000, autoplay_slideshow: false, slideshow:10000, hideflash: false});
	//jQuery("gt(0) a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'fast',slideshow:10000, hideflash: true});
	//jQuery("a[rel^='prettyPhoto']").prettyPhoto({ hideflash: true });
	//jQuery("a[rel^='prettyPhoto']").trigger('click');

	jQuery("#custom_content a[rel^='prettyPhoto']:first").prettyPhoto({
		custom_markup: '<div id="map_canvas" style="width:260px; height:265px"></div>',
		changepicturecallback: function(){ initialize(); }
	});

	jQuery("#custom_content a[rel^='prettyPhoto']:last").prettyPhoto({
		custom_markup: '<div id="bsap_1259344" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div><div id="bsap_1237859" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6" style="height:260px"></div><div id="bsap_1251710" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div>',
		changepicturecallback: function(){ _bsap.exec(); }
	});
		
	// start contact form validation script //
		jQuery("#contactSubmitValue").click(function(){
			 var contactName=jQuery("#contactName").val(); 
		     var contactSurname=jQuery("#contactSurname").val();
		     var contactCompany=jQuery("#contactCompany").val();	
			 var contactPhone=jQuery("#contactPhone").val(); 
			 var contactEmail=jQuery("#contactEmail").val();
			 var contactComments=jQuery("#contactComments").val(); 
		     var error_color = "1px solid #ff0000";
			 var regEmail=/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
			 var regPhone =/^((\(?\+?[0-9]*\)?)?[0-9_\- \(\)]*$)/i;
		     var errors="";
		     
		     if(contactName=="" || contactName==null)
				{
		         	jQuery("#contactName").css("border",error_color);
		         	errors+="<li>"+"Enter the first name"+"</li>"; 
				}
			
			else if(contactName!=="")
				{
					jQuery("#contactName").css("border","1px solid #D6D6D6");
				}
			 
			 if(contactSurname=="" || contactSurname==null)
			    {
			    	jQuery("#contactSurname").css("border",error_color);
					errors+="";
		        	errors+="<li>"+"Enter the surname"+"</li>"; 
				}
				
			 else if(contactSurname!=="")
			 	{
			 		jQuery("#contactSurname").css("border","1px solid #D6D6D6");
			 	}
			
			if(contactCompany=="" || contactCompany==null)
				{
			 		jQuery("#contactCompany").css("border",error_color);
					errors+="";
		        	errors+="<li>"+"Enter the company name"+"</li>"; 
				}
				
			else if(contactCompany!=="")
				{
					jQuery("#contactCompany").css("border","1px solid #D6D6D6");
				}
			
			if(contactPhone=="" || contactPhone==null)
				{
			 		jQuery("#contactPhone").css("border",error_color);	
			    	errors+="";
		        	errors+="<li>"+"Enter the phone no."+"</li>"; 
				}
		    
		    else if(!regPhone.test(contactPhone))
				{
			 		jQuery("#contactPhone").css({border:error_color,color:"black"}).val("Please Enter the numbers only");
					errors+="";
		        	errors+="<li>"+"Enter the valid phone no."+"</li>"; 
				}
				
			else if(contactPhone!=="" || regPhone.test(contactPhone))
				{
					jQuery("#contactPhone").css("border","1px solid #D6D6D6");
				}
			
		    if(contactEmail=="" || contactEmail==null)
				{
			 		jQuery("#contactEmail").css("border",error_color);
					errors+="";
		            errors+="<li>"+"Enter the  email address"+"</li>"; 
				}
			
			else if(!regEmail.test(contactEmail))
				{
			 		jQuery("#contactEmail").val("Please Enter the valid e-mail address").css({border:error_color,color:"black"});
			        errors+="";
		            errors+="<li>"+"Enter the valid email"+"</li>"; 
				}
				
			else if(contactEmail!=="" || regEmail.test(contactEmail))
				{
					jQuery("#contactEmail").css("border","1px solid #D6D6D6");
				}
		    
		    if(contactComments=="" || contactComments==null)
				{
			 		jQuery("#contactComments").css("border",error_color);
					errors+="";
		            errors+="<li>"+"Enter the comments"+"</li>"; 
				}
				
			else if(contactComments!=="")
				{
					jQuery("#contactComments").css("border","1px solid #D6D6D6");
				}
		   	
		    if(errors!=="")
				{ 
		        	jQuery('body').scrollTo( {top:'180px', left:'0px'}, 800 ); 
		        	jQuery("#msg ul").html(errors);
					return false;
		        }
		    else if(errors=="")
				{
			  		return true;
		        }
			});
			
			// end contact form validation script //
				
	/*
	
	{'title':'Winkel 4',
	'store_img':'',
	'info':'',
	'address':'',
	'phone':'',
	'website':'',
	'timings':['','','','','','','',],
	'shop_number':'48_312'
	}
	
	
	
	 */			
				
	if($('#store-locator-container').length>0){			
	$('#store-locator-container').mapEE({'map_width' : 920,
								'map_height' : 566,
								'maps':[{"width":920, "height":566, "source":"/includes/storelocator/img/map1.png", "scale": "1"},
										{"width":1840, "height":1132, "source":"/includes/storelocator/img/map2.jpg", "scale": "2"},
										{"width":2760, "height":1698, "source":"/includes/storelocator/img/map3.jpg", "scale": "3"}]
							}
						);			
				
	}
	var ajax_in_progress = false;
	
	function ajax_delay() {
		ajax_in_progress = false;
	}
	
	function update_markers(type, param){
		
		if(type === 'cat'){
			var search_url = "/winkels/get_shops_by_category/";
		} else if (type === 'name') {
			var search_url = "/winkels/get_shops_by_name/";
		}
		
		$.ajax({
		  url: search_url+param,
		  success: function(data){
		    
		    //console.log(data);
		    var new_markers = $.parseJSON(data);
		    //console.log(new_markers.shops.length);
		    
		    // check if results has any markers
		    if(new_markers.shops.length > 0){
		    	$('#store-locator-container').mapEE('update_markers', new_markers.shops);
		    	var delay = setTimeout(ajax_delay, 500);
		    } else {
		    	var delay = setTimeout(ajax_delay, 500);
		    }
		    	    
		  }
		});
	}
	
	//update_markers(12);
	//$('.cat_button').unbind('click');
	// $('.cat_button').bind("click change"
		// , function(){
			// alert('hi');
			// update_markers('cat', $(this).attr('data-cid'));
// 		
	// });
	
	$("select").change(function () {
         
          $("select option.cat_button:selected").each(function () {
          	// alert('hi');
               update_markers('cat', $(this).attr('data-cid'));
              });
          
        })
        .click();

	
	var search_timeout;
	
	$('#search_input').bind({
		focus : function() {
			$(this).attr('value','');
		},
		blur : function() {
			$(this).attr('value','Type hier de naam van de winkel');
		},
		keyup : function(){
			
			//console.log(($(this).attr('value').length));
			
			//console.log('cleared old timeout');
			clearTimeout(search_timeout);
			
			//console.log('set new timeout');
			var $this = $(this);
			search_timeout = setTimeout(function(){
				if($this.attr('value').length > 2){
					//console.log('keyup triggered');
					//console.log($this);
					update_markers('name',$this.attr('value'));
				}
			},
			400				
			);			
			
		}
	});
	
	
	/*$("#content iframe").each(function(){
        var ifr_source = $(this).attr('src');
        var wmode = "wmode=transparent";
        if(ifr_source.indexOf('?') != -1) {
            var getQString = ifr_source.split('?');
            var oldString = getQString[1];
            var newString = getQString[0];
            $(this).attr('src',newString+'?'+wmode+'&'+oldString);
        }
        else $(this).attr('src',ifr_source+'?'+wmode);
    });	*/
	
	}); // close document ready
	
	
	//function to load banner Images On load
	function loadRightBannerImages(){
		  var json_array_object = eval(gallery); 
		  var str='';
		  var imgStr='';
		  jQuery.each(json_array_object, function(key, value) {
		  str+='<img width="240" height="400" alt="" src="http://cityplaza.nl/images/fe/'+value+'" />';
		  });
		  jQuery("#slideshow").append(str);
	}