/**
 * @note Application-wide JavaScript and jQuery
 */
$(document).ready(function() {
  /*==================================================*/
  
  /**
   * Home page slideshow and controls
   */
  // cycle options
  var cycle_opts = {
    fx: 'fade',
    pause: 1,
    timeout: 4000
  };
  // append the play/pause toggle button
  $('#slideshow').append('<p><a href="#slideshow" id="toggle-play">Pause</a></p>');
  
  // kind of a kludgey stuff here, but it works :-/
  var $orig_label = $('#slideshow #toggle-play').text();//original text label for the controls
  
  // toggle the controls
  $('#slideshow #toggle-play').toggle(
    function() {
      $(this).addClass('play');// add the play class to the link for that classy look
      $(this).text('Play');// change the text of the link
      $('#slideshow #slides').cycle('pause');//pause playing the slideshow
     },
    function() {
      $(this).removeClass('play');// remove our class
      $(this).text($orig_label);// return to our previous label
      $('#slideshow #slides').cycle('resume');//resume playing the slideshow
  });
  
  // now set the Home page slideshow up
  $('#slideshow #slides').cycle(cycle_opts);
  
  /*==================================================*/
  
  /**
   * Portfolio > Punctuation page slideshow and controls
   */
  // the next/previous links HTML (DOM injected)
  var nav_spreads = '<ul id="nav-spreads"><li id="previous"><a href="#">previous</a></li><li id="next"><a href="#">next</a></li></ul>';
  //prepend the next/prev links
  $('#spreads').prepend(nav_spreads);
  
  // cycle2 options
  var cycle2_opts = {
    before: onBefore,
    fx:      'fade', 
    speed:   'slow',
    sync:    0, 
    timeout: 0, 
    next:    '#next', 
    prev:    '#previous'
  };
  
  // temp counter
  var start = 0;
  // count the number of slides and append the results to #click
  function onBefore(curr, next, opts) {
    // we only want to do this the first time and only because cycle has no 'start' callback :(
    if(start == 0) {
      var slideCount = ' <span>[' + opts.slideCount + ' images total]</span>';
      $('#click').append(slideCount);
    }
    start++;
  }

  
  // now set the Punctuation page slideshow up
  $('#spreads #image').cycle(cycle2_opts);
  
  /*==================================================*/
  
});//end $(document).ready()