function freeze(color) {
	if (color == undefined) var color = '000';
	$('layer').setStyle("background-color:#"+color);
	$('layer').style.top = ($('container').viewportOffset().top+1) + "px";
	$('layer').style.left = ($('container').viewportOffset().left+1) + "px";
	$('layer').show();
}
function unfreeze() {
	$('layer').hide();
}
function showLoading(text) {
	$('loading').innerHTML = '<h2>' + text + '</h2>';
	$('loading').style.left = (screen.width/2)-50 +"px";
	$('loading').style.top = (screen.height/2)-120 +"px";
	$('loading').show();
}
function hideLoading() {
	$('loading').hide();
}
/**
 * submit a form the ajax way - makes use of the renderContent function
 * 
 * @param (string) form id
 */
function submitAjaxForm(form) {
	// we need to extract all form params
	try {
		var formValues = $(form).serialize();
	} catch(e) {
		alert(e.message);
	}
	// proceed to rendering content
	renderContent('index.php?'+formValues);
	// stop actual form submit process
	return false;
}
var renderContent = function(urlParam) {
	freeze();
	showLoading("loading...");
	new Ajax.Request('index.php', {
		method: 'post',
		parameters: { method:'ajax', urlQuery:urlParam },
		onException: function(request, exception) {
			$('container').innerHTML = '<h1>onException responder called</h1><span class="error">' + exception.name + '!<br />Error message: ' + exception.message + '<br /><br />URL: ' + urlParam + '</span>';
		},
		onFailure: function(response) {
			$('container').innerHTML = '<h1>onFailure responder called</h1><span class="error"><b>'+response.status+'</b> '+response.statusText+'</span>';
		},
		onSuccess: function(transport, json) {
			if (json == undefined) var json = Array();
			
			// first clean all script elements from html head
			cleanHead();
			
			// check for any javascript to be loaded before including header files
			loadJavascript(json['preload']);
			
			// load required js/css files
			if (json['files'] != undefined && json['files'].length > 0) {
				loadHeaderFiles(json['files']);
			}
			
			// render content in div container
			$('container').innerHTML = transport.responseText;
			$('container').show();
			
			// check for any javascript to be loaded after rendering content
			loadJavascript(json['onload']);
			
			// clean location search
			if (location.search.length > 0) {
				location.href = json['base_url']+'#'+json['query'];
			}
			
			// add history event
			dhtmlHistory.add(json['query'], json['query']);
			
			// set page title
			document.title = json['page_title'];
			
			// add google analytics page view
			try {
				pageTracker._trackPageview('#'+json['query']);
			} catch (err) {}
			
			unfreeze();
			hideLoading();
		}
	});
};
var renderImage = function(urlParam) {
	showLoading("loading...");
	new Ajax.Request('index.php', {
		method: 'post',
		parameters: { method:'ajax', urlQuery:urlParam },
		onException: function(request, exception) {
			$('container').innerHTML = '<h1>onException responder called</h1><span class="error">' + exception.name + '!<br />Error message: ' + exception.message + '<br /><br />URL: ' + urlParam + '</span>';
		},
		onFailure: function(response) {
			$('container').innerHTML = '<h1>onFailure responder called</h1><span class="error"><b>'+response.status+'</b> '+response.statusText+'</span>';
		},
		onSuccess: function(transport, json) {
			if (json == undefined) var json = Array();
			
			// first clean all script elements from html head
			cleanHead();
			
			// check for any javascript to be loaded before including header files
			loadJavascript(json['preload']);
			
			// load required js/css files
			if (json['files'] != undefined && json['files'].length > 0) {
				loadHeaderFiles(json['files']);
			}
			
			// render content in div container
			$('container').innerHTML = transport.responseText;
			$('container').show();
			
			// check for any javascript to be loaded after rendering content
			loadJavascript(json['onload']);
			
			// clean location search
			if (location.search.length > 0) {
				location.href = json['base_url']+'#'+json['query'];
			}
			
			// add history event
			dhtmlHistory.add(json['query'], json['query']);
			
			// set page title
			document.title = json['page_title'];
			
			// add google analytics page view
			try {
				pageTracker._trackPageview('#'+json['query']);
			} catch (err) {}
			
			hideLoading();
		}
	});
}
var slideshow;
var slideshow_started = false;
function startSlideshow(id) {
	renderImage('index.php?action=gallery&category='+category+'&id='+id);
	slideshow_started = true;
	// add google analytics page view
	try {
		pageTracker._trackPageview('#index.php?action=gallery&category='+category+'&id='+id+'&slideshow=on');
	} catch (err) {}
	slideshow = new PeriodicalExecuter(function(pe) {
		id++;
		if (id >= image_count) {
			id = 0;
		}
		renderImage('index.php?action=gallery&category='+category+'&id='+id+'&slideshow=on');
	  }, 5);
}
function stopSlideshow() {
	try {
		slideshow.stop();
	} catch (e) {
	}
	slideshow_started = false;
}
/**
 * dynamically load javascript or css files per javascript
 *
 * @params (array) filepath to js/css file
 */
