// when the page has finished loading add event listeners and do initialization
$(document).ready(function() {
    $('.examples a').click(openLightbox);
    defaultSearchText();
    buttonHover();

    // global country selector:
    $('#branding .navigation > li:last-child > a').toggle(
    function() {
        $('#country_selector').css({ display: "block" });
        $(this).parent().addClass('active');
    },
    function() {
        $('#country_selector').css({ display: "none" });
        $(this).parent().removeClass('active');
    }
  );

    // office locations list (About us page)
    $('.about_us .show_all').css({ display: "block" }).click(function(event) {
        event.preventDefault();
        $('.offices .other_offices').css({ display: "block" });
        $('.offices').css({ display: "block" });
        $('#main_content .generated').remove();
        $('.about_us .show_all').css({ display: "none" });
    });
    $('.offices .other_offices').css({ display: "none" });

    // dots on map (About us page)
    $('.about_us .banner a').bind('mouseenter', (function(event) {
        $(this).parent().append('<a href="' + this.href + '" class="country_tooltip" style="top: ' + $(this).css('top') + '; left: ' + $(this).css('left') + ';"><span>' + $(this).children().attr('alt') + '</span></a>');
        $('.country_tooltip').click(function(event) {
            var countryName = this.href.slice(this.href.indexOf('#'));
            $('#main_content .generated').remove();
            $('.offices').css({ display: "none" });
            //$(countryName).clone().addClass('offices generated').css({ display: "block", float: "left", backgroundColor: "#C7D5E2" }).insertAfter('#main_content .offices');
                        $(countryName).clone().addClass('offices generated').css({ display: "block", float: "left", backgroundColor: "#C7D5E2" })
                    .animate({ backgroundColor: "white" }, 1000).insertAfter('#main_content .offices');
            event.preventDefault();
            $('.about_us .show_all').css({ display: "block" });
        }).bind('mouseleave', (function(event) {
            $('.country_tooltip').remove();
        }));
    }));

    // text links below map (About us page)
    $('.about_us #main_content .wide a').click(function(event) {
        event.preventDefault();
        var countryName = this.href.slice(this.href.indexOf('#'));
        $('#main_content .generated').remove();
        if (countryName == '#other_offices') {
            $('.offices').css({ display: "block" });
            $('.other_offices').css({ display: "block" });
            $.scrollTo("#branding");
            //$('.offices').css({ display: "block" });
        }
        else {
            $('.offices').css({ display: "none" });
            //$(countryName).clone().addClass('offices generated').css({ display: "block", float: "left", backgroundColor: "#C7D5E2" }).insertAfter('#main_content .offices');
                        $(countryName).clone().addClass('offices generated').css({ display: "block", float: "left", backgroundColor: "#C7D5E2" })
                   .animate({ backgroundColor: "white" }, 1000).insertAfter('#main_content .offices');
                        $('.about_us .show_all').css({ display: "block" });
                        $.scrollTo("#branding");
        }
    });

    // handle links in directly to countries in list (About us page)
    var countryName = document.location.hash;
    if (countryName) {
        if (countryName == '#other_offices') {
            $('.offices .other_offices').css({ display: "block" });
            $('.offices').css({ display: "block" });
            $('#main_content .generated').remove();
            $('.about_us .show_all').css({ display: "none" });
        }
        else {
            $('#main_content .generated').remove();
            $('.offices').css({
                display: "none"
            });
            $(countryName).clone().addClass('offices generated').css({
                display: "block",
                float: "left",
                backgroundColor: "#C7D5E2"
            //}).insertAfter('#main_content .offices');
               }).animate({
                  backgroundColor: "white"
               }, 1000).insertAfter('#main_content .offices');
            $('.about_us .show_all').css({
                display: "block"
            });
        }
    }

    // form validation
    if ($('form.validate').length) {
        $('form.validate').validate({
            errorContainer: $('.warning'),
            errorPlacement: function(error, element) {
                error.appendTo(element.parent(".row"));
            }
        });
    }
});

function openLightbox(event){
  event.preventDefault();
  var closeText= '';
  if (this.href.indexOf('?') != -1) {
    if (this.href.indexOf('&') != -1) {
      closeText = this.href.slice(this.href.indexOf('close=') + 6, this.href.indexOf('&'));
    }
    else {
      closeText = this.href.slice(this.href.indexOf('close=') + 6);
    }
  }
  $.get(this.href, function(data){
    var dataAsHTML = document.createElement('div');
    dataAsHTML.innerHTML = data;
    var theContent = $(dataAsHTML).find('#main_content');

    showLightbox(theContent[0], closeText);
  });
}

function showLightbox(content, closeText){
  // center box horizontally on page
  var arrayPageSize = getPageSize();
  var arrayPageScroll = getScrollXY();
  var boxTop = arrayPageScroll[1] + 100;
  var boxLeft = ((arrayPageSize[0] - 820)/2);

  var divLB = document.createElement('div');
  divLB.id = 'lightbox';
  divLB.style.left = boxLeft + 'px';
  divLB.style.top = boxTop + 'px';
  var bottom = document.createElement('div');
  bottom.className = 'bottom action';
  var button_cont = document.createElement('div');
  button_cont.className = 'button';
  var span1 = document.createElement('span');
  var span2 = document.createElement('span');
  var button = document.createElement('a');
  button.href = '#';
  $(button).click(closeLightbox);
  if (closeText == '') {
    button.innerHTML = 'Close';
  } else {
    button.innerHTML = closeText;
  }
  span2.appendChild(button);
  span1.appendChild(span2);
  button_cont.appendChild(span1);
  bottom.appendChild(button_cont);

  divLB.appendChild(content);
  divLB.appendChild(bottom);
  $('body').append(divLB);

  // create overlay div
  var divOverlay = document.createElement('div');
  divOverlay.className = 'overlay';
  $(divOverlay).click(closeLightbox);
  // set height of Overlay to take up whole page and show
  divOverlay.style.height = (arrayPageSize[1] + 'px');
  $('body').append(divOverlay);
  return false;
}

function closeLightbox(e){
  $('#lightbox').remove();
  $('.overlay').remove();
  e.preventDefault;
  return false;
}

function getPageSize(){
  var xScroll, yScroll;
  if (window.innerHeight && window.scrollMaxY) {
    xScroll = document.body.scrollWidth;
    yScroll = window.innerHeight + window.scrollMaxY;
  } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
    xScroll = document.body.scrollWidth;
    yScroll = document.body.scrollHeight;
  } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
    xScroll = document.body.offsetWidth;
    yScroll = document.body.offsetHeight;
  }
  var windowWidth, windowHeight;
  if (self.innerHeight) { // all except Explorer
    windowWidth = self.innerWidth;
    windowHeight = self.innerHeight;
  } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
    windowWidth = document.documentElement.clientWidth;
    windowHeight = document.documentElement.clientHeight;
  } else if (document.body) { // other Explorers
    windowWidth = document.body.clientWidth;
    windowHeight = document.body.clientHeight;
  }
  // for small pages with total height less then height of the viewport
  if(yScroll < windowHeight){
    pageHeight = windowHeight;
  } else {
    pageHeight = yScroll;
  }
  // for small pages with total width less then width of the viewport
  if(xScroll < windowWidth){
    pageWidth = windowWidth;
  } else {
    pageWidth = xScroll;
  }
  arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
  return arrayPageSize;
}

function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return [ scrOfX, scrOfY ];
}

function defaultSearchText() {
    if ($('#branding label')[0] == null) return;
  var defaultText = $.trim($('#branding label')[0].innerHTML);
  $('#branding #search_field').each(function(input) {
    this.value = defaultText;
    if (this.value == '') return;
    $(this).focus(function(e) { if (this.value == defaultText) this.value = ''; });
    $(this).blur(function(e){ if (this.value == '') this.value = defaultText; });
  });
  $('.bar input:text').each(function(input) {
    this.value = defaultText;
    if (this.value == '') return;
    $(this).focus(function(e) { if (this.value == defaultText) this.value = ''; });
    $(this).blur(function(e) { if (this.value == '') this.value = defaultText; });
  });
}

function buttonHover() {
  $('.button').bind('mouseenter', (function(event){
    $(this).addClass('hover');
  })).bind('mouseleave', (function(event){
    $(this).removeClass('hover');
  }))
}

// Function for toggeling tip a friend dropdown
function toggleTipAFriend() {
    var x = document.getElementById('tipafriendHeader');
    var y = document.getElementById('tipafriendContent');

    if (y.style.display != 'block') {
        y.style.display = 'block';
    }
    else {
        y.style.display = 'none';
    }
}
function setTipAFriendOn() {
    var x = document.getElementById('tipfriendHeader');
    var y = document.getElementById('tipfriendContent');

    y.style.display = 'block';
}