// this file contains various DHTML helper functions

Twi = { version:'1.0' };

Twi.dbgCount = 0;

// Print a debug message into a DIV with id 'dbg' (if it exists)
// - msg: the message to be printed
Twi.dbg = function(msg) {
	var d = Twi.el('dbg');
	if (d != null)
		d.innerHTML = (++this.dbgCount) + ': ' + msg + '<br/>' + d.innerHTML;
};

// Short for document.getElementById()
// - elId: the id of the element
Twi.el = function(elId) {
	return document.getElementById(elId);
};

// attach event handlers in a cross-browser way
// - ev: the name of the event for which to register a handler (without the 'on' prefix)
// - elm: the element (or its id) that raises the event
// - f: a function to be called when the event is raised
Twi.on = function(ev, elm, f) {
	elm = this.getEl(elm);
	if (elm == null) return;
	
	if (elm.addEventListener)
	{
		elm.addEventListener(ev, f, false);
	}
	else if (elm.attachEvent)
	{
		elm.attachEvent('on'+ev, f);
	}
};

// shows an element
// - elm: the element (or its id) to be shown
Twi.show = function(elm)
{
	elm = this.getEl(elm);
	if (elm == null) return;
	
	//this.dbg("show element('" + elm.id + "')");
	elm.style.visibility = "visible";
	elm.style.display = "block";
}

// hides an element
// - elm: the element (or its id) to be hidden
Twi.hide = function(elm)
{
	elm = this.getEl(elm);
	if (elm == null) return;
	
	//div.style.visibility = "collapse";
	elm.style.display = "none";
}

// toggles the visibility of an element
// - elm: the element (or its id) to be toggled
Twi.toggle = function(elm)
{
	elm = this.getEl(elm);
	if (elm == null) return;

	if (elm.style.display == "none")
		this.show(elm);
	else
		this.hide(elm);
}

// sets the position of an element
// - elm: the element (or its id) that should be positioned
// - t: top
// - l: left
// - w (optional): width
// - h (optional): height
Twi.setPosition = function(elm, t, l, w, h) {
	elm = this.getEl(elm);
	if (elm == null) return;
	elm.style.top = t + 'px';
	elm.style.left = l + 'px';
	if (typeof w != 'undefined') elm.style.width = w + 'px';
	if (typeof h != 'undefined') elm.style.height = h + 'px';
};

// scrolls the specified element (e.g. a DIV) to the top
// - elm: the element (or its id)
Twi.scrollTop = function(elm) {
	elm = this.getEl(elm);
	if (elm == null) return;
	elm.scrollTop = 0;
};

// scrolls the specified element (e.g. a DIV) to the bottom
// - elm: the element (or its id)
Twi.scrollBottom = function(elm) {
	elm = this.getEl(elm);
	if (elm == null) return;
	elm.scrollTop = elm.scrollHeight;
};

// gets the size of the current window
// ( based on http://www.howtocreate.co.uk/tutorials/javascript/browserwindow )
Twi.getWindowSize = function() {
	var size = {width: 1024, height: 768};
	if (typeof(window.innerWidth) == 'number') //Non-IE
	{
		size.width = window.innerWidth;
		size.height = window.innerHeight;
	}
	else if (document.documentElement && document.documentElement.clientHeight) //IE 6+ in 'standards compliant mode'
	{
		size.width = document.documentElement.clientWidth;
		size.height = document.documentElement.clientHeight;
	}
	else if (document.body && document.body.clientHeight) //IE 4 compatible
	{
		size.width = document.body.clientWidth;
		size.height = document.body.clientHeight;
	}
	return size;
}

/* ----------------------------------------------------------------------- */
// internals

Twi.getEl = function(elm) {
	if (typeof(elm) == 'string')
		return this.el(elm);
	else
		return elm;
};
/*Twi.on('readystatechanged', document, Twi.isReady);
Twi.on('load', document, Twi.isLoaded);

Twi.isReady = function() {
	this.dbg("it's ready");
};
Twi.isLoaded = function() {
	this.dbg("it's loaded");
};*/