/***********************************************************************
                 Angelwatt Image Viewer version 1.1.3
************************************************************************
Author: Kendall Conrad of Angelwatt.com
Home page: http://www.angelwatt.com/coding/image_viewer.php
Description: Takes links to images and makes the links show the image on
the page rather than opening a new page.
License:
* This work is licensed under a Creative Commons Attribution-Share Alike
  3.0 United States License 
  http://creativecommons.org/licenses/by-sa/3.0/us/
Last Update: 2008-04-02
***********************************************************************/
function AngelwattImageViewer(id)
{
  /****  User Settings  ****/
  // Loading image: path/file.jpg
  var loadImg   = '';
  var bgOpacity = 0.8;     // Background opacity: 0-1 (except for IE)
  var textColor = '#fff';  // Text color for loading message
  var bgColor   = '#444';  // Background color for the slide
  /**** End User Settings ****/
  
  var y, yScroll, yPage, x, centerY, centerX;

  CenterImg = function (image) {
    image.style.top = centerY - (image.height / 2) +"px";
    image.style.left = centerX - (image.width / 2) +"px";
    if (parseInt(image.style.top) < yScroll) {
      image.style.top = yScroll +'px';
    }
  };
  ShowImg = function () {
    i = document.getElementById('slideImg');
    CenterImg(i);
    i.style.zIndex = 5; // bring image to front
    slideLoad.innerHTML = ''; // remove loading message
  };
  HideSlide = function () {
    slide.style.display = 'none';
    if (document.getElementById('slideImg')) {
      document.getElementById('slideImg').parentNode.removeChild(
        document.getElementById('slideImg'));
    }
  };

returnCenterY = function () {
	// Get screen height, viewport height
	y = window.innerHeight
		|| document.documentElement.clientHeight
		|| document.document.clientHeight;
	// find horizontal page position
	yScroll = window.pageYOffset
		|| document.documentElement.scrollTop
		|| document.body.scrollTop;
	// Get full height of the page
	yPage = self.innerHeight + window.scrollMaxY
		|| document.body.scrollHeight
		|| document.body.offsetHeight;
	// Set slide background to full height of page
	document.getElementById('formsSlideBG').style.height =
		(yPage < y) ? '100%' : yPage + "px";
	// Get page width
	x = window.innerWidth
		|| document.documentElement.clientWidth
		|| document.body.clientWidth;
	centerY = y/2 + yScroll;
	centerX = x/2;
	
	return centerY;
};
hideForms = function () {
	var tellAFriend = document.getElementById("tellAFriend");
	tellAFriend.style.display = 'none';
  	var formsSlide = document.getElementById("formsSlide");
	formsSlide.style.display = 'none';
};

	showTAF = function () {
		var tellAFriend = document.getElementById("tellAFriend");
		tellAFriend.style.display = 'block';
		tellAFriend.style.marginTop = returnCenterY()-200 +"px";

		var tafForm = document.getElementById("tafForm");
		tafForm.style.display = 'block';

		tellAFriend.style.left = centerX - (500 / 2) +"px";

	  	var formsSlide = document.getElementById("formsSlide");
		formsSlide.style.display = 'block';
	};
	showEnquiry = function () {
	};


  ChangeSlide = function (targetHref) {
    var img = new Image();
    if (loadImg != '') {
      slideLoad.innerHTML = '<img src="'+ loadImg +'"\
        alt="Loading" width="20" height="20"\
        style="position:relative; display:inline; z-index:2;\
        margin:0 auto; padding:0; border:none; cursor:default;" />\
        <br />Loading...';
    }
    else { slideLoad.innerHTML = 'Loading...'; }
    slide.style.display = 'block'; // put up slide with loading msg

    // Get screen height, viewport height
    y = window.innerHeight
       || document.documentElement.clientHeight
       || document.document.clientHeight;
    // find horizontal page position
    yScroll = window.pageYOffset
       || document.documentElement.scrollTop
       || document.body.scrollTop;
    // Get full height of the page
    yPage = self.innerHeight + window.scrollMaxY
       || document.body.scrollHeight
       || document.body.offsetHeight;
    // Set slide background to full height of page
    document.getElementById('slideBG').style.height =
      (yPage < y) ? '100%' : yPage + "px";
    // Get page width
    x = window.innerWidth
       || document.documentElement.clientWidth
       || document.body.clientWidth;
    centerY = y/2 + yScroll;
    centerX = x/2;
    // center loading image
    slideLoad.style.marginTop = centerY-64 +"px";

    img.onload = function()
    {
      /*** Create image tag and style it ***/
      img.id    = 'slideImg';
      img.alt   = '';
      img.title = 'Click to close';
      img.style.position = 'absolute';
      img.style.display  = 'block';
      img.style.margin   = '0 auto';
      img.style.border   = '.12em solid #000';
      img.style.cursor   = 'pointer';
      img.style.zIndex   = 0; // hide the image away until loaded
      img.onclick = HideSlide;

      CenterImg(img); // attempt to center it
      // add slide to page
      slide.insertBefore(img, slide.firstChild);
      ShowImg(); // needed for IE
    };
    img.src = targetHref;
  };
  // Create slide HTML and assign styling
  var slide = document.createElement('div');
  slide.id             = 'slide';
  slide.style.display  = 'none';
  slide.style.position = 'absolute';
  slide.style.top      = '0px';
  slide.style.left     = '0px';
  slide.style.width    = '100%';
  slide.style.height   = '100%';

  // Create and style background
  var sBg = document.createElement('div');
  sBg.id                    = 'slideBG';
  sBg.style.position        = 'absolute';
  sBg.style.top             = '0px';
  sBg.style.left            = '0px';
  sBg.style.margin          = '0 auto';
  sBg.style.width           = '100%';
  sBg.style.textAlign       = 'center';
  sBg.style.backgroundColor = bgColor;
  sBg.style.opacity         = bgOpacity;
  sBg.style.filter          = 'alpha(opacity='+ bgOpacity*100 +')';
  sBg.style.zIndex          = '2';
  sBg.onclick               = HideSlide;

  // Create and style loading message
  var slideLoad = document.createElement('p');
  slideLoad.style.margin   = '0 auto';
  slideLoad.style.fontSize = '2em';
  slideLoad.style.color    = textColor;

  // Build slide
  sBg.appendChild(slideLoad);
  slide.appendChild(sBg);
  body = document.getElementsByTagName('body')[0];
  body.appendChild(slide);
  body.style.height = "100%";
}
/*** Ensure onload isn't overwritten ***/
function appendOnLoad(fx)
{ 
  var old = window.onload;
  if (typeof old != 'function') { window.onload = fx; }
  else { window.onload = function() { old(); fx(); } }
}
/*** SlideShow argument is the id attribute to element where there are
linked images that need the slide show functionality. Providing no
arguments will result in it searching out all links to images. ***/
appendOnLoad ( function() { AngelwattImageViewer(); } );