/*           

           88       888 888888b.   
           888   o   888 888  "88b  
           888  d8b  888 888  .88P  
           888 d888b 888 8888888K.  
           888d88888b888 888  "Y88b 
           88888P Y88888 888    888 
           8888P   Y8888 888   d88P 
           888P     Y888 8888888P" 
           
         HTML5 - RESPONSIVE TEMPLATE

*/
/*  @author Julien Bourdon
 *  @description Wb is a simple responsive template in html5 
 *  @reset style based on Beseku Boiler plate https://github.com/beseku/html.boilerplate
 *  @version	1.0
 */
 
// Setting global variable for Google map style

var WbStyles = [
				   {
				    featureType: "all",
				    elementType: "all",
				    stylers: [
				      { saturation: -100 },
				      { visibility: "on" },
				      { gamma: 0.2 },
				      { lightness: 20 }
				    ]
				  },{
				    featureType: "road",
				    elementType: "geometry",
				    stylers: [
				      { lightness: 22 }
				    ],
				    elementType: "labels",
			    stylers: [
			      { visibility: "off" }
			    ]
				  },{
				    featureType: "water",
				    elementType: "all",
				    stylers: [
				      { hue: "#39B0F6" },
				      { saturation: 56 },
				      { lightness: 44 }
				    ]
				  },{
				    featureType: "landscape",
				    elementType: "geometry",
				    stylers: [
				      { lightness: 92 }
				    ]
				  },{
				    featureType: "landscape.man_made",
				    elementType: "all",
				    stylers: [
				      { lightness: -8 }
				    ]
				  },{
				    featureType: "poi",
				    elementType: "geometry",
				    stylers: [
				      { lightness: 53 }
				    ]
				  }
			  ];

		  var wbMapType = new google.maps.StyledMapType(WbStyles,
		    {name: "WB"});
		

		  var mapOptions = {
		  
		    zoom: 14,
		    center: new google.maps.LatLng(35.731255,139.757338),
		    panControl: false,
		    zoomControl: false,
		    scaleControl: true,
		    mapTypeControlOptions: {
			mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'wb']
		    }
		  };

wb = {

  /*
   * 
   * These listener functions are triggered when specific events occur, such as the page loading
   * or a specific DOM element being present.
   * 
   */
  
  listeners: {

    hasInitialized: function() {
      // Add first/last classes for neater CSS with IE ...
      $('.ie6 *:first-child').addClass('isFirstChild');
      $('.ie6 *:last-child').addClass('isLastChild');
      
      // Navigation
		 $('#topNav li a,#quickLinks li a,a.ctn').bind('click',function(event){
	        var anchor = $(this);
	 
	        $('html, body').stop().animate({
	            scrollTop: $(anchor.attr('href')).offset().top
	        }, 1500,'easeInOutExpo');
	        $('#topNav li').removeClass('current');
	        $(anchor).parent('li').addClass('current');
	        event.preventDefault();
	        _gaq.push(['_trackEvent', 'Feature', 'Deinit', "deinit"]);
    	});
    	// Checking when Xpanel elements is in the view port to update the navigation status
    	$('.blockPanel').bind('inview', function(event, isInView, visiblePartX, visiblePartY) {
			var F=$(this).attr('id');
				if ((isInView)&& $(!$('a[href*=#'+F+']').parent('li').hasClass('li'))){
				//$('#topNav li').removeClass('current');
				// element is now visible in the viewport

				
				
				//alert(F);
				if (visiblePartY == 'top') {
					
					$('#topNav li').prev().removeClass('current');
					$('a[href*=#'+F+']').parent('li').addClass('current');
					
				// top part of element is visible
				} else if (visiblePartY == 'bottom') {
					
					$('#topNav li').next().removeClass('current');
					$('a[href*=#'+F+']').parent('li').addClass('current');
					
				} else {
				
				}
		  } else {


		  }

		});
		//show Navigation map
		$('#closeMapBtn').live('click',function(event){
			$('#closeMapBtn').remove();
			$('#fullScreenMap').css('visibility','hidden');
			$('#screen').css('display','block');
			scrollTo('#naviMapBtn');
		 	 
		 
		 });
		//sendForm
		$('#sendFormBtn').click(function() {
		
			var fields = $(":input").serializeArray();
		    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
		    
		      jQuery.each(fields, function(i, field){
		      
		        if(field.name=='email'){
		        	
					if (!filter.test(field.value)) {
						$('#email').addClass('error');	
						return false;
					}else{
						var email=field.value;
						$('#email').removeClass('error');
					}
		      	}
				
				field.value=field.value.replace(/(<([^>]+)>)/ig,"");
		      
		      });
		      var message=$('textarea').val();
		      message=message.replace(/(<([^>]+)>)/ig,"");
				if(!message.length>5){
					alert(message);
					$('textarea').addClass('error');
				}
				
				if (message.length>0&&filter.test(email.value)){
					$.ajax({
						type: 'POST',
						url: '/portfolio/api/ajax_contact.php',
					 	data: "firstname="+ fields[0].value+"&"+"lastname="+ fields[1].value+"&"+"skype="+ fields[3].value+"&"+"email="+ email.value+"&"+"message="+message,
						dataType:'text',
						success: function(result){
							var nouveauResultat = result.split(":");
						   $('form').css("display","none");	
						   $('.cfSend').text('Thank you for your message, i will get back to you as soon as possible');
						},
						error: function() {alert('Something got wrong');}
              		}); 

				}
		
		});
		$('#naviMapBtn').click(function() {

			var map = new google.maps.Map(document.getElementById('fullScreenMap'),
		    mapOptions);
		
			//Associate the styled map with the MapTypeId and set it to display.
			map.mapTypes.set('wb', wbMapType);
			map.setMapTypeId('wb');
		  
			$('#fullScreenMap').css('visibility','visible');
			$('#screen').css('display','none');
			$('header').append("<a href='#' id='closeMapBtn'>Close map</a>");

			//retreiving all the data and coordinates of places from the database.
			$.ajax({
        		type: "GET",
				url: "/portfolio/geo/getXml.php",
				dataType: "xml",
				success: function(xml) {
				
					$(xml).find('geovisit').each(function(){
 						var lng = $(this).find('lon').text();
						var lat = $(this).find('lat').text();
						var title = $(this).find('title').text();
						var description = $(this).find('description').text();
						var web = $(this).find('web').text();
						var contentString = '<div class="myOverlay" class="G3 GS"><h5>'+title+'</h5><p>'+description+'</p><a href='+web+' target="blank">More infos</a></div>';
        
					    var infowindow = new google.maps.InfoWindow({
					        content: contentString
					    });
						
						var image = 'http://www.tokyoprivate.com/portfolio/assets/img/marker.png';
  						var myLatLng = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));
  						var marker = new google.maps.Marker({
      					position: myLatLng,
						title:"Hello World!",
      					map: map,
      					icon: image
  						});
  						
  						google.maps.event.addListener(marker, 'click', function() {
      						infowindow.open(map,marker);
    					});

						
					});
 
				}
			});
		 
		 });
		$(document).trigger("CORE:HAS_RESIZED");
    },
    
	hasResized: function() {
		var A = $(document).width();
		
		if (A < 595) {
			if ($("header > fieldset").length <1) {
					$("header").append('<fieldset><label for="mobile-menu"></label><select id="mobile-menu"></select></fieldset>');
					
					$("header > nav > ul > li > a ").each(function(C) {
							if ($(this).parent().hasClass("current")) {
								$("header > fieldset select").append('<option selected value="' + $(this).attr("href") + '">' + $(this).text() + "</option>");
							} else {
								$("header > fieldset select").append('<option value="' + $(this).attr("href") + '">' + $(this).text() + "</option>");
							}
						});

					
					$("#mobile-menu").change(function() {
						var anchor = $(this);
				        $('html, body').stop().animate({
				            scrollTop: $(anchor.attr('value')).offset().top
				        }, 1500,'easeInOutExpo');
					});
					
			}
			
		}else{
			$("header > fieldset").remove();
				
		}		
  	},	
		loadMap: function(){

  var map = new google.maps.Map(document.getElementById('map_canvas'),
    mapOptions);

  //Associate the styled map with the MapTypeId and set it to display.
  map.mapTypes.set('wb', wbMapType);
  map.setMapTypeId('wb');    
    }
  }    
};

$(document).bind("CORE:HAS_INITIALIZED", wb.listeners.hasInitialized)
.bind("CORE:HAS_RESIZED",wb.listeners.hasResized)
.bind("CORE:LOAD_MAP",wb.listeners.loadMap)
.bind("CORE:LOAD_MARKERS",wb.listeners.loadmarkers)
;