var ANIM = {
  time_in: 100,
  time_out: 100
};

$(document).ready(function(){
  load_portfolio('xml/pf_ryan_artworks.xml');
});

function load_portfolio (filepath) {
  $.get(filepath, function(data) {
    var i;

    for (i = 0; i < $('category', data).length; i++) {
      build_list($('category', data).eq(i), i);
    }

    init_slideshow();
  });
}

function build_list ($category, i) {
  var $list, $ul, $li, $project, $artwork;

  $list = $('<div class="list' + (i % 3 == 0 ? ' first' : '') + '"></div>');

  if ($('type', $category).text() == 'digital') {
    $list.addClass('digital');
  }

  $('<h3 style="background-image:url(' + $('text-image', $category).text() + ');">' + $('name', $category).text() + '</h3>').appendTo($list);
  
  $ul = $('<ul></ul>');
  for (var i = 0; i < $('project', $category).length; i++) {
    $project = $('project', $category).eq(i);

    $li = $('<li class="project"><a href="#">' + $('title', $project).text() + '</a></li>');

    $('a', $li).attr('href', $('url', $('artwork', $project).eq(0)).text());

    for (var j = 0; j < $('artwork', $project).length; j++) {
      $artwork = $('artwork', $project).eq(j);
      $('<img src="' + $('url', $artwork).text() + '" alt="' + $('description', $artwork).text() + '" />').appendTo($li);
    }

    $li.appendTo($ul);
  }
  $ul.appendTo($list);
  
  $list.appendTo('#page');
}

function init_slideshow() {
  // Position slideshow
  position_slideshow($('#slideshow-wrap'));

  //var left = ($(window).width() - $('#slideshow-wrap').width()) / 2;
  //$('#slideshow-wrap').css('left', left);

  $(window).resize(function(){
    position_slideshow($('#slideshow-wrap'));
  });

  // Bind close events
  $('#slideshow-wrap .btn-close a').click(function(){
    $('#slideshow-wrap').fadeOut(ANIM.time_out);
  });

  // Bind open events; all slideshow information is pulled from
  // div.list elements
  $('.list li a').click(function(){
    var $list, $project;

    $list = $(this).parents('.list');
    $project = $(this).parents('li');

    open_slideshow($list, $project, 0);

    return false;
  });
}

function open_slideshow($list, $project, start){
  var 
    $img, $artwork, $nav_item;
  var
    $prev_list = $prev_project = $next_list = $next_project = null;
  var category = $('h3', $list).text();
  var project = $project.text();

  
  $('#slideshow h2').text(category);
  $('#slideshow h3').text(project);
  $('#slideshow h2').attr('style', $('h3', $list).attr('style'));

  $('#slideshow .body').empty();
  $('#slideshow .hed .nav ul').empty();

  // Create and populate slideshow with div.artwork elements
  for (var i = 0; i < $('img', $project).length; i++) {
    $artwork = $('<div class="artwork"></div>');
    $nav_item = $('<li><a href="#">' + (i+1) + '</a></li>');

    if ((i == 0 && start == 0) || (i == $('img', $project).length-1 && start == 1)) {
      $artwork.addClass('active');
      $nav_item.addClass('active');
    }

    $img = $('<img src="' + $('img', $project).eq(i).attr('src') + '" />');
    $('<h4>' + $('img', $project).eq(i).attr('alt') + '</h4>').appendTo($artwork);
    $img.appendTo($artwork);
    $artwork.appendTo('#slideshow-wrap .body');

    $nav_item.data('index', i);
    $nav_item.appendTo('#slideshow .hed .nav ul');
  }

  // Bind events for jump nav
  $('#slideshow .hed .nav li a').click(function(){
    var i = $(this).parent('li').data('index');

    $('#slideshow .artwork.active').removeClass('active');
    $('#slideshow .artwork').eq(i).addClass('active');

    $('#slideshow .hed .nav li.active').removeClass('active');
    $(this).parent('li').addClass('active');

    return false;
  });
  
  // Define previous and next projects to allow cross-category navigating
  // in the slideshow
  $prev_list = $list;
  $prev_project = $project.prev('.project');
  if ($prev_project.length == 0) {
    $prev_list = $list.prev('.list');
    if ($prev_list.length == 0) {
      $prev_list = $('.list:last');
    }
    $prev_project = $('.project:last', $prev_list);
  }

  $next_list = $list;
  $next_project = $project.next('.project');
  if ($next_project.length == 0) {
    $next_list = $list.next('.list');
    if ($next_list.length == 0) {
      $next_list = $('.list:first');
    }
    $next_project = $('.project:first', $next_list);
  }
  
  init_slideshow_nav($prev_list, $prev_project, $next_list, $next_project);

  $('#slideshow-wrap').fadeIn(ANIM.time_in);
}

/*
 * Bind events for slideshow navigation (previous, next)
 */
function init_slideshow_nav(_$prev_list, _$prev_project, _$next_list, _$next_project){
  // Bring arguments in scope
  var $prev_list = _$prev_list;
  var $prev_project = _$prev_project;
  var $next_list = _$next_list;
  var $next_project = _$next_project;

  $('#slideshow > .nav a').unbind('click');
  
  $('#slideshow-wrap .nav .btn-next a').click(function(){
    var $next_item;
    var $next = $('#slideshow .artwork.active').next();

    if ($next.length == 1) {
      $('#slideshow .artwork.active').removeClass('active');
      $next.addClass('active');

      $next_item = $('#slideshow .hed .nav li.active').next('li');
      $('#slideshow .hed .nav li.active').removeClass('active');
      $next_item.addClass('active');
    }
    else {
      open_slideshow($next_list, $next_project, 0);
    }

    return false;
  });

  $('#slideshow-wrap .nav .btn-prev a').click(function(){
    var $prev_item;
    var $prev = $('#slideshow .artwork.active').prev();

    if ($prev.length == 1) {
      $('#slideshow .artwork.active').removeClass('active');
      $prev.addClass('active');

      $prev_item = $('#slideshow .hed .nav li.active').prev('li');
      $('#slideshow .hed .nav li.active').removeClass('active');
      $prev_item.addClass('active');
    }
    else {
      open_slideshow($prev_list, $prev_project, 1);
    }

    return false;
  });
}

function position_slideshow ($slideshow_wrap) {
  var left = ($(window).width() - $slideshow_wrap.width()) / 2;
  $slideshow_wrap.css('left', left);
}