jQuery.fn.slideShow = function(api_key, album_id, opts) {
  var options = {
    delay: 5000,
    fade: 500
  };
  var opts = jQuery.extend(true, {}, options, opts);
  ++jQuery.fn.slideShow.show_num;
  var show_num = 'SHOW_POLL_' + jQuery.fn.slideShow.show_num;
  this.each(function() {
    window.CONTROL_FADE = null;
    var $this = $(this);
    var over = false;
    var PHOTOS = [];
    var PHOTO_INDEX = 0;

    $this.addClass('jq-show');
    $this.html(jQuery.fn.slideShow.html);

    $this.click(function() {
      $this.addClass('hover');
      over = true;
      showAndFade();
    });

    function showAndFade () {
      if (CONTROL_FADE) {
        clearTimeout(CONTROL_FADE);
      }
      window.CONTROL_FADE = setTimeout(function() {
        $this.removeClass('hover');
      }, 5000);
    }

    $this.hover(
      function() {
        if (over) {
          return;
        }
        over = true;
        $(this).addClass('hover');
        showAndFade();
      },
      function() {
        over = false;
        $(this).removeClass('hover');
        if (CONTROL_FADE) {
          clearTimeout(CONTROL_FADE);
        }
      }
    );
    $this.find('.jq-control').hover(
      function() {
        $(this).addClass('jq-control-hover');
      },
      function() {
        $(this).removeClass('jq-control-hover');
      }
    );


    $.getJSON("http://api.smugmug.com/services/api/json/1.2.1/?method=smugmug.login.anonymously&APIKey=" + api_key + "&JSONCallback=?",
    function(data){
      sessionId = data.Login.Session.id;
      var images = 'http://api.smugmug.com/services/api/json/1.2.1/?method=smugmug.images.get&AlbumID=' + album_id + '&Heavy=true&SessionID=' + sessionId + '&APIKey=' + api_key + '&JSONCallback=?';
      $.getJSON(images, function(d) {
        PHOTOS = d.Images;
        PHOTO_INDEX = PHOTOS.length - 1;
        startShow();
      });
    });


    function showPhoto(image) {
      var $images = $this.find('.jq-images');

      $images.fadeOut(opts.fade, function() {
        $images.html('<img src="' + image.MediumURL + '"/>');
        $images.fadeIn(opts.fade);
      });
    }

    $this.find('.jq-pause-play, .jq-next, .jq-previous').click(function() {
      showAndFade();
    });

    $this.find('.jq-pause-play').click(function(e) {
      e.preventDefault();
      var $this = $(this);
      if ($this.hasClass('jq-play')) {
        $this.removeClass('jq-play').addClass('jq-paused');
        clearTimeout(window[show_num]);
      } else {
        $this.addClass('jq-play').removeClass('jq-paused');
        window[show_num] = setTimeout(startShow, opts.delay);
      }
    });



    $this.find('.jq-next').click(function(e) {
      e.preventDefault();
      var image = getNext();
      showPhoto(image);
    });
    $this.find('.jq-previous').click(function(e) {
      e.preventDefault();
      var image = getPrevious();
      showPhoto(image);
    });
    function getNext() {
      PHOTO_INDEX++;
      if (PHOTO_INDEX == PHOTOS.length) {
        PHOTO_INDEX = 0;
      }
      return PHOTOS[PHOTO_INDEX];
    }
    function getPrevious() {
      PHOTO_INDEX--;
      if (PHOTO_INDEX == -1) {
        PHOTO_INDEX = PHOTOS.length - 1;
      }
      return PHOTOS[PHOTO_INDEX];
    }
    var startShow = function() {
      var image = getNext();
      var $images = $this.find('.jq-images');

      $images.fadeOut(opts.fade, function() {
        $images.html('<img src="' + image.MediumURL + '"/>');
        $images.fadeIn(opts.fade, function() {
          window[show_num] = setTimeout(startShow, opts.delay)
        });
      });
    };
  });
  return show_num;
};

jQuery.fn.slideShow.show_num = 0;
jQuery.fn.slideShow.html = '\
<div class="jq-images"></div>\
<div class="jq-controls">\
  <div class="jq-control jq-previous"></div>\
  <div class="jq-control jq-play jq-pause-play"></div>\
  <div class="jq-control jq-next"></div>\
</div>';