/***************************************************************

	script voor een inline floating notepad
	(c) 2004, E-Wise BV

***************************************************************/
/*
	globale variabelen
*/
var FLOATER_OFFSET_TOP = 0;
var FLOATER_TABHEIGHT = 68;
var FLOATER_TABWIDTH = 18;
var FLOATER_FRAMEHEIGHT = 500;
var FLOATER_FRAMEWIDTH = 285;
var FLOATER_INTERVAL = 20;			//--- kleiner == sneller
var FLOATER_DIRECTION = 1;			//--- -1 om de tab aan de rechterkant te zetten
var FLOATER_EASE = 6;						//--- 1 = direct, hoger is 'easier'

/*
	functie om de x positie van een object te vinden. als er geen obj is meegegeven
	gaat'ie er vanuit dat het een floaterObject is...
*/
floaterObject.prototype.findPosX = function(){
	var	obj = this.floater();
	var curleft = 0;
	if (obj.offsetParent){
		while (obj.offsetParent){
			curleft += obj.offsetLeft
			obj = obj.offsetParent;
		}
	}
	else if (obj.x){
		curleft += obj.x;
	}
	return curleft;
}

/*
	functie om de y positie van een object te vinden. als er geen obj is meegegeven
	gaat'ie er vanuit dat het een floaterObject is...
*/
floaterObject.prototype.findPosY = function(){
	var	obj = this.floater();
	var curtop = 0;
	if (obj.offsetParent){
		while (obj.offsetParent){
			curtop += obj.offsetTop
			obj = obj.offsetParent;
		}
	}
	else if (obj.y){
		curtop += obj.y;
	}
	return curtop;
}


/*
	functie wat er gebeurd als je op het object klikt
*/
floaterObject.prototype.openCloseClicked = function(){
	this.isOpen = (this.isOpen)?false:true;
	this.hresX = this.findPosX();
	if(FLOATER_DIRECTION<0){
		this.x = window.document.body.clientWidth - FLOATER_TABWIDTH - (this.isOpen?this.width:0);
	} else {
		this.x = (this.isOpen?0:this.width) * -1;
	}
	setTimeout("floaters[" + this.nr + "].easeTo()", FLOATER_INTERVAL);
}

/*
	scoll past de y aan
*/
floaterObject.prototype.scroll = function(){
	this.y = document.body.scrollTop + this.top;
	this.floater().style.top = this.y;
}

/*
	interval, moved de floater naar de nieuwe posities
*/
floaterObject.prototype.easeTo = function(){
	
	var nx = (this.x - this.hresX)/FLOATER_EASE;
	var ny = (this.findPosY() + this.y)/2;

	this.hresX += nx;
	
	this.hresX = (Math.abs(nx)<1/FLOATER_EASE)?this.x:this.hresX;
	this.moveTo(this.hresX, ny);
	
	// moeten we nog een te grote afstand?
	if(Math.abs(nx)>1/FLOATER_EASE){
		setTimeout("floaters[" + this.nr + "].easeTo()", FLOATER_INTERVAL);
	} 

	return (nx, ny);

}


/*
	moved het object naar x
*/
floaterObject.prototype.moveTo = function(x, y){
	this.floater().style.left=x;
	this.floater().style.top=y;
}

/*
	omdat we niet weten of we al gevonden zijn gaan we ipv via een property via een functie
*/
floaterObject.prototype.floater = function(){
	if(this._floater == null){
		try {
			this._floater = document.getElementById(this.id);
		}
		catch(e){
			//
		}
	}
	return this._floater;
}


/* 
	maakt een nieuw floater Object
*/
function floaterObject(id, nr, width){
	floaters[nr] = this;
	/*
		properties
	*/
	this.id = id;
	this.nr = nr;
	this.width = width;
	this.top = FLOATER_OFFSET_TOP + FLOATER_TABHEIGHT * nr;
	this.x = -1 * width;
	if(FLOATER_DIRECTION<0){
		this.x =	window.document.body.clientWidth - FLOATER_TABWIDTH;		
	}
	
	this.hresX = this.x;
	this.y = this.top;
	this.zIndex = 20000 + nr;
	this.isOpen = false;
	this._floater = null;
}


/*
	initialisatie, events etc.
*/

/*
	als je op het tabje klikt
*/
function clickFloater(nr){
	floaters[nr].openCloseClicked();
}

/*
	gebruik setTimeout voor mozilla event vertraging (scrolling loopt er 1 achter anders)
*/
function scrollTab(){
	for(var i=0;i<floaters.length;i++){
		setTimeout("floaters[" + i + "].scroll()", 200);
	}
}

/*
	als het window geresized wordt moeten we alle tabs even verplaatsen, mooiste is met easeTo
*/
function windowResize(){
	for(var i=0;i<floaters.length;i++){
		if(FLOATER_DIRECTION<0){
			floaters[i].x = window.document.body.clientWidth - FLOATER_TABWIDTH - (floaters[i].isOpen?floaters[i].width:0);
		} else {
			floaters[i].x = (floaters[i].isOpen?0:floaters[i].width) * -1;
		}
		floaters[i].easeTo();
	}
}


var floaters = [];

try {
	window.onscroll=scrollTab;
	window.onresize=windowResize;
	window.addEventListener('DOMMouseScroll', scrollTab, false);		//--- ns
}	
catch(e){
	//
}


/*
	aanroepen om de tabs te maken 
*/


function getFloaterHTML(id, url, tab, scrolling, width, height){

	scrolling = (scrolling==null)?"auto":scrolling;
	width = (width==null)?FLOATER_FRAMEWIDTH:width;
	height = (height==null)?FLOATER_FRAMEHEIGHT:height;
	
	var nr = floaters.length;
	if(floaters[nr]==null){
		floaters[nr] = new floaterObject(id, nr, width);
	}
	
	var t = FLOATER_OFFSET_TOP + FLOATER_TABHEIGHT * nr;
	var w = width + FLOATER_TABWIDTH;
	var l = -1 * width;
	var h = height;

	if(FLOATER_DIRECTION<0){
		l =	window.document.body.clientWidth - FLOATER_TABWIDTH;		
	}

	var html = '<table id="' + id + '" name="' + id + '" class="floatingTable" cellpadding="0" cellspacing="0" style="top:' + t + ';left:' + l + ';height:' + h + ';width:' + w + '">\n<tr>';
	
	var a = '<td class="floatingCell"><iframe id="floaterFrame" name="floaterFrame" src="' + url + '" class="floatingFrame" scrolling="' + scrolling + '" width="100%" height="100%" border="0"></iframe></td>\n';
	var b = '<td rowspan="4" valign="top" align="'+ (FLOATER_DIRECTION<0?"right":"left") + '"><img src="' + tab + '" class="floaterTab" onclick="return clickFloater(' + nr + ')" /></td>';
	
	if(FLOATER_DIRECTION<0){
		html += b + a;
	} else {
		html += a + b;
	}
	
	html += '</tr></table>';
	document.write(html);
	
	return html;
}