var loadedobjects = "";
function loadHeaderFiles(files) {
	for (var i=0; i < files.length; i++) {
		var file = files[i];
		// Check to see if this object has not already been added to page before proceeding
		if (loadedobjects.indexOf(file[0]) == -1) { 
			if (file[0].indexOf(".js") != -1 || file[0].indexOf(".php") != -1) { 
				// object is a js file
				var fileref = document.createElement('script');
				fileref.setAttribute("type","text/javascript");
				fileref.setAttribute("src", file[0]);
			} else if (file[0].indexOf(".css") != -1) {
				// object is a css file
				var fileref = document.createElement("link")
				fileref.setAttribute("media", file[1]);
				fileref.setAttribute("type", "text/css");
				fileref.setAttribute("rel", "stylesheet");
				fileref.setAttribute("href", file[0]);
			}
		}
		if (fileref != undefined) {
			document.getElementsByTagName("head").item(0).appendChild(fileref);
			loadedobjects += file[0]+" " //Remember this object as being already added to page
		}
	}
}
/**
 * clean all script tags in html head
 */
function cleanHead() {
	var scriptTags = document.getElementsByTagName('script');
	for (var i=scriptTags.length-1; i>=0; i--) {
		if (scriptTags[i].getAttribute('src') == undefined || scriptTags[i].getAttribute('src') == null) {
			if (document.getElementsByTagName("head") != null && document.getElementsByTagName("head").length > 0) {
				scriptTags[i].remove();
			}
		}
	}
}

/**
 * load javascript in head tag
 * 
 * @param (string) javascript
 */
function loadJavascript(js) {
	if (js != undefined && js.length > 0) {
		var scriptTag = document.createElement('script');
		scriptTag.type = 'text/javascript';
		scriptTag.defer = 'defer';
		scriptTag.text = js;
		document.getElementsByTagName("head").item(0).appendChild(scriptTag);
	}
}
function loadImage(category, img) {
	freeze();
	showLoading('loading...');
	new Ajax.Request('index.php', {
		method: 'post',
		parameters: { method:'ajax', action:'image', category:category, img:img },
		onException: function(request, exception) {
			$('container').innerHTML = '<h1>onException responder called</h1><span class="error">' + exception.name + '!<br />Error message: ' + exception.message + '<br /><br />URL: ' + urlParam + '</span>';
		},
		onFailure: function(response) {
			$('container').innerHTML = '<h1>onFailure responder called</h1><span class="error"><b>'+response.status+'</b> '+response.statusText+'</span>';
		},
		onSuccess: function(transport, json) {
			hideLoading();
			$('image').innerHTML = transport.responseText;
			$('image').style.left = ($('container').viewportOffset().left+1) +"px";
			$('image').style.top = ($('container').viewportOffset().top+1) +"px";
			$('image').show();
		}
	});
}