var Ajax = function() {
	
	var conc;
	var bytesLoaded;
	var bytesTotal;
	var query_running = false;
	var query_list = new Array();
	var query_ob = function(QueryString, CallBackFunc) {
		this.queryString = QueryString;
		this.callBackFunc = CallBackFunc;
	}
	
	queryCallBack = function() {
		if (conc.readyState == 4) {
			query_list[0].callBackFunc(conc.responseText);
			query_list.shift();
			if(query_list.length != 0) sendQuery(query_list[0].queryString);
			else query_running = false;
  		}
	}
	sendQuery = function(QueryString) {
		query_running = true;
		conc.open("GET", QueryString, true);
		conc.send(null);
	}
	
	return {
		connect : function() {
			if (window.XMLHttpRequest) conc = new XMLHttpRequest();
  			else if (window.ActiveXObject) conc = new ActiveXObject("Microsoft.XMLHTTP");
  			else alert("Your browser does not support XMLHTTP!");
			conc.onreadystatechange = queryCallBack;
		},
		
		query : function(QueryString, CallBackFunc) {
			query_list.push(new query_ob(QueryString, CallBackFunc));
			if(!query_running) sendQuery(QueryString);
		}
	}
}();

//Base functions, some can be removed later
function $(id) { return document.getElementById(id);}
function addOnloadEvent(fnc){
  	if ( typeof window.addEventListener != "undefined" ) window.addEventListener( "load", fnc, false );
  	else if ( typeof window.attachEvent != "undefined" ) window.attachEvent( "onload", fnc );
  	else if ( window.onload != null ) {
	  	var oldOnload = window.onload;
      	window.onload = function (e) {
        	oldOnload(e);
        	window[fnc]();
      	};
	} else window.onload = fnc;
}
function is_string(mixed_var){return (typeof(mixed_var) == 'string');}

var Effect = function() {
	
	return {
		fade : function(id, opacStart, opacEnd, millisec) { 
    //speed for each frame 
    var speed = Math.round(millisec / 100); 
    var timer = 0; 

    //determine the direction for the blending, if start and end are the same nothing happens 
    if(opacStart > opacEnd) { 
        for(i = opacStart; i >= opacEnd; i--) { 
            setTimeout("Effect.changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } else if(opacStart < opacEnd) { 
        for(i = opacStart; i <= opacEnd; i++) 
            { 
            setTimeout("Effect.changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } 
},
	changeOpac : function(opacity, id) { 
    var object = document.getElementById(id).style; 
    object.opacity = (opacity / 100); 
    object.MozOpacity = (opacity / 100); 
    object.KhtmlOpacity = (opacity / 100); 
    object.filter = "alpha(opacity=" + opacity + ")"; 
} 
	}
}();

var list = {
	sites : {
		hsm : {name:'HSM - York', url:'hsm.php', image:'inc/img/highSchoolMusicalIcon.png'}
	},
	
	games : {
		fourwaypips : {name:'Fourway pips', url:'fourwaypips.php', image:'inc/img/fourwaypipsLogo.png'}
	}
};

var selector = function() {
	var ob;
	var num = 0;
	var itemWidth = 112;
	
	var newMenuItem = function(obj) {
		num++;
		
		var txt = '';
		if(obj.url != '') txt += '<a href="#" onclick="main.query(\''+obj.url+'\', main.addNewScreen);">';
		txt += '<div class="item"';
		if(obj.image != '') txt += ' style="background:url('+obj.image+') center no-repeat #000000;"';
		txt += '>'+obj.name+'</div>';
		if(obj.url != '') txt += '</a>';
		
		ob.innerHTML += txt;
		ob.style.width = num * itemWidth + 'px';
	}
	var loopObject = function(obj) {
		for(var name in obj) {
			newMenuItem(obj[name]);
		}
	}
	
	return {
		init : function() { ob = $('selector');},
		add : function(selection) {
			selection = selection || 'all';
			switch(selection) {
				case 'sites':
					loopObject(list.sites);
				break;
				case 'games':
					loopObject(list.games);
				break;
				default:
					loopObject(list.sites);
					loopObject(list.games);
				break;
			}
		},
		clear : function() {ob.innerHTML = '';}
	}
}();

var Screen = function() {
	var base;
	var messageBox;
	
	return {
		width : 0,
		height : 0,
		
		init : function() { base = $('top'); Screen.resize();},
		resize : function() {Screen.width = document.body.clientWidth;Screen.height = document.body.clientHeight;},
		
		createMessageBox : function(text) {
			if(messageBox == null) {
				base.innerHTML += '<div id="messageBox"></div>';
				messageBox = $('messageBox');
			}
			messageBox.innerHTML += '<div class="topbar">Message Box<a href="#"><div class="close"></div></a></div>'+text+'</br>'+Screen.height;
			messageBox.style.left = ((Screen.width-200)/2)+'px';
			messageBox.style.top = ((Screen.height-200)/2)+'px';
		}
	}
}();

var main = function() {
	var ob;
	
	return {
		init : function() {ob = $('main');},
		
		addNewScreen : function(r) {ob.innerHTML = r;},
		clear : function() {ob.innerHTML = '';},
		displayLoading : function() {ob.innerHTML = '<div id="loading"></div>';},
		query : function(q,f) {
			this.displayLoading();
			Ajax.query(q,f);
		},
		hide : function() {
    		ob.style.opacity = (0 / 100); 
    		ob.MozOpacity = (0 / 100); 
   		 	ob.KhtmlOpacity = (0 / 100); 
    		ob.filter = "alpha(opacity=" + 0 + ")"; 
		},
		getOb : function() {return ob;}
	}
}();

function press_button_info() {
	main.query('info.php', main.addNewScreen);
}
function press_button_contact() {
	main.query('contact.php', main.addNewScreen);
}

addOnloadEvent(function() {
	Screen.init();
	main.init();
	selector.init();
	selector.add('all');
	Ajax.connect();
});