// Code adapted from http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
var nextImage = new Image();
var preloadimage = new Image();
var commentGrabber = new XMLHttpRequest();


function getKeyCode(e)
{
    if(!e)
        return false;
    // adapted from http://www.mredkj.com/tutorials/validate.html
    var key;
    if(window.event) {
        // for IE, e.keyCode or window.event.keyCode can be used
        //key = e.keyCode; 
        key = window.event.keyCode;
    }
    else if(e.which) {
        // netscape
        key = e.which; 
    }
    else {
        // no event, so pass through
        return true;
    }
    return key;
}



function hideImage()
{
  hideLink();
  document.getElementById('pagegrey').style.visibility = 'hidden';
  document.getElementById('imageframe').style.visibility = 'hidden';
}

function winD(width,height,x,y)
{
    this.width = width;
    this.height = height;
    this.x = x;
    this.y = y;
}

function getWindowDimension()
{
  // get window width height and scrolling
  var scrOfX = 0, scrOfY = 0;  
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return new winD(myWidth,myHeight,scrOfX,scrOfY);
}

function showImage(file)
{
  var wn = getWindowDimension(); 
  var pagegrey = document.getElementById('pagegrey'); 
  var pimage = document.getElementById('pageimage');
  var imageframe = document.getElementById('imageframe');
  var caption_text = document.getElementById('caption_text');
  var downloadlink = document.getElementById('downloadlink');
  var imagedate = document.getElementById('imagedate');

  var i = 0;
  hideLink();
  currentImage = false;
  for(i = 0; i < imageFiles.length; i++)
  {
      if(imageFiles[i] == file)
      {
         currentImage = i;
         break;
      }
  }
  if(currentImage === false)
  {
      hideImage();
      return 0;
  }
  caption_text.innerHTML = captions[currentImage];
  imagedate.innerHTML = dates[currentImage];
  //imageframe.style.visibility = "hidden";
  imageframe.style.visibility = "visible";
  pimage.src = "about:blank";
  nextImage = new Image();
  nextImage.src = imageBase+'lg/'+file;
  downloadlink.href = 'download.php?album='+chapter+'&photo='+file;
  preloadimage.src = "about:blank";
//  pagegrey.style.top = wn.y+"px";
//  pagegrey.style.left = wn.x+"px";
  pagegrey.style.top = "0px";
  pagegrey.style.left = "0px";
  pagegrey.style.height = wn.height+"px";
  pagegrey.style.width = wn.width+"px";
  imageframe.style.width = wn.width+"px";
  pagegrey.style.visibility="visible";
//  imageframe.style.top = (wn.y + 15)+"px";
  imageframe.style.top = "15px";
  window.setTimeout('checkImage()',20);
  window.setTimeout('loadComments()',5);
  return false;
}

function loadComments()
{
  var inner_comments = document.getElementById('inner_comments');
  commentGrabber.open("POST","comment.php",false);
  commentGrabber.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  var data = "action=load&album="+chapter+"&photo="+imageFiles[currentImage];
  commentGrabber.send(data);
  inner_comments.innerHTML = commentGrabber.responseText;
}

function checkImage()
{
    var wn = getWindowDimension(); 
    var pagegrey = document.getElementById('pagegrey');
    var pimage = document.getElementById('pageimage');
    var imageframe = document.getElementById('imageframe');
    var imagecomments = document.getElementById('imagecomments');
    if(pagegrey.style.visibility=="hidden")
    {
       return false;
    }
    pagegrey.style.height = wn.height+"px";
    pagegrey.style.width = wn.width+"px";
    if(nextImage.complete)
    {
        pimage.src = nextImage.src;
        preloadimage.src = imageBase+'lg/'+imageFiles[currentImage+1];
	iwidth = nextImage.width;
	iheight = nextImage.height;
	wratio = ((wn.width - 330) * 1.0) / ((wn.height - 120) * 1.0);
	iratio = (iwidth * 1.0) / (iheight * 1.0);
	if(wratio > iratio)
	{
            pimage.style.height = (wn.height - 120)+"px";
	    pimage.style.width = Math.floor(((wn.height - 100)*1.0)*iratio)+"px";
	}
	else
	{
            pimage.style.width = (wn.width - 330)+"px";
	    pimage.style.height = Math.floor(((wn.width - 330)*1.0)/iratio)+"px";
	}
        leftoffset = ((wn.width - 660 - nextImage.width) / 2)
        if(leftoffset < 15)
        {
            leftoffset = 15;
        }
        imageframe.style.left = leftoffset+"px";
        imageframe.style.width = (wn.width-leftoffset-15)+"px";
        imageframe.style.height = (wn.height - 120)+"px";
        imageframe.style.visibility="visible";
        imagecomments.style.height = (wn.height - 190)+"px";
    }
    else
    {
        window.setTimeout('checkImage()',50);
    }
}


function addComment()
{
    var addcommentbox = document.getElementById('addcomment');
    var comment = document.getElementById('comment');
    var submitting = document.getElementById('submitting');
    addcommentbox.style.visibility="visible";
    submitting.style.visibility="hidden";
    comment.value = '';
}
function saveFinish()
{
    var addcommentbox = document.getElementById('addcomment');
    var submitting = document.getElementById('submitting');
    addcommentbox.style.visibility="hidden";
    submitting.style.visibility="hidden";
    loadComments();
    //alert("Sorry, the comment box doesn't work yet.");
}
function saveComment()
{
    var addcommentbox = document.getElementById('addcomment');
    var submitting = document.getElementById('submitting');
    var name = document.getElementById('name');
    var email = document.getElementById('email');
    var comment = document.getElementById('comment');
    hideLink();
    var max = 1000;
    if(comment.value.length > max)
    {
        alert('Your comment is to long ('+comment.value.length+' characters). Please shorten it to less than '+max+' characters.');
        return 1;
    }
    if(!comment.value.match(/^[a-zA-Z0-9\ _+\&\'\"\:\;\,\.\/\(\)\*\%\$\#\!\?\~\-\=\+]*$/))
    {
        alert('You must not use links or special characters in your post.');
        return 1;
    }
    submitting.innerHTML="Saving Comment. Please Wait...";
    submitting.style.visibility="visible";
    commentGrabber.open("POST","comment.php",false);
    commentGrabber.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    var data = "action=save&album="+chapter+"&photo="+imageFiles[currentImage]+"&name="+encodeURIComponent(name.value)+"&email="+encodeURIComponent(email.value)+"&comment="+encodeURIComponent(comment.value);
    commentGrabber.send(data);
    submitting.innerHTML = commentGrabber.responseText;
    
    setTimeout('saveFinish();',1000);
}
function cancelComment()
{
    var addcommentbox = document.getElementById('addcomment');
    addcommentbox.style.visibility="hidden";
}

function showLink()
{
    var pastebox = document.getElementById('pastebox');
    var pastelink = document.getElementById('pastelink');
    pastebox.style.visibility = 'visible';
    pastelink.value = 'http://dk.discoveringhistreasures.com/photo/album.php?album='+chapter+'&photo='+imageFiles[currentImage];
    pastelink.focus();
    selectLink();
}

function hideLink()
{
    var pastebox = document.getElementById('pastebox');
    pastebox.style.visibility = 'hidden';
}

function selectLink()
{
    var pastelink = document.getElementById('pastelink');
    pastelink.select();
}

var currentImage = false;
window.onresize=checkImage;
document.onkeydown=checkkeys;

function checkkeys(e)
{
    var key = getKeyCode(e);
    var pagegrey = document.getElementById('pagegrey');
    if(pagegrey.style.visibility=="hidden")
    {
       return e;
    }
    if(key == 27)
    {
        hideImage();
    }
    else if(key == 37)
    {
        if(currentImage > 0)
        {
            showImage(imageFiles[currentImage-1]);
        }
        return false;
    }
    else if(key == 39)
    {
        if(currentImage < imageFiles.length - 1)
        {
            showImage(imageFiles[currentImage+1]);
        }
        return false;
    }
    return e;
 
}