/**
 * Interface Elements for jQuery
 * ImageBox
 *
 * http://interface.eyecon.ro
 *
 * Copyright (c) 2006 Stefan Petre
 * Dual licensed under the MIT (MIT-LICENSE.txt)
 * and GPL (GPL-LICENSE.txt) licenses.
 *
 */

jQuery.ImageBox = {
  options : {
    border				: 10,
    loaderSRC			: '/design/images/img/loading.gif',
    closeHTML			: '<img src="/design/images/title/close.gif" />',
    overlayOpacity		: 0.8,
    textImage			: 'Фото',
    textImageFrom		: 'из',
    fadeDuration		: 400
  },
  imageLoaded : false,
  firstResize : false,
  currentRel : null,
  animationInProgress : false,
  opened : false,

  keyPressed : function(event)
  {
    if(!jQuery.ImageBox.opened || jQuery.ImageBox.animationInProgress)
      return;
    var pressedKey = event.charCode || event.keyCode || -1;
    switch (pressedKey)
    {
      //end
      case 35:
        if (jQuery.ImageBox.currentRel)
          jQuery.ImageBox.start(null, jQuery('a[@rel=' + jQuery.ImageBox.currentRel+ ']:last').get(0));
      break;
      //home
      case 36:
        if (jQuery.ImageBox.currentRel)
          jQuery.ImageBox.start(null, jQuery('a[@rel=' + jQuery.ImageBox.currentRel+ ']:first').get(0));
      break;
      //left
      case 37:
      //backspace
      case 8:
      //page up
      case 33:
      //p
      case 80:
      case 112:
        var prevEl = jQuery('#ImageBoxPrevImage');
        if(prevEl.get(0).onclick != null) {
          prevEl.get(0).onclick.apply(prevEl.get(0));
        }
      break;
      //up
      case 38:
      break;
      //right
      case 39:
      //page down
      case 34:
      //space
      case 32:
      //n
      case 110:
      case 78:
        var nextEl = jQuery('#ImageBoxNextImage');
        if(nextEl.get(0).onclick != null) {
          nextEl.get(0).onclick.apply(nextEl.get(0));
        }
      break;
      //down;
      case 40:
      break;
      //escape
      case 27:
        jQuery.ImageBox.hideImage();
      break;
    }
  },

  init : function(options)
  {
    if (options)
      jQuery.extend(jQuery.ImageBox.options, options);
    if (window.event) {
      jQuery('body',document).bind('keyup', jQuery.ImageBox.keyPressed);
    } else {
      jQuery(document).bind('keyup', jQuery.ImageBox.keyPressed);
    }
    jQuery('a').each(
      function()
      {
        el 				= jQuery(this);
        relAttr 		= el.attr('rel')||'';
        hrefAttr 		= el.attr('href')||'';
        if (relAttr.toLowerCase().indexOf('imagebox') == 0) {
          el.bind('click', jQuery.ImageBox.start);
        }
      }
    );
    if (jQuery.browser.msie) {
      iframe = document.createElement('iframe');
      jQuery(iframe)
        .attr(
          {
            id			: 'ImageBoxIframe',
            src			: 'javascript:false;',
            frameborder	: 'no',
            scrolling	: 'no'
          }
        )
        .css (
          {
            display		: 'none',
            position	: 'absolute',
            top			: '0',
            left		: '0',
            filter		: 'progid:DXImageTransform.Microsoft.Alpha(opacity=0)'
          }
        );
      jQuery('body').append(iframe);
    }

    overlay	= document.createElement('div');

    jQuery(overlay)
      .attr('id', 'ImageBoxOverlay')
      .append(document.createTextNode(' '))
      .bind('click', jQuery.ImageBox.hideImage);

    captionText = document.createElement('div');
    jQuery(captionText)
      .attr('id', 'ImageBoxCaptionText')
      .css(
        {
          paddingLeft		: jQuery.ImageBox.options.border + 'px'
        }
      )
      .append(document.createTextNode(' '));

    captionImages = document.createElement('div');
    jQuery(captionImages)
      .attr('id', 'ImageBoxCaptionImages')
      .css(
        {
          paddingLeft		: jQuery.ImageBox.options.border + 'px',
          paddingBottom	: jQuery.ImageBox.options.border + 'px'
        }
      )
      .append(document.createTextNode(' '));

    closeEl = document.createElement('a');
    jQuery(closeEl)
      .attr(
        {
          id			: 'ImageBoxClose',
          href		: '#'
        }
      )
      .css(
        {
          position	: 'absolute',
          right		: jQuery.ImageBox.options.border + 'px',
          top			: '0'
        }
      )
      .append(jQuery.ImageBox.options.closeHTML)
      .bind('click', jQuery.ImageBox.hideImage);

    captionEl = document.createElement('div');
    jQuery(captionEl)
      .attr('id', 'ImageBoxCaption')
      .css(
        {
          position	: 'relative',
          textAlign	: 'left',
          margin		: '0 auto',
          zIndex		: 1
        }
      )
      .append(captionText)
      .append(captionImages)
      .append(closeEl);

    loader = document.createElement('img');
    loader.src = jQuery.ImageBox.options.loaderSRC;
    jQuery(loader)
      .attr('id', 'ImageBoxLoader')
      .css(
        {
          position	: 'absolute'
        }
      );

    prevImage = document.createElement('a');
    jQuery(prevImage)
      .attr(
        {
          id			: 'ImageBoxPrevImage',
          href		: '#'
        }
      )
      .css(
        {
          position		: 'absolute',
          display			: 'none',
          overflow		: 'hidden',
          textDecoration	: 'none'
        }
      )
      .append(document.createTextNode(' '));

    nextImage = document.createElement('a');
    jQuery(nextImage)
      .attr(
        {
          id			: 'ImageBoxNextImage',
          href		: '#'
        }
      )
      .css(
        {
          position		: 'absolute',
          overflow		: 'hidden',
          textDecoration	: 'none'
        }
      )
      .append(document.createTextNode(' '));


    var container = document.createElement('div');

    jQuery(container)
      .attr('id', 'ImageBoxContainer')
      .css(
        {
          display		: 'none',
          position	: 'relative',
          overflow	: 'hidden',
          textAlign	: 'left',
          margin		: '0 auto',
          top			: '0',
          left		: '0',
          zIndex		: 2
        }
      )
      .append([loader, prevImage, nextImage]);

    outerContainer = document.createElement('div');
    jQuery(outerContainer)
      .attr('id', 'ImageBoxOuterContainer')
      .css(
        {
          display		: 'none',
          overflow	: 'hidden',
          textAlign	: 'center',
          backgroundColor : 'transparent',
          lineHeigt	: '0'
        }
      )
      .append([container,captionEl]);

    jQuery('body')
      .append(overlay)
      .append(outerContainer);

  },

  start : function(e, elm)
  {
    document.getElementById('wrapper').scrollIntoView();
    el = elm ? jQuery(elm) : jQuery(this);
    linkRel =  el.attr('rel');
    var totalImages, iteration, prevImage, nextImage;
    if (linkRel != 'imagebox') {
      jQuery.ImageBox.currentRel = linkRel;
      gallery = jQuery('a[@rel=' + linkRel + ']');
      totalImages = gallery.size();
      iteration = gallery.index(elm ? elm : this);
      prevImage = gallery.get(iteration - 1);
      nextImage = gallery.get(iteration + 1);
    }
    imageSrc =  el.attr('href');
    captionText = el.attr('title');
    pageSize = jQuery.iUtil.getScroll();
    overlay = jQuery('#ImageBoxOverlay');
    if (!jQuery.ImageBox.opened) {
      jQuery.ImageBox.opened = true;
      if (jQuery.browser.msie) {
        jQuery('#ImageBoxIframe')
          .css ('height', Math.max(pageSize.ih,pageSize.h) + 'px')
          .css ('width', Math.max(pageSize.iw,pageSize.w)-15 + 'px')
          .show();
      }
      overlay
        .css ('height', Math.max(pageSize.ih,pageSize.h) + 'px')
        .css ('width', Math.max(pageSize.iw,pageSize.w)-15 + 'px')
        .show()
        .fadeTo(
          300,
          jQuery.ImageBox.options.overlayOpacity,
          function()
          {
            jQuery.ImageBox.loadImage(
              imageSrc,
              captionText,
              pageSize,
              totalImages,
              iteration,
              prevImage,
              nextImage
            );
          }
        );
      jQuery('#ImageBoxOuterContainer').css ('width', Math.max(pageSize.iw,pageSize.w)-15 + 'px');
    } else {
      jQuery('#ImageBoxPrevImage').get(0).onclick = null;
      jQuery('#ImageBoxNextImage').get(0).onclick = null;
      jQuery.ImageBox.loadImage(
        imageSrc,
        captionText,
        pageSize,
        totalImages,
        iteration,
        prevImage,
        nextImage
      );
    }
    return false;
  },

  loadImage : function(imageSrc, captiontext, pageSize, totalImages, iteration, prevImage, nextImage)
  {
    jQuery('#ImageBoxCurrentImage').remove();
    prevImageEl = jQuery('#ImageBoxPrevImage');
    prevImageEl.hide();
    nextImageEl = jQuery('#ImageBoxNextImage');
    nextImageEl.hide();
    var loader = jQuery('#ImageBoxLoader');
    var container = jQuery('#ImageBoxContainer');
    var outerContainer = jQuery('#ImageBoxOuterContainer');
    var captionEl = jQuery('#ImageBoxCaption');
    jQuery(captionEl).css('visibility', 'hidden');
    jQuery('#ImageBoxCaptionText').html(captionText);
    jQuery.ImageBox.animationInProgress = true;
    if (totalImages)
      jQuery('#ImageBoxCaptionImages').html(
        jQuery.ImageBox.options.textImage
        + ' ' + (iteration + 1) + ' '
        + jQuery.ImageBox.options.textImageFrom
        + ' ' + totalImages
      );
    if (prevImage) {
      prevImageEl.get(0).onclick = function()
      {
        this.blur();
        jQuery.ImageBox.start(null, prevImage);
        return false;
      };
    }
    if (nextImage) {
      nextImageEl.get(0).onclick =function()
      {
        this.blur();
        jQuery.ImageBox.start(null, nextImage);
        return false;
      };
    }
    loader.show();
    containerSize = jQuery.iUtil.getSize(container.get(0));
    containerW = Math.max(containerSize.wb, loader.get(0).width + jQuery.ImageBox.options.border * 2);
    containerH = Math.max(containerSize.hb, loader.get(0).height + jQuery.ImageBox.options.border * 2);
    loader
      .css(
        {
          left	: (containerW - loader.get(0).width)/2 + 'px',
          top		: (containerH - loader.get(0).height)/2 + 'px'
        }
      );
    container
      .css(
        {
          width	: containerW + 'px',
          height	: containerH + 'px'
        }
      )
      .show();
    clientSize = jQuery.iUtil.getClient();
    outerContainer
      .css('margin-top', pageSize.t +  (clientSize.h / 15) + 'px');
    if (outerContainer.css('display') == 'none') {
      outerContainer
        .show()
        .fadeIn(
          jQuery.ImageBox.options.fadeDuration
        );
    }
    imageEl = new Image;
    jQuery(imageEl)
      .attr('id', 'ImageBoxCurrentImage')
      .one('load',
      function()
      {
        containerW = imageEl.width + jQuery.ImageBox.options.border * 2;
        containerH = imageEl.height + jQuery.ImageBox.options.border * 2;
        loader.hide();
        container.animate(
          {
            height		: containerH
          },
          containerSize.hb != containerH ? jQuery.ImageBox.options.fadeDuration : 1,
          function()
          {
            container.animate(
              {
                width		: containerW
              },
              containerSize.wb != containerW ? jQuery.ImageBox.options.fadeDuration : 1,
              function()
              {
                container.prepend(imageEl);
                jQuery(imageEl)
                  .css(
                    {
                      position	: 'absolute',
                      left		: jQuery.ImageBox.options.border + 'px',
                      top			: jQuery.ImageBox.options.border + 'px'
                    }
                  )
                  .fadeIn(
                    jQuery.ImageBox.options.fadeDuration,
                    function()
                    {
                      captionSize = jQuery.iUtil.getSize(captionEl.get(0));
                      if (prevImage) {
                        prevImageEl
                          .css(
                            {
                              left	: jQuery.ImageBox.options.border + 'px',
                              top		: jQuery.ImageBox.options.border + 'px',
                              width	: containerW/2 - jQuery.ImageBox.options.border * 3 + 'px',
                              height	: containerH - jQuery.ImageBox.options.border * 2 + 'px'
                            }
                          )
                          .show();
                      }
                      if (nextImage) {
                        nextImageEl
                          .css(
                            {
                              left	: containerW/2 + jQuery.ImageBox.options.border * 2 + 'px',
                              top		: jQuery.ImageBox.options.border + 'px',
                              width	: containerW/2 - jQuery.ImageBox.options.border * 3 + 'px',
                              height	: containerH - jQuery.ImageBox.options.border * 2 + 'px'
                            }
                          )
                          .show();
                      }
                      captionEl
                        .css(
                          {
                            width		: containerW + 'px',
                            top			: - captionSize.hb + 'px',
                            visibility	: 'visible'
                          }
                        )
                        .animate(
                          {
                            top		: -1
                          },
                          jQuery.ImageBox.options.fadeDuration,
                          function()
                          {
                            jQuery.ImageBox.animationInProgress = false;
                          }
                        );
                    }
                  );
              }
            );
          }
        );
      }
    );
    imageEl.src = imageSrc;

  },

  hideImage : function()
  {
    jQuery('#ImageBoxCurrentImage').remove();
    jQuery('#ImageBoxOuterContainer').hide();
    jQuery('#ImageBoxCaption').css('visibility', 'hidden');
    jQuery('#ImageBoxOverlay').fadeTo(
      300,
      0,
      function(){
        jQuery(this).hide();
        if (jQuery.browser.msie) {
          jQuery('#ImageBoxIframe').hide();
        }
      }
    );
    jQuery('#ImageBoxPrevImage').get(0).onclick = null;
    jQuery('#ImageBoxNextImage').get(0).onclick = null;
    jQuery.ImageBox.currentRel = null;
    jQuery.ImageBox.opened = false;
    jQuery.ImageBox.animationInProgress = false;
    return false;
  }
};