/* jQuery-based Slider/Gallery/Thingamabob - Copyright (c) 2009 Joseph Jaramillo */

var featuredProjectCache = [];

function assembleProjectArea(data) {
  result  = "<div class=\"project-information\">";
  result += "<h2>Featured Project:</h2>";
  result += "<h1><a href=\"" + data['url'] + "\">" + data['name'] + "</a></h1>";
  result += "<p class=\"description\">" + data['description'] + "</p>";
  result += "<p class=\"learn-more\"><a href=\"" + data['url'] + "\">Learn More &raquo;</a></p>";
  result += "</div>";
  return result;
}

function handleProjectData(data) {
  
  $("#display .inner").html(assembleProjectArea(data));
  $("#loading-screen").animate({opacity:1.0}, 'normal', function(){
    $("#display").css({'background':'white url("' + data['photo'] + '") center top no-repeat'});
    // Bring up the lights
    $("#display .inner").animate({opacity:1.0}, 'normal', function(){
      $("#display .inner").css({filter:''});
    });
    $("#loading-screen").animate({opacity:0.0}, 'normal', function(){
      $("#loading-screen").css({display:'none'});
    });
  });
}

/* Action Functions */
function showFeaturedProject(id) {
  $("#display .inner").animate({opacity:0.0}, 'normal');
  $("#loading-screen").css({display:'block', opacity:0}).animate({opacity:0.85}, 'normal', function(){
    $.ajax({
      type: "get",
      url: "/research/projects/home-slider/" + id,
      dataType: "json",
      success: handleProjectData
    });
  });
}

function slideNext() {
  // Get the current left offset of the .inner element
  currentOffset = $("#picker .slider .main .inner").attr('offsetLeft');
  // Move the slider left if doing so will keep the new offset at or above the maximum
  if((currentOffset - sliderButtonWidth()) >= (-1 * maximumLeftOffset())) {
    $("#picker .slider .main .inner").animate({left:(currentOffset - sliderButtonWidth()) + 'px'}, 'normal', 'easeInOutSine');
  }
}

function slidePrevious() {
  currentOffset = $("#picker .slider .main .inner").attr('offsetLeft');
  // Move the slider to th right if doing so will keep the new offset at or below 0.
  if((currentOffset + sliderButtonWidth()) <= 0) {
    $("#picker .slider .main .inner").animate({left:(currentOffset + sliderButtonWidth()) + 'px'}, 'normal', 'easeInOutSine');
  }
}

function selectProject(element) {
  if($(element).hasClass('selected') == false) {
    $("#picker ul li.selected").removeClass('selected');
    showFeaturedProject(element.id.replace('featured-project-',''));
    $(element).addClass('selected');
  }
}

function stopTimer() {
  $(document).stopTime('slider');
}

function clickNext() {
  slideNext();
  stopTimer();
}

function clickPrevious() {
  slidePrevious();
  stopTimer();
}

function clickProject() {
  selectProject(this);
  stopTimer();
}

/* Utility Functions */
function sliderButtonWidth() {
  return $("#picker ul li").outerWidth();
}

function maximumLeftOffset() {
  var numberOfProjects = $("#picker ul li").length;
  // Set the maximum left offset - a total of 3 should be visible
  if(numberOfProjects <= 3) {
    return 0;
  } else {
    return ((numberOfProjects - 3) * sliderButtonWidth());
  }
}

/* Setup Functions */
function setupPicker() {
  $("#picker ul li").click(clickProject);
  $(".navigate-right").click(clickNext);
  $(".navigate-left").click(clickPrevious);
}

function activateSlider() {
  // Check to see if anything is selected
  selected = $("#picker ul li.selected");
  if(selected.length > 0) { // One item is selected
    // Find the index of the item in question
    index = $("#picker ul li").index(selected);

    // Switch depending on if the selected item is the last or anywhere earlier
    if(index < ($("#picker ul li").length - 1)) { // Earlier item is selected
      nextIndex = index + 1;

      // Get the next item
      nextProject = $("#picker ul li")[nextIndex];

      // Check if nextProject is visible
      // Get the offset of nextProject.
      nextOffset = $(nextProject).attr('offsetLeft');
      innerOffset = $("#picker .slider .main .inner").attr('offsetLeft') * -1.0;

      // An item is "visible" if its offset is within 3 widths of the current offset, positive
      if((nextOffset > innerOffset) && (nextOffset < (innerOffset + 3 * sliderButtonWidth()))) { // Item is visible, so click it.
        selectProject(nextProject);
      } else { // The item is not visible, so move the slider over one and proceed.
        if((innerOffset - sliderButtonWidth()) >= (-1 * maximumLeftOffset())) {
          slideNext();
          selectProject(nextProject);
        }
      }
    } else { // Last item is selected
      // Scroll back to the beginning, and click the first.
      $("#picker .slider .main .inner").animate({left:0}, 'normal', 'easeInOutSine', function(){
        selectProject($("#picker ul li")[0]);
      });
    }
  } else { // Nothing is selected - pick the first
    selectProject($("#picker ul li")[0]);
  }
}

/* Trigger */
$(document).ready(function(){
  // Set the width on the inner element to fit
  $("#picker .slider .main .inner").css({width:$("#picker ul li").length * sliderButtonWidth()});

  // Set up the slider
  setupPicker();

  // Start the cycle!
  $(document).everyTime('8s', 'slider', activateSlider, true);
});