/*------------------------------------------------------------

 Building Blocks - Javascript Functions

 Author: Paul Welsh
 Email: p.welsh@building-blocks.com

 Notes:

 - Uses Modernizr to detect feature support
   http://www.modernizr.com

------------------------------------------------------------*/


/* Global & Language Variables
------------------------------------------------------------*/

var mapIconImage = '/images/map-icon.png';
var mapIconShadow = '/images/map-shadow.png';

// Use these IE variables as little as possible!
var ltIE7 = $.browser.msie && parseFloat($.browser.version) < 7;
var ltIE8 = $.browser.msie && parseFloat($.browser.version) < 8;
var ltIE9 = $.browser.msie && parseFloat($.browser.version) < 9;


/* Functions
------------------------------------------------------------*/

var nextSlide, currSlide, prevSlide;
function _hero(){

  if($('.hero section').length > 0){
  
    $('.hero section').cycle({
      pager: '.hero-nav ul',
      pagerAnchorBuilder: function(idx, slide){
            return $('.hero-nav li:eq(' + idx + ') a');
        },
        before: function(curr,next,opts){
        prevClickedSlide = opts.nextSlide;
        var moveTo = 0;
        if(opts.nextSlide){
          moveTo = opts.nextSlide;
        }
        var width = $('.hero-nav li:eq(' + moveTo + ')').outerWidth();
        var left = $('.hero-nav li:eq(' + moveTo + ')').position().left;
        $('.back-highlight').animate({
          'width': width,
          'left': left
        });
        },
        after: function(curr,next,opts){
          nextSlide = opts.currSlide + 1;
        },
        timeout: 10000,
        pause: true
    });
    
    // setup the highlight arrow
    $('.hero-nav').prepend('<div class="back-highlight">&nbsp;</div>');
    $(window).load(function(){
      var width = $('.hero-nav li:eq(0)').outerWidth();
      var left = $('.hero-nav li:eq(0)').position().left;
      $('.back-highlight').css({
        'width': width,
        'left': left
      });  
    });
    
  }
  
}

// Google Map and Port Markers
function _googleMap(){

  if(window.google && $('.google-canvas').length > 0){
    $('.google-canvas').each(function(i,item){
    
      var canvas = $(item);
      // Give map an ID
      canvas.attr('id', 'map'+i);
  
      /* Map */
      var lat = 0, 
      lng = 0, 
      zoom = 15, 
      useDefaultCenter = true, 
      useDefaultZoom = true;
      
      if(canvas.attr('data-lnglat') != undefined && canvas.attr('data-lnglat') != ""){
        lng = canvas.attr('data-lnglat').split(",")[1];
        lat = canvas.attr('data-lnglat').split(",")[0];
        useDefaultCenter = false;
      }
      
      if(canvas.attr('data-zoom') != undefined && canvas.attr('data-zoom') != ""){
        zoom = canvas.attr('data-zoom');
        useDefaultZoom = false;
      }
      
      var latlng = new google.maps.LatLng(lat,lng);
      var mapOptions = {
          zoom: parseInt(zoom),
          center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            scrollwheel: false
      };
      var googleMap = new google.maps.Map(document.getElementById( canvas.attr('id') ), mapOptions);
      
      /* Markers */
      var image = new google.maps.MarkerImage(
        mapIconImage,
        new google.maps.Size(100,67),
        new google.maps.Point(0,0),
        new google.maps.Point(50,67)
      );
      
      var shadow = new google.maps.MarkerImage(
        mapIconShadow,
        new google.maps.Size(138,67),
        new google.maps.Point(0,0),
        new google.maps.Point(50,67)
      );
      
      var shape = {
        coord: [90,0,93,1,94,2,95,3,96,4,96,5,97,6,97,7,97,8,97,9,97,10,97,11,97,12,97,13,97,14,97,15,98,16,98,17,98,18,98,19,98,20,98,21,98,22,98,23,98,24,98,25,98,26,98,27,98,28,98,29,98,30,98,31,98,32,98,33,98,34,98,35,98,36,98,37,98,38,97,39,97,40,97,41,97,42,97,43,97,44,97,45,97,46,97,47,97,48,96,49,96,50,96,51,95,52,94,53,92,54,89,55,68,56,66,57,65,58,64,59,64,60,63,61,62,62,61,63,60,64,59,65,57,66,48,66,46,65,45,64,45,63,44,62,44,61,44,60,44,59,44,58,44,57,43,56,43,55,41,54,39,53,38,52,37,51,37,50,37,49,36,48,36,47,36,46,36,45,36,44,36,43,36,42,36,41,36,40,36,39,36,38,36,37,36,36,36,35,36,34,36,33,36,32,36,31,36,30,36,29,36,28,36,27,36,26,36,25,36,24,36,23,36,22,36,21,36,20,36,19,36,18,36,17,36,16,36,15,36,14,36,13,36,12,36,11,36,10,36,9,36,8,36,7,36,6,37,5,37,4,38,3,39,2,40,1,43,0,90,0],
        type: 'poly'
      };
      
      var marker = new google.maps.Marker({
        position: latlng,
            map: googleMap,
            icon: image,
            shadow: shadow,
            shape: shape
      });
      
      //Directions
      var directionsDisplay = new google.maps.DirectionsRenderer();
        var directionsService = new google.maps.DirectionsService();
        directionsDisplay.setMap(googleMap);
      
      $('#get-directions').click(function(e){  
        e.preventDefault();
        var fromAddress = $('#map-postcode').val();
        var request = {
              origin: fromAddress, 
              destination: latlng,
              travelMode: google.maps.DirectionsTravelMode.DRIVING
          };
          directionsService.route(request, function(response, status) {
             if (status == google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(response);
              }
          }); 
      });
      
      $('#map-postcode').keypress(function(e){
        if(e.keyCode == 13){
          $('#get-directions').click();
        }
      });
    
    });
  }
  
}

function _reponsiveShifts(){

  var gt980 = true;
  var width = $('div[role="main"]').width();
  if((width < 980) && (gt980 == true)){
  
    // move focus area aside into the sidebar
    $('.focus-area aside').prependTo('div[role="complementary"]').addClass('moved');
    // screen is now smaller than 1024px
    gt980 = false;
    
  }else if(width >= 980){
  
    // move the focus area aside back into position
    $('div[role="complementary"] aside.moved').appendTo('.focus-area').removeClass('moved');
    // screen is now bigger than 1024px
    gt980 = true;
    
  }

}

// Modernizr Tests & conditional script loading
function _modernizrTests(){
  
  // css3 multiple colums
  Modernizr.load({
    test: Modernizr.csscolumns,
    nope: '/scripts/libs/jquery.listcolumns.js',
    complete : function () {
      if(!Modernizr.csscolumns){
        $('.promos aside .col-2').listcolumns({
          columns: 2
        });
      }
    }
  });

}


/* Init Functions
------------------------------------------------------------*/

$(function(){

  _hero();
  _googleMap();
  _reponsiveShifts();
  _modernizrTests();
  
  $(window).resize(function(){
    _reponsiveShifts();
  });

});