// Get Dom specification
var W3CDOM = (document.createElement && document.getElementsByTagName);
// start nonuobtrusive javascript events
window.onload = init;
// clear eventcache to avoid memoryleaks
window.onunload=function(){EventCache.flush();};
// add this method to the document methods
document.getElementsByClassName=getElementsByClassName;
// init loaded
window.startmargin=4;
// for testing
if(document.domain == "www.frontendplace.nl") sHomeURL = "http://www.frontendplace.nl/";
else sHomeURL = "http://localhost/~ronjonk/site"


/**
* swap visibility
*/
function swapView(sEl1,sEl2){
	var oEl1=document.getElementById(sEl1);
	var oEl2=document.getElementById(sEl2);
	oEl2.className = oEl1.className;
	oEl1.className = (oEl2.className =='hide')?'show' :'hide';
	
}
/**
* unzoom full screen
*/
function closeBigImage(){
	swapView('bigImage_','container');
	document.getElementById('bigImage_').innerHTML = "<div class='loading'>Loading image ...</div>";
}
/**
* get a bigger image and zoom image to whole screen
*/
function setFullScreen(imgName){
	getImage(imgName,'bigImage_');
	swapView('bigImage_','container');
}
/**
* initialise the moving of the gallery scroller
*/
function galleryMove(obj,direction){
	obj.onmouseout = stopMoving;
	// when there is no wrapping of images the height of the center layer+borders is the same as the height of the gallerylist layer 
	var galleryList = document.getElementById("gallerylist_");
	var iMinHeight = galleryList.clientHeight;
	var iMovStep = - (6*direction);
	var iMovTimeout = 5;
	//if (direction!=-1) iMovStep=-iMovStep;
	// clear timeoutobject
	oGalleryTimeout = null;
	moveLayer(iMovStep,iMinHeight,iMovTimeout);
}
/**
* handle moving of the margin of the gallery scroller to left or right
*/
function moveLayer(iMovStep,iMinHeight,iMovTimeout){

	var movGallery = document.getElementById('gallery');
	var s = movGallery.style;
	var curMarg = (s.marginLeft.substr(0,s.marginLeft.length-2))*1;
	var iNewMargin = curMarg+iMovStep*1;
	var iNewMargin = (iNewMargin < window.startmargin)? iNewMargin : window.startmargin;
	//stop scrolling when the left margin is 10 and the displayed height has reached the minheight
	if( (iMovStep <= window.startmargin && movGallery.parentNode.scrollHeight > iMinHeight) || (iMovStep > window.startmargin && iNewMargin <= 12) ) {
		s.marginLeft = iNewMargin + 'px';
		oGalleryTimeout = setTimeout("moveLayer("+iMovStep+","+iMinHeight+","+iMovTimeout+");",iMovTimeout);
		return;
	}
	else stopMoving();
}
/**
* stop scrolling the gallery scroller
*/
function stopMoving(){
	if (oGalleryTimeout) {clearTimeout(oGalleryTimeout);oGalleryTimeout=null;}
}
/**
* redirect to homepage
*/
function goHome(){
	window.location.replace(sHomeURL);
}
/**
* get one image width AJAX
*/
function getImage(imgName,targetID,obj){
	// only when in the first row
	if (obj && obj.offsetTop >80) return false;
	
	if (imgName && ajax){
		getMyHTML(sHomeURL+'/includes/image.php?image='+imgName,targetID);
	}
	return false;
}
/**
* get gallery images table
*/
function getGallery(targetID){
	if (ajax){
		getMyHTML(sHomeURL+'/includes/gallery.php',targetID);
	}
	return false;
}
/**
* open and close gallery layer
*/
function toggleGallery(){
	if(!document.getElementById('gallerytable')){
 		getGallery('gallery2');
	}
	swapView('gallery1','gallery2');
	var btn=document.getElementById('toolbarbtn_');
	btn.className = (btn.className =='toolbarup')?'toolbardown' :'toolbarup';
}
/**
* AJAX getting image behind the scenes
*/
function getMyHTML(serverPage,objID) { 
	var obj = document.getElementById(objID); 
	var content = document.getElementById('container');
  	ajax.open("GET", serverPage);
  	// create respons function 
  	ajax.onreadystatechange = function() { 
    if (ajax.readyState == 4 && ajax.status == 200) { 
      	obj.innerHTML = ajax.responseText; 
		
	} 
  } 
  ajax.send(null); 
} 

function init(){
	
	if(document.getElementById("gallery")) document.getElementById("gallery").style.marginLeft = window.startmargin+'px';
	// AJAX
	ajax=false; 
	/*@cc_on @*/ 
	/*@if (@_jscript_version >= 5) 
	try { 
	ajax = new ActiveXObject("MsXML2.XMLHTTP"); 
	} catch (e) { 
	try { 
	ajax = new ActiveXObject("Microsoft.XMLHTTP"); 
	} catch (E) { 
	ajax = false; 
	} 
	} 
	@end @*/ 
	if (!ajax && typeof XMLHttpRequest!= "undefined") { 
		ajax = new XMLHttpRequest(); 
	} 
	// add sound to menu buttons
	bindBehavior("mainmenu", "a", "bh_sound", menusound, null, null, null, null);
}
function menusound(){
	DHTMLSound('menu.wav')
}

function DHTMLSound(surl) {
  document.getElementById("soundspan").innerHTML=
    "<embed src='"+surl+"' hidden='true' autostart='true' loop='false' width='0' height='0'>";

}

//*** function for binding behavior on HTML elements ***/
//    tags          : array of tag names or space separated string of tag names
function bindBehavior(sContainerId, tags, sClassName, fnclick, fnfocus, fnblur, fnmouseover, fnkeydown, fnkeyup, fnselect) {
	var oContainer = document.getElementById(sContainerId);
	if (oContainer == null)
		return;

	if (!isArray(tags))
		tags = tags.split();

	for (q = 0; q < tags.length; q++) { 
		var aoElements = oContainer.getElementsByTagName(tags[q]);
		
		for (var i = 0; i < aoElements.length; i++) {
			var oElement = aoElements[i];
			if ( isClassInElement(oElement, sClassName) ) {
				if (fnclick) {oElement.onclick = fnclick;EventCache.add(oElement, "onclick", fnclick, true);}
				if (fnfocus) {oElement.onfocus = fnfocus;EventCache.add(oElement, "onfocus", fnfocus, true);}
				if (fnblur) {oElement.onblur = fnblur;EventCache.add(oElement, "onblur", fnblur, true);}
				if (fnmouseover) {oElement.onmouseover = fnmouseover;EventCache.add(oElement, "onmouseover", fnmouseover, true);}
				if (fnkeyup) {oElement.onkeyup = fnkeyup;EventCache.add(oElement, "onkeyup", fnkeyup, true);}
				if (fnkeydown) {oElement.onkeydown = fnkeydown;EventCache.add(oElement, "onkeydown", fnkeydown, true);}
				if (fnselect) {oElement.onselect = fnselect;EventCache.add(oElement, "onselect", fnselect, true);}
			}
		}
	}
}
function isArray(a) {
	return isObject(a) && a.constructor == Array;
}

function isObject(a) {
	return (a && typeof a == 'object') || isFunction(a);
}

function isFunction(a) {
	return (typeof a == 'function');
}
/*  ------------------------------------------------------------------
	This function checks if a class is in a specified element
	Note: it replaces the 'check' option of the function cssjs
*/
function isClassInElement(oElement, sClassName) {
	return new RegExp('\\b'+sClassName+'\\b').test(oElement.className)
}

function removeClassFromElement(oElement, sClassName) {
	var oPattern = oElement.className.match(' '+sClassName) ? (' ' + sClassName) : sClassName;
	oElement.className = oElement.className.replace(oPattern,'');
}
function getElementsByClassName(sClassName, oNode) {
	var aoFoundElements = new Array();
	if (oNode == null) 
		oNode = document;

	var aoAllChildElements = oNode.all;

	var oPattern = new RegExp('\\b'+sClassName+'\\b');

	for (var i = 0, j = aoAllChildElements.length; i < j; i++) {
		if (oPattern.test(aoAllChildElements[i].className)) 
			aoFoundElements.push(aoAllChildElements[i]);
	}
	return aoFoundElements;
}


/*	Event Cache uses an anonymous function to create a hidden scope chain.
	This is to prevent scoping issues. */
var EventCache = function() {
	var listEvents = [];
	
	return {
		listEvents : listEvents,
	
		add : function(oNode, sEventName, fHandler, bCapture) {
			listEvents.push(arguments);
		},
	

		flush : function() {
			var i, item;
			for(i = listEvents.length - 1; i >= 0; i = i - 1) {
				item = listEvents[i];
				
				if (item[0].removeEventListener) {
					item[0].removeEventListener(item[1], item[2], item[3]);
				}
				
				/* From this point on we need the event names to be prefixed with 'on" */
				if (item[1].substring(0, 2) != "on") {
					item[1] = "on" + item[1];
				}
				
				if (item[0].detachEvent) {
					item[0].detachEvent(item[1], item[2]);
				}
				
				item[0][item[1]] = null;
			}
		}
	}
}();