//get the height of the browser window
function getWindowHeight() {
if (parseInt(navigator.appVersion)>3) {
	 if (navigator.appName=="Netscape") {
	  winW = window.innerWidth;
	  winH = window.innerHeight;
	  topFind = window.pageYOffset;
	 
	 }
	 if (navigator.appName.indexOf("Microsoft")!=-1) {
	  winW = document.body.offsetWidth;
	  winH = document.body.offsetHeight;
	  topFind = document.body.scrollTop
	 
	 }
	 else {
		  winW = window.innerWidth;
	  winH = window.innerHeight;
	  topFind = window.pageYOffset; 
		 
		 
	 }
	}
	var positionW = winW % 2;
}

//declare top object z-index
var topObj = new Object();
topObj.zIndex = 0;
 
//define box



function declare(folder, title, numberOf){
	//create myBox and place elements

					contentBody = document.getElementById('content_body');
					contentBody.appendChild(box = document.createElement('div'));
					box.id = 'myBox' + folder;
					box.className = "mainBoxStyle";
					box.style.width = '0px';
					box.style.height = '0px';
					box.onmousedown = topLayer;
					
					//z-index of new box
					box.style.zIndex = ++dragObj.zIndex;
				 
					//create rest of elements
					
					
					box.appendChild(boxHead = document.createElement('div'));
					boxHead.id = 'boxHeader';
					boxHead.onmousedown = dragStart;
					
					
					boxHead.appendChild(closeLink = document.createElement('a'));
					closeLink.href = "javascript:closeBox(\'" + folder + "\')";
					
					closeLink.appendChild(xImg = document.createElement('img'));
					xImg.src = 'images/x_img.jpg';
					
					box.appendChild(bbody = document.createElement('div'));
					bbody.id = 'boxBody';
					bbody.style.visibility = 'hidden';
					bbody.onmousedown = topLayerbbody;
 					 
	
	
				
	//image  frame neccessary for IE6 and 7
					frame = document.createElement('div');
					frame.className = "slide-image-frame";
	
	//create main img
					mainImg = document.createElement('img');
					mainImg.id = "mainImg" + folder;
					mainImg.src = folder + "\/1.jpg";
					mainImg.className = "slideMainImg";
					mainImg.name = "mainimage";
					mainImg.setAttribute('name','mainimage');
					frame.appendChild(mainImg);
					bbody.appendChild(frame);
					mainImg.onmousedown = topLayerMainImg;
					 
					 //create title
					slideTitle = document.createElement('p');
					slideTitle.id = "slidetitle"; 
					slideTitle.appendChild(titleText = document.createTextNode(title));
					slideTitle.className = 'slideH4';
					bbody.appendChild(slideTitle);
					
					
					//break
					bbody.appendChild(breaker = document.createElement('br'));
					breaker.id = "breakB";
					
					bbody.appendChild(breaker = document.createElement('br'));
					breaker.id = "breakBB";
					
				 for (i = 1; i <= numberOf; i++) {
					//create link
					newlink = document.createElement('a');
					newlink.className = "slideThumb";
					newlink.onmousedown = topLayerNewLink;
					SI = i + "slideId";
					newlink.id = SI;
					slideNumber = numberOf;
					//create img
					newimg = document.createElement('img');
					thumbImgFolder = folder + "\/"+ i + ".jpg";
					newimg.src = thumbImgFolder;
					newlink.appendChild(newimg);
					 

					//add img link to box
					bbody.appendChild(newlink);
					newlink.href = "javascript:changeImage(\'" + folder + "\/" + i + ".jpg\' , \'mainImg" + folder + "\')"; 
				 }
 	 
					
				start();
					
}

//begin horizontal animation init vertical
function start() {
				
				getWindowHeight();
				box.style.left = winW / 2 - 350 + 'px';
				box.style.top =  topFind + 40 + "px";
				box.style.visibility = "visible"
				if (parseInt(box.style.width) < 610) {
				box.style.width = parseInt(box.style.width) + 305 + "px";
				setTimeout(start , 1)
				}else {
				heightGrow()
				}
			
			
			//vertical animation
			function heightGrow() {
				 
				if (parseInt(box.style.height) < 508) {
				box.style.height = parseInt(box.style.height) + 254 + "px";
				setTimeout(heightGrow , 1)
				}else {
				showWork()
				}
			}
			
			function showWork() {
					bbody.style.visibility = 'visible';

			}
}
function changeImage(filename , imgName)
{
	document.getElementById(imgName).src = filename;
}


function closeBox(closeThis) {
contentBody.removeChild(document.getElementById("myBox" + closeThis));
}



function Browser() {

  var ua, s, i;

  this.isIE    = false;
  this.isNS    = false;
  this.version = null;

  ua = navigator.userAgent;

  s = "MSIE";
  if ((i = ua.indexOf(s)) >= 0) {
    this.isIE = true;
    this.version = parseFloat(ua.substr(i + s.length));
    return;
  }

  s = "Netscape6/";
  if ((i = ua.indexOf(s)) >= 0) {
    this.isNS = true;
    this.version = parseFloat(ua.substr(i + s.length));
    return;
  }

  // Treat any other "Gecko" browser as NS 6.1.

  s = "Gecko";
  if ((i = ua.indexOf(s)) >= 0) {
    this.isNS = true;
    this.version = 6.1;
    return;
  }
  
  
}

var browser = new Browser();

// Global object to hold drag information.

var dragObj = new Object();
dragObj.zIndex = 0;

function dragStart(event, id) {
	
	 

  var el;
  var x, y;

 
    if (browser.isIE)
     { dragObj.elNode = window.event.srcElement.parentNode;}
    if (browser.isNS)
      {dragObj.elNode = event.target.parentNode;}

   
  // Get cursor position with respect to the page.

  if (browser.isIE) {
    x = window.event.clientX + document.documentElement.scrollLeft
      + document.body.scrollLeft;
    y = window.event.clientY + document.documentElement.scrollTop
      + document.body.scrollTop;
  }
  if (browser.isNS) {
    x = event.clientX + window.scrollX;
    y = event.clientY + window.scrollY;
  }

  // Save starting positions of cursor and element.

  dragObj.cursorStartX = x;
  dragObj.cursorStartY = y;
  dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
  dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);

  if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
  if (isNaN(dragObj.elStartTop))  dragObj.elStartTop  = 0;

  // Update element's z-index.

  dragObj.elNode.style.zIndex = ++dragObj.zIndex;

  // Capture mousemove and mouseup events on the page.

  if (browser.isIE) {
    document.attachEvent("onmousemove", dragGo);
    document.attachEvent("onmouseup",   dragStop);
    window.event.cancelBubble = true;
    window.event.returnValue = false;
  }
  if (browser.isNS) {
    document.addEventListener("mousemove", dragGo,   true);
    document.addEventListener("mouseup",   dragStop, true);
    event.preventDefault();
  }
}

function dragGo(event) {

  var x, y;

  // Get cursor position with respect to the page.

  if (browser.isIE) {
    x = window.event.clientX + document.documentElement.scrollLeft
      + document.body.scrollLeft;
    y = window.event.clientY + document.documentElement.scrollTop
      + document.body.scrollTop;
  }
  if (browser.isNS) {
    x = event.clientX + window.scrollX;
    y = event.clientY + window.scrollY;
  }

  // Move drag element by the same amount the cursor has moved.

  dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
  dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";

  if (browser.isIE) {
    window.event.cancelBubble = true;
    window.event.returnValue = false;
  }
  if (browser.isNS)
    event.preventDefault();
}

function dragStop(event) {

  // Stop capturing mousemove and mouseup events.

  if (browser.isIE) {
    document.detachEvent("onmousemove", dragGo);
    document.detachEvent("onmouseup",   dragStop);
  }
  if (browser.isNS) {
    document.removeEventListener("mousemove", dragGo,   true);
    document.removeEventListener("mouseup",   dragStop, true);
  }
}



function topLayer(event, id) {
	 if (browser.isIE)
      topObj.elNode = window.event.srcElement;
    if (browser.isNS)
      topObj.elNode = event.target;
	  
	  topObj.elNode.style.zIndex = ++dragObj.zIndex;
	
}

function topLayerMainImg(event, id) {
 if (browser.isIE)
    {  topObj.elNode = window.event.srcElement.parentNode.parentNode.parentNode;}
    if (browser.isNS)
    {  topObj.elNode = event.target.parentNode.parentNode.parentNode;}
	    
	topObj.elNode.style.zIndex = ++dragObj.zIndex;
	
}

function topLayerbbody(event, id) {
 if (browser.isIE)
     { topObj.elNode = window.event.srcElement.parentNode;}
    if (browser.isNS)
     { topObj.elNode = event.target.parentNode;}
	    
	topObj.elNode.style.zIndex = ++dragObj.zIndex;
	
}
function topLayerNewLink(event, id) {
 if (browser.isIE)
    {  topObj.elNode = window.event.srcElement.parentNode.parentNode.parentNode;}
    if (browser.isNS)
    {  topObj.elNode = event.target.parentNode.parentNode.parentNode;}
	    
	topObj.elNode.style.zIndex = ++dragObj.zIndex;
	
}