var oli = {
  now: new Date(),
  born: new Date("18 April 1985"),
  orlando: new Date("1 February 2009"),

  awesomeDate: function ( past, present ) {
    var miliseconds = present.getTime() - past.getTime();
    var diff_in_days = miliseconds / (1000 * 60 * 60 * 24);
    var diff_in_years = diff_in_days / 365.25;

    var days = Math.round(diff_in_days);
    return days;
  },

  datePercentage: function ( duration, sample ) {
    var percentage = (duration / sample) * 100;
    var percentage = Math.round(percentage);
    return percentage;
  },

  countSections: function( titlesArray ) {
    console.log(titlesArray)
    $( titlesArray ).each( function( index, element ){
      count = $( this ).nextUntil("h3", "dt").length;
      $( this ).prepend("<span class='count'>" + count + "</span>" );
    });
  },

  collapseSections: function( ) {
    console.log("collapseSections fired")
    // hide all the content
    $( "#utility_belt > dl > dd, #utility_belt > dl > dt" ).hide();
    $("#utility_belt > dl > h3").removeClass("revealed").children(".assistance").text("click to reveal");
  },

  showSections: function( ) {
    console.log("showSections fired")
    // hide all the content
    $( "#utility_belt > dl > dd, #utility_belt > dl > dt" ).show();
    $("#utility_belt > dl > h3").addClass("revealed").children(".assistance").text("click to hide")
  },

  collapseOneSection: function( sectionElements ) {
    console.log("collapseOneSection fired")
    // hide all the content
    $( sectionElements ).hide();
    $( sectionElements ).prevAll("h3").children(".assistance").text("click to reveal");
  },

  revealSection: function( titleElement ) {
    console.log("revealSection fired");
    $( titleElement ).children(".assistance").text("click to hide")
    var sections = $( titleElement ).nextUntil("h3");

    sections.show();
  }
};

$(document).ready( function() {

  // Open external links in a new window
  hostname = window.location.hostname
  $("a[href^=http]")
    .not("a[href*='" + hostname + "']")
    .addClass('link external')
    .attr('target', '_blank');

  // loading fancybox for links to images
  $(".fancylink").fancybox({
    'titlePosition'   : 'outside',
    'overlayColor'    : '#000',
    'overlayOpacity'  : 0.9
  });

  var days_alive = oli.awesomeDate(oli.born, oli.now);
  var days_paris = oli.awesomeDate(oli.born, oli.orlando);
  var days_orlando = oli.awesomeDate(oli.orlando, oli.now);

  var percent_paris = oli.datePercentage(days_paris, days_alive);
  var percent_orlando = oli.datePercentage(days_orlando, days_alive);

  $('#daysalive').text(days_alive);
  $('#percentparis').text(percent_paris + "%");
  $('#percentorlando').text(percent_orlando + "%");

  oli.collapseSections();

  // find all titles
  var titles = $("#utility_belt > dl > h3");
  oli.countSections( titles );

  // setup event listeners on titles
  $( titles ).click( function( event ) {
    console.log(event)
    console.log( "click event fired from " + $(this) )
    if ( $( this ).hasClass("revealed") ) {
      oli.collapseOneSection( $( this ).nextUntil("h3") );
      $( this ).removeClass("revealed");
    } else {
      oli.revealSection( $( this ) );
      $( this ).addClass("revealed");
    };
  });

  // display assistive text on section title hover
  $( titles ).append("<span class='assistance'>click to reveal</span>").children('.assistance').hide()

  $( titles ).mouseover( function(){
    $( this ).children(".assistance").show();
  });

  $( titles ).mouseout( function(){
    $( this ).children(".assistance").hide();
  });

  // setup event listener on Show All button
  $( "#utility_belt > h2 > span").click( function(){
    if ( $( this ).hasClass("showing") ) {
      oli.collapseSections();
      $( this ).removeClass("showing").text("Show All");
      
    } else {
      oli.showSections();
      $( this ).addClass("showing").text("Hide All");
    }
  });
});