//gallery images
var gal_images = [];
var gal_current = -1;
var gal_bodyOverflow = 'auto';
//when the page has finished loading, append the extra html and set up the javascript event handlers on images, etc...
$(document).ready(function() {
    $('body').append('<div id="gal_Mask" class="gal_components"></div><div id="gal_controlsTop" class="gal_components"><div id="gal_close"><a href="#">Close</a></div></div><div id="gal_LargeWhole" class="gal_components"><div id="gal_LargeView" class="gal_components"><span></span></div><div id="gal_controls" class="gal_components"><div id="gal_description"></div><div id="gal_previous"><a href="#">&laquo; Previous</a></div><div id="gal_next"><a href="#">Next &raquo;</a></div></div></div>');
    //prehide all gallery components and set the gallery link functions
    $('.gal_components').hide();
    $('div#gal_previous a').click( function() {
      gal_showImg(gal_current-1);
      return false;
    });
    $('div#gal_next a').click( function() {
      gal_showImg(gal_current+1);
      return false;
    });
    $('div#gal_Mask,div#gal_controlsTop #gal_close a').click( gal_exit );
    //set up the click functions on the gallery links in the page
    $('.gallery2 .image a').each(function (i) {
      gal_images[i] = $(this);
      $(this).click(function () {
        gal_showImg(i);
        return false;
      });
    });
    //this corrects a box model issue... to be rectified...
    if ( $.browser.msie )
      $('#gal_LargeView').css({overflow:'hidden'});
    //a cheap way to handle scrolling! =)
    gal_bodyOverflow = $('html').css('overflow');
});


function gal_showImg(i) {
  //get current page offset and set the top of the gallery bg to that offset.
  scrolloffsets = getScrollXY();
  scrolloffset = scrolloffsets[1];
  $('div#gal_Mask').css('top', String(scrolloffset)+'px');
  //$('body,html').css('overflow','hidden');
  //prevent scrolling...
  $('html').css({overflow:'hidden'});
  //firefox 2x on winxp (vista too?) seems to have problems with "scrolling" back to top of page when html has overflow:hidden.
  window.scrollTo(scrolloffsets[0],scrolloffsets[1]);
  gal_current = i;
  //fade in all the gallery components, then...
  $('.gal_components').fadeIn('slow',function() {
    //show or hide links where appropriate
    $('div#gal_previous').show();
    $('div#gal_next').show();
    if ( i == 0 ) {
      $('div#gal_previous').hide();
    }
    if ( i == gal_images.length-1 ) {
      $('div#gal_next').hide();
    }
    //fade in the main image view, then...
    $('#gal_LargeView *').fadeOut('medium',function() {
      $("#gal_LargeView").addClass('loading');
      var img = new Image();
      //load url from gallery link in page
      $(img).load(function () {
        //calculate dimensions for larger view based on window size and size of image.
        var viewport = [
        (window.innerWidth || self.innerWidth || (document.documentElement&&document.documentElement.clientWidth) || document.body.clientWidth),
        (window.innerHeight || self.innerHeight || (document.documentElement&&document.documentElement.clientHeight) || document.body.clientHeight)
        ];
        var x = viewport[0] - 80;
        var y = viewport[1] - 80;
        var imageWidth = img.width;
        var imageHeight = img.height;
        if (imageWidth > x)
        {
          imageHeight = imageHeight * (x / imageWidth); 
          imageWidth = x; 
          if (imageHeight > y)
          { 
            imageWidth = imageWidth * (y / imageHeight); 
            imageHeight = y; 
          }
        }
        else if (imageHeight > y)
        { 
          imageWidth = imageWidth * (y / imageHeight); 
          imageHeight = y; 
          if (imageWidth > x)
          { 
            imageHeight = imageHeight * (x / imageWidth); 
            imageWidth = x;
          }
        }
        img.width=imageWidth;
        img.height=imageHeight;
        $(this).hide().click(gal_exit);
        //set the description based on the alt or title
        var caption = '';
        caption = $('.gallery2 .image a:eq('+i+') img').attr('alt');
        if ( caption == '' )
          caption = $('.gallery2 .image a:eq('+i+') img').attr('title');
        $('#gal_description').empty().append(caption);
        dheight = ($('#gal_controls').height()+$('#gal_controlsTop').height())*-1;
        //empty any previous images and add the current one.
        $('#gal_LargeView').empty().append(this);
        $('#gal_controlsTop').click( function() { $(this).animate({ 
          width: img.width+'px',
          marginLeft: ((img.width/2)*-1)+'px',
          marginTop: (((img.height/2)*-1)+dheight+scrolloffset)+'px'
        }, 250, function () {
          $('#gal_LargeView img').fadeIn();
        }); });
        //animate the resizing of the frame for different image sizes...
        $('#gal_controls').click( function() { $(this).animate({ 
          width: img.width+'px',
          marginLeft: ((img.width/2)*-1)+'px',
          marginTop: ((img.height/2)+(dheight/2)+scrolloffset)+'px'
        }, 250, function () {
          $('#gal_LargeView img').fadeIn();
        }); });
        $("#gal_LargeView").click( function() { $(this).animate({ 
          width: img.width+'px',
          height: img.height+'px',
          marginLeft: ((img.width/2)*-1)+'px',
          marginTop: (((img.height/2)*-1)+(dheight/2)+scrolloffset)+'px'
        }, 250); });
        //remove click functions and loading classes...
        $('#gal_LargeView').add('#gal_controls').add('#gal_controlsTop').click().unbind('click');
        $("#gal_LargeView").removeClass('loading');
      }).error(function () {
        alert('There was an error getting the selected image.');
      }).attr('src', gal_images[i].attr('href')/* +'?123'+Math.random(100,999)+'=asd' */); //TODO: remove random vars...
    });
  });
}

//this hides the gallery popup
function gal_exit() {
  $('html').css('overflow', gal_bodyOverflow);
  $('.gal_components').fadeOut('medium',function() { $('#gal_LargeView').empty().append('<span></span>'); });
  //seems safari doesn't show the scrollbars again until the page has been scrolled?
  if( $.browser.safari ) {
    window.scroll(1,1);
    window.scroll(-1,-1);
  }
  return false;
}

//get current scrolling offset...
function getScrollXY() {
  var x = 0, y = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    // Netscape
    x = window.pageXOffset;
    y = window.pageYOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    // DOM
    x = document.body.scrollLeft;
    y = document.body.scrollTop;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    // IE6 standards compliant mode
    x = document.documentElement.scrollLeft;
    y = document.documentElement.scrollTop;
  }
  return [x, y];
}