jQuery(function($) {

  var locals = {
    full: null,
    bg: null,
    bordered_content: null
  };

  var explained_select = false;
  var explained_unselect = false;
  var get_image, get_large_url, toggle_select, is_selected, notify_cur_image, can_zoom;
  var auto_zoom = false;

  var windowResizeTimeout;

  $.imageshow = function(settings) {
    if (! this) return false;
    if (settings) {
      if (settings.index != null) index = settings.index;
      if (settings.get_image != null) get_image = settings.get_image;
      if (settings.get_large_url != null) get_large_url = settings.get_large_url;
      if (settings.toggle_select != null) toggle_select = settings.toggle_select;
      if (settings.is_selected != null) is_selected = settings.is_selected;
      if (settings.notify_cur_image != null) notify_cur_image = settings.notify_cur_image;
      if (settings.can_zoom != null) can_zoom = settings.can_zoom;
      if (settings.auto_zoom != null) auto_zoom = settings.auto_zoom;
    }
    construct();
    show_nav();

    if ($.browser.msie && $.browser.version < 7) {
      locals.bordered_content.css({
	position: 'absolute',
	top: document.documentElement.scrollTop + document.documentElement.clientHeight / 20 
      });
      locals.bordered_content.get(0).style.setExpression(
	'top',
	'eval(document.documentElement.scrollTop + document.documentElement.clientHeight / 20)'  
      );
      document.recalc(true);
    }

    $(window).bind('resize.imageshow', function() {
      window.clearTimeout(windowResizeTimeout);
      windowResizeTimeout = window.setTimeout(windowResizeHandler, 200);
    });
    return false;
  };

  function construct() {
    if (! locals.full) {
      $('body').append(
	'<div id="imageshowFull" style="z-index: 5;">' +
	  '<div id="imageshowBg"></div>' +
	  '<div id="imageshowBorderedContent">' +
	    '<div id="imageshowContent">' +
	      '<div id="imageshowImage" />' +
	      '<div id="imageshowMenu">' +
		'<img src="/_img/ecom/done-button.png" class="imageshowDone" style="position: absolute; top: -13px; right: -13px;" />' +
		'<div id="imageshowCaption" />' +
		'<div class="imageshowSelect { explain: false }">' +
		  '<img class="imageshowSelectImage" src="/_img/ecom/lv-select.png">' +
		'</div>' +
		'<div id="imageshowZoom">' +
		  '<img src="/_img/ecom/lv-zoom.png">' +
		'</div>' +
		'<div id="imageshowThumbnail">' +
		  '<img src="/_img/ecom/lv-thumbnail.png" class="imageshowDone">' +
		'</div>' +
		'<div style="position: relative;" class="imageshowIE6Magic"></div>' +
		'<div id="imageshowPrev">' +
		  '<img src="/_img/ecom/blk_styles/blk_leftarrow.png" style="padding-right: 4px; padding-bottom: 3px;" align="absmiddle">' +
		  'PREV IMAGE' +
		'</div>' +
		'<div style="position: relative;" class="imageshowIE6Magic"></div>' +
		'<div id="imageshowNext">' +
		  'NEXT IMAGE' +
		  '<img src="/_img/ecom/blk_styles/blk_rightarrow.png" style="padding-left: 4px; padding-bottom: 3px;" align="absmiddle">' +
		'</div>' +
	      '</div>' +
	    '</div>' +
	  '</div>' +
	'</div>'
      );
      locals.bg = $('#imageshowBg');
      locals.full = $('#imageshowFull');
      locals.bordered_content = $('#imageshowBorderedContent');
      $('.imageshowDone').unbind('click');
      $('.imageshowDone').click(function () { hide(); });

      $('#imageshowPrev,#imageshowNext').unbind('click');
      $('#imageshowPrev').click(function() { auto_zoom = false; nav(-1); });
      $('#imageshowNext').click(function() { auto_zoom = false; nav(+1); });
    };
  };

  function show_nav() {
    if (! locals.full) return;
    $('body').css('cursor', 'wait');
    notify_cur_image(
      index,
      function() {
	fill_image();
	locals.bg.css({opacity:0}).fadeTo(500, 0.75);
	locals.full.show();
	locals.bg.show();
	locals.bordered_content.show();
	setsize();
	$('body').css('cursor', 'auto');
      }
    );
  }

  function hide() {
    if (! locals.full) return;
    locals.full.hide();
    locals.bg.hide();
    locals.bordered_content.hide();
  }

  function windowResizeHandler() {
    setsize();
  }

  function setsize() {
    if (! locals.full) return;
    var wwidth =
      window.innerWidth ||
      jQuery.boxModel && document.documentElement.clientWidth ||
      document.body.clientWidth;
    locals.bordered_content.css({
      left: ((wwidth - locals.bordered_content.width()) / 2) + "px"
    });
    if ($.browser.msie && $.browser.version < 7) return;
    var wheight =
      window.innerHeight ||
      jQuery.boxModel && document.documentElement.clientHeight ||
      document.body.clientHeight;
    locals.bordered_content.css({
      top: ((wheight - locals.bordered_content.height()) / 2) + "px"
    });
  }

  function nav(offset) {
    index += offset;
    $('body').css('cursor', 'wait');
    notify_cur_image(
      index,
      function() {
	fill_image();
	$('body').css('cursor', 'auto');
      }
    );
  }

  function fill_image() {
    if (! get_image) return;
    var image = get_image(index);
    if (! image) return;

    image.EventFirst ? 
      $('#imageshowPrev').hide() :
      $('#imageshowPrev').show();
    image.EventLast ? 
      $('#imageshowNext').hide() :
      $('#imageshowNext').show();

    var url = 'http://i.digiproofs.com/i/'+image.ImageId+'1'+image.Rotation+'10000000';
    var large_url = get_large_url(image);
    $('#imageshowImage').html(
      '<div class="imageshowOverlayImageDiv" style="position: relative;">' +
	'<img style="position: relative;" class="imageshowOverlaidImage" src="'+url+'" />' +
      '</div>' +
      '<div class="imageshowOverlayClearDiv imageshowSelect { explain: true }" style="position: relative; opacity: 0; z-index: 10">' +
	'<img class="imageshowOverlayClearImg" src="/_img/clear.gif">' +
      '</div>'
    );
    $('.imageshowOverlaidImage').hide();
    var img = $('.imageshowOverlaidImage')[0];
    $(img).load(function() {
      var container = $('#imageshowImage')[0];
      var img_aspect = $(this).width() / $(this).height();
      var container_aspect = $(container).width() / $(container).height();
      var width, height, left, top;
      if (img_aspect >= container_aspect) {
	width = $(container).width();
	height = $(container).width() / img_aspect;
	left = 0;
	top = ($(container).height() - height) / 2;
      }
      else {
	width = $(container).height() * img_aspect;
	height = $(container).height();
	left = ($(container).width() - width) / 2;
	top = 0;
      }
      $('.imageshowOverlayImageDiv').css({
	width: $(container).width(), height: $(container).height(), left: 0, top: 0
      });
      $('.imageshowOverlayClearDiv').css({
	width: $(container).width(), height: $(container).height(), left: 0, top: 0 - $(container).height()
      });
      $('.imageshowOverlayClearImg').css({
	width: $(container).width(), height: $(container).height(), left: 0, top: 0
      });
      $(this).css({width: width, height: height, left: left, top: top});
      $('.imageshowOverlaidImage').show();
    });

    $('#imageshowCaption').html(image.Caption);
    if (toggle_select) {
      $('.imageshowSelect').unbind('click');
      $('.imageshowSelect').click(function() {
	toggle_select(image);

	if (is_selected != null && (! explained_select || ! explained_unselect)) {
	  var content, action;
	  if (is_selected(image) && ! explained_select) {
	    content = 'You have selected this image.  Click again to unselect it.';
	    explained_select = true;
	  }
	  if (! is_selected(image) && ! explained_unselect) {
	    content = 'You have unselected this image.';
	    explained_unselect = true;
	  }
	  if (content != null) {
	    jQuery.each($('.imageshowSelect'), function() {
	      if (! $(this).metadata().explain) return true;
	      return true;
	      var qtip = $(this).qtip({
		content: { text: content },
		show: { ready: true },
		position: {
		  corner: { target: 'topLeft' },
		  adjust: { x: 20, y: 20 }
		},
		api: {
		  onHide: function() { qtip.qtip("destroy"); }
		}
	      });
	    });
	  }
	}
      });
    }
    if (can_zoom(image)) {
      $('#imageshowZoom').show();
      $('#imageshowZoom').unbind('click');
      $('#imageshowZoom').click(function() {
        $('#imageshowImage').dragzoom({ url: large_url });
      });
      if (auto_zoom) $('#imageshowImage').dragzoom({ url: large_url });
    }
    else $('#imageshowZoom').hide();
  }
});