var PreviousIndex  = 0;
var SlideShowTimer = null;
var NumberOfSlides = 0;
var bMoving        = false;

$(document).ready(function(){
  $('#menu').superfish({
    delay: 100
  });
  
  setTimeout(function(){$('#header .right .navigation ul li').css('overflow','visible')}, 200);
  
  if($('.slogan-text').length > 0 && !$('.slogan-text').hasClass('no-slide')){ 
    InitSlogan();
    InitSlideshow();
  }
  
  if($('.slogan-text.no-slide').length > 0) {
    initNoSlideSlogan();
  }
  
  $('.blocks .item').click(function(){
    if(bMoving){
      return false;
    }
    bMoving = true;
    MoveSlogan($(this), 245);
  });
  
  if(NumberOfSlides > 1){
    setTimeout(function () { StartSlideShow(); }, 7000); 
  }
  
  if($('#maps:not(.v2)').length > 0){
    GoMaps();
  }
  if($('#maps.v2').length > 0){
    GoMaps_v2();
  }
  
});

function initNoSlideSlogan () {
  var SloganDiv = $('.slogan-text.no-slide');
  var SloganText = SloganDiv.html();
  SloganDiv.html('');
  SloganDiv.append('<h1>' + SloganText + '</h1>');
  var top = ( $('.slogans').height() - SloganDiv.height() ) / 2; 
  SloganDiv.css('margin-top', top);
}

function InitSlogan(){
  var SloganContainer = $('.slogan-text-container');
  var ContainerWidth = 0;
  var Counter = 0;
  
  $('.slogan-text').each(function(){
    var top = ( $('.slogans').height() - $(this).height() ) / 2; 
    $(this).css('margin-top', top);       
    ContainerWidth = ContainerWidth + parseInt($(this).innerWidth());
    NumberOfSlides = NumberOfSlides + 1;
    $('.slideshow .picture').append('<img src="' + aPic[Counter] + '" alt="Slogan" />');
    $('.blocks').append('<div class="item"></div>');
    Counter++;
  });
  $('.blocks .item:first').addClass('active');
  $('.slogan-text:first').css({'visibility':'visible'});    
  SloganContainer.css('width', ContainerWidth);
}

function InitSlideshow(){
  $('.slideshow .picture img').each(function(){
    $(this).css('display', 'none');
  });
  $('.slideshow .picture img:first').css({'display':'block'});
}

function MoveSlogan(ClickedItem, AmountToMove){
  if(ClickedItem.hasClass('active')){
    return false;
  }
  var ClickedIndex = ClickedItem.index();
  $('.slideshow .picture img').eq(PreviousIndex).fadeOut('slow');
  $('.slideshow .picture img').eq(ClickedIndex).fadeIn('slow');
  $('.blocks .item').eq(PreviousIndex).removeClass('active');
  $('.blocks .item').eq(ClickedIndex).addClass('active');

  var SloganContainer = $('.slogan-text-container');
  var CurrentOffsetLeft = parseInt(SloganContainer.css('left'));
  var FactorToMove = ClickedIndex - PreviousIndex;
  var NewOffset = CurrentOffsetLeft - (AmountToMove * FactorToMove); 
  
  if (NewOffset * - 1 < parseInt(SloganContainer.innerWidth())){
    SloganContainer.animate({'left': NewOffset + 'px'}, function (){ bMoving = false; });
  }
  PreviousIndex = ClickedIndex;
}

function StartSlideShow() {
  if(PreviousIndex + 1 != NumberOfSlides){
    MoveSlogan($('.blocks .item').eq(PreviousIndex + 1), 245);
  } else {
    MoveSlogan($('.blocks .item').eq(0), 245);
  }
  SlideShowTimer = setTimeout(function(){StartSlideShow()}, 7000); 
}

function StripMargin (NumberOfItems, Element)
{
  var Counter = 1;
  Element.each(function(){
    if (Counter % NumberOfItems == 0){
      $(this).css('margin-right','0px');
    }
    Counter++;
  });
}

var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function GoMaps () {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var myOptions = {
    zoom: 12,
    disableDefaultUI: true,
    navigationControl: true,
    center: new google.maps.LatLng(50.813298,5.798686),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById("maps"),
                                myOptions);

  var image = new google.maps.MarkerImage('/pics/logo_maps.png', 
                                          new google.maps.Size(108,48), 
                                          new google.maps.Point(0,0),
                                          new google.maps.Point(40,45));
  var myLatLng = new google.maps.LatLng(50.813298,5.798686);
  var beachMarker = new google.maps.Marker({
      position: myLatLng,
      map: map,
      icon: image
  });
  directionsDisplay.setMap(map);
  directionsDisplay.setPanel(document.getElementById("directions"));
}

function calcRoute(StartLocation) {
  var start = StartLocation; 
  var end = "Honthem 12, Margraten, Nederland";
  var request = {
      origin:start, 
      destination:end,
      travelMode: google.maps.DirectionsTravelMode.DRIVING,
      unitSystem: google.maps.DirectionsUnitSystem.METRIC
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });
  return false;
}

function GoMaps_v2 () {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var myOptions = {
    zoom: 4,
    disableDefaultUI: true,
    navigationControl: true,
    center: new google.maps.LatLng(50.813298,5.798686),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById("maps"),
                                myOptions);

  var image = new google.maps.MarkerImage('/pics/logo_maps.png', 
                                          new google.maps.Size(108,48), 
                                          new google.maps.Point(0,0),
                                          new google.maps.Point(40,45));
  
  var geocoder = new google.maps.Geocoder();
  $("select#toAddress option").each(function() {
    geocoder.geocode({ 'address': $(this).attr("value") }, function (results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        myLatLng = results[0].geometry.location; 
        var beachMarker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            icon: image
        });  
      }
    });    
  });
  
  directionsDisplay.setMap(map);
  directionsDisplay.setPanel(document.getElementById("directions"));
}

function calcRoute_2(StartLocation, EndLocation) {
  var start = StartLocation; 
  var end = EndLocation;
  var request = {
      origin:start, 
      destination:end,
      travelMode: google.maps.DirectionsTravelMode.DRIVING,
      unitSystem: google.maps.DirectionsUnitSystem.METRIC
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });
  return false;
}

function clear_textbox(elementName, defaultValue)
{
    if (elementName.value == defaultValue){
        elementName.value = "";
    }
}
function check_textbox(elementName, defaultValue)
{
    if (elementName.value == ""){
        elementName.value = defaultValue;
    }
}

function FetchYouTubeFile(YouTubeUrl, DivForYouTube){
  if(YouTubeUrl != ''){
    var VideoID;
    var UrlCheckResult;

    UrlCheckResult = YouTubeUrl.match("[\\?&]v=([^&#]*)");

    VideoID = ( UrlCheckResult === null ) ? YouTubeUrl : UrlCheckResult[1];
    var CorrectUrl = "http://www.youtube.com/v/"+VideoID+""; 
    
    DivForYouTube.append('<object width="362" height="280"> \
                                  <param name="movie" value="' + CorrectUrl + '"></param> \
                                  <param name="wmode" value="transparent"></param> \
                                  <embed src="' + CorrectUrl + '" type="application/x-shockwave-flash" wmode="transparent" width="362" height="280"></embed> \
                                </object> \
                                ');
  }
}