$(function() {
  // Projects
  var hash     = window.location.hash.replace(/^#/, '');
  var projects = $('#projects .project').map(function() {
    var name   = $(this).find('h2').remove().text();
    var images = $(this).find('.full-size').remove();
    var html   = $.trim($(this).html());

    return {
      name    : name,
      html    : html,
      images  : images,
      current : hash == name.toLowerCase().replace(/[^a-z0-9]+/g, '-')
    };
  }).get();

  $('#projects-container')
    .empty()
    .contentSlide({
      data : projects
    });

  // Global
  if ('Touch' in window) {
    $('#bottom-nav > li, #info-nav > li').bind('touchend', function(event) {
      var self = $(this);
      var span = self.find('span span');

      self.parent().find('.hover').find('span span').css({ height : 0 }).end().removeClass('hover');
      self.addClass('hover');
      span.css({ height : 'auto' });

      var height = span.height() + 'px';

      span.css({ height: height }, 200);

      event.stopPropagation();
    });

    $(document).bind('touchstart', function() {
      if ($(event.target).parents('#bottom-nav').length == 0) {
        var element = $('#bottom-nav > li');

        if (element.hasClass('hover')) {
          element.find('span span').css({ height: 0 });
          element.removeClass('hover');
        }
      }

      if ($(event.target).parents('#info-nav').length == 0) {
        var element = $('#info-nav > li');

        if (element.hasClass('hover')) {
          element.find('span span').css({ height: 0 });
          element.removeClass('hover');
        }
      }
    });
  } else {
    $('#bottom-nav > li, #info-nav > li').hover(function() {
      var self = $(this);
      var span = self.find('span span');

      self.addClass('hover');
      span.css({ height : 'auto' });

      var height = span.height() + 'px';

      span
        .css({ height : 0 })
        .stop()
        .animate({ height: height }, 200);
    }, function() {
      var
      self = $(this);
      self.find('span span').stop().animate({ height: 0 }, 200, function() {
        self.removeClass('hover');
      });
    });
  }

  // People
  var base = $.fn.contentSlide.base;

  delete base.watch;
  delete base.jumpTo;
  delete base.updateContent;

  base.build = [function(options) {
    this.bind('content-slide.build', function() {
      $(this).width($(this).find('.item').length * (350 + 64));
    });
  }];

  $('#people-container').contentSlide({
    base : base,
    rows : 0
  });
});

if ($('.homepage-image').length > 0) {
  $('.homepage-image')
    .removeClass('homepage-image')
    .wrap('<div class="homepage-image full-size" />');

  $(window).resize(function() {
    if (navigator.userAgent.match(/iPad/i)) {
      var windowWidth  = window.innerWidth;
      var windowHeight = window.innerHeight;
    } else {
      var windowWidth  = $(window).width();
      var windowHeight = $(window).height();
    }

    $('.homepage-image').css({
      height : windowHeight + 'px'
    });

    var image        = $('.homepage-image > img');
    var imageWidth   = image.width();
    var imageHeight  = image.height();
    var widthRatio   = windowWidth  / imageWidth;
    var heightRatio  = windowHeight / imageHeight;

    var widthDifference  = heightRatio * imageWidth;
    var heightDifference = widthRatio  * imageHeight;

    if(heightDifference > windowHeight) {
      image.css({
        width  : windowWidth      + 'px',
        height : heightDifference + 'px'
      });
    } else {
      image.css({
        width  : widthDifference + 'px',
        height : windowHeight    + 'px'
      });
    }
  });
}

function repositionNavigation(offset) {
  return function() {
    $('#bottom-nav, #info-nav').css({
      top: window.innerHeight - offset + window.scrollY
    });
  };
}

if (navigator.userAgent.match(/iPad/i)) {
  $(window).bind('orientationchange', function() {
    window.location = window.location.toString().split('#')[0];
  });
}

if (navigator.userAgent.match(/iPad/i) && $('#posts, #news-post').length == 1) {
  $(window)
    .scroll(repositionNavigation(35))
    .load(function() {
      setTimeout(repositionNavigation(35), 100);
    });
}

$(window).load(function() {
  $(this).trigger('resize');
});

