(function($) {
  $.showbox = function(data, klass) {
    $.showbox.loading()
 fillshowboxFromHref(data.div)
  }
  $.extend($.showbox, {
    settings: {
      opacity      : 0,
      overlay      : true,
      loadingImage : '/imgs/lybox/loading.gif',
      closeImage   : '/imgs/lybox/closelabel.gif',
      imageTypes   : [ 'png', 'jpg', 'jpeg', 'gif' ],
      showboxHtml  : '\
    <div id="showbox" style="display:none;"> \
      <div class="popup"> \
        <table> \
          <tbody> \
            <tr> \
              <td class="tl"/><td class="b"/><td class="tr"/> \
            </tr> \
            <tr> \
              <td class="b"/> \
              <td class="body"> \
              <div class="footerpop"> \
                  <a href="#" class="close">\
                    <img src="/imgs/lybox/closelabel.gif" title="close" class="close_image" /> \
                  </a> \
                </div> \
                <div class="contentpop"> \
                </div> \
                </td> \
              <td class="b"/> \
            </tr> \
            <tr> \
              <td class="bl"/><td class="b"/><td class="br"/> \
            </tr> \
          </tbody> \
        </table> \
      </div> \
    </div>'
    },
    loading: function() {
      init()
      if ($('#showbox .loading').length == 1) return true
      showOverlay()

      $('#showbox .contentpop').empty()
      $('#showbox .body').children().hide().end().
        append('<div class="loading"><img src="/'+$.showbox.settings.loadingImage+'"/></div>')

      $('#showbox').css({
        top:	getPageScroll()[1] + (getPageHeight() / 10),
        left:	385.5
      }).show()

      $(document).bind('keydown.showbox', function(e) {
        if (e.keyCode == 27) $.showbox.close()
        return true
      })
      $(document).trigger('loading.showbox')
    },

    reveal: function(data, klass) {
      $(document).trigger('beforeReveal.showbox')
      if (klass) $('#showbox .contentpop').addClass(klass)
      $('#showbox .contentpop').append(data)
      $('#showbox .loading').remove()
      $('#showbox .body').children().fadeIn('normal')
      $('#showbox').css('left', $(window).width() / 2 - ($('#showbox table').width() / 2))
      $(document).trigger('reveal.showbox').trigger('afterReveal.showbox')
    },

    close: function() {
      $(document).trigger('close.showbox')
      return false
    }
  })
  $.fn.showbox = function(settings) {
    init(settings)

    function clickHandler() {
      $.showbox.loading(true)
      var klass = this.rel.match(/showbox\[?\.(\w+)\]?/)
      if (klass) klass = klass[1]

      fillshowboxFromHref(this.href, klass)
      return false
    }
    return this.click(clickHandler)
  }
  function init(settings) {
    if ($.showbox.settings.inited) return true
    else $.showbox.settings.inited = true

    $(document).trigger('init.showbox')
    makeCompatible()

    var imageTypes = $.showbox.settings.imageTypes.join('|')
    $.showbox.settings.imageTypesRegexp = new RegExp('\.' + imageTypes + '$', 'i')

    if (settings) $.extend($.showbox.settings, settings)
    $('body').append($.showbox.settings.showboxHtml)

    var preload = [ new Image(), new Image() ]
    preload[0].src = $.showbox.settings.closeImage
    preload[1].src = $.showbox.settings.loadingImage
    $('#showbox .close').click($.showbox.close)
    $('#showbox .close_image').attr('src', $.showbox.settings.closeImage)
  }
  function getPageScroll() {
    var xScroll, yScroll;
    if (self.pageYOffset) {
      yScroll = self.pageYOffset;
      xScroll = self.pageXOffset;
    } else if (document.documentElement && document.documentElement.scrollTop) {
      yScroll = document.documentElement.scrollTop;
      xScroll = document.documentElement.scrollLeft;
    } else if (document.body) {
      yScroll = document.body.scrollTop;
      xScroll = document.body.scrollLeft;	
    }
    return new Array(xScroll,yScroll) 
  }
  function getPageHeight() {
    var windowHeight
    if (self.innerHeight) {	
      windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) { 
      windowHeight = document.documentElement.clientHeight;
    } else if (document.body) {
      windowHeight = document.body.clientHeight;
    }	
    return windowHeight
  }
  function makeCompatible() {
    var $s = $.showbox.settings
    $s.loadingImage = $s.loading_image || $s.loadingImage
    $s.closeImage = $s.close_image || $s.closeImage
    $s.imageTypes = $s.image_types || $s.imageTypes
    $s.showboxHtml = $s.showbox_html || $s.showboxHtml
  }
  function fillshowboxFromHref(href, klass) {
    if (href.match(/#/)) {
      var url    = window.location.href.split('#')[0]
      var target = href.replace(url,'');
      $.showbox.reveal($(target).clone().show(), klass)
    } 
  }
  function skipOverlay() {
    return $.showbox.settings.overlay == false || $.showbox.settings.opacity === null 
  }

  function showOverlay() {
    if (skipOverlay()) return

    if ($('showbox_overlay').length == 0) 
      $("body").append('<div id="showbox_overlay" class="showbox_hide"></div>')

    $('#showbox_overlay').hide().addClass("showbox_overlayBG")
      .css('opacity', $.showbox.settings.opacity)
      .click(function() { $(document).trigger('close.showbox') })
      .fadeIn(200)
    return false
  }

  function hideOverlay() {
    if (skipOverlay()) return

    $('#showbox_overlay').fadeOut(200, function(){
      $("#showbox_overlay").removeClass("showbox_overlayBG")
      $("#showbox_overlay").addClass("showbox_hide") 
      $("#showbox_overlay").remove()
    })
    
    return false
  }
  $(document).bind('close.showbox', function() {
    $(document).unbind('keydown.showbox')
    $('#showbox').fadeOut(function() {
      $('#showbox .contentpop').removeClass().addClass('contentpop')
      hideOverlay()
      $('#showbox .loading').remove()
    })
  })

})(jQuery);