/* InterFriendship WomenBar
 * 
 * Mouseover-Effekt, der hinter Bilder gelegt werden kann, um dann 
 * die Frauenkarte einzublenden
 * 
 * Verwendung:
 * 
 * Im Header (z.B: per frame_head-assign im PHP-Script):
 * <script type="text/javascript" src="/js/womenbar.js"></script>
 * 
 * HTML-Aufbau:
 * <div id="{prefix_wcdiv}_{IFCode}" style="position: absolute; display: none">{womanCard ...}</div>
 * <div id="{BARDIVID}">
 * <a href="{nonJSURL}" rel="{IFCode}">
 * 	<img border="0" src="{BildURL}" />
 * </a>
 * </div>
 * 
 * Erläuterung:
 * - {BARDIVID}		Id für das umschließende DIV - wird im JavaScript-Aufruf
 * 					übergeben!
 * - {nonJSURL}		Eine URL, die nicht-JavaScript-User zum Frauenportrait 
 * 					führt
 * - {IFCode}		Der IF-Code der Frau muss im rel-Attribut des <a>-Tags 
 * 					angegeben werden.
 * - {BildURL}		URL zum Thumb-Bild, auf das der Mouserover-Effekt gelegt 
 * 					werden soll. 
 * - {prefix_wcdiv}	Präfix für die ID des Conatainers um jede Womancard. 
 * 
 * JavaScript-Initialisierung:
 * <script type="text/javascript">
 * var tmp = new IFWomenBar(WomanBarID, {options});
 * </script>
 * 
 * Erläuterung:
 * - WomanBarID		Auf der Seite eindeutige ID der Instanz (für mehrere WomenBars nötig)
 * 
 * options:
 * - barid			ID des DIVs, der die Bar umschlieest (s.o.). (Notwendig!)
 * - prefix_wcdiv	Präfix der IDs der DIVs um die WomanCards (s.o.). (Notwendig!)
 * - min_x			Minimum-Wert auf x-Achse. (Optional, Default: -9999)
 * - max_x			Maximum-Wert auf x-Achse. (Optional, Default: +9999)
 * - offset_x		Verschiebung auf x-Achse. (Optional, Default: 0)
 * - offset_y		Verschiebung auf y-Achse. (Optional, Default: 0)
 * - y				Zu verwendende y-Position. (Optional, Default: errechnet aus Position von $(barid))
 * 
 * Beispiele siehe member/index.tpl!
 * */

var IFwbInstances = new Hash();
var IFwbState = new Hash();
var IFwbTimer = new Hash();

function IFWBClosePopup(wbID, wcDivID, ifCode) {	
	if ( IFwbState.get(wbID).get(ifCode) == true) return;
	if ($(wcDivID)) $(wcDivID).hide();
}

function IFWBSetOpen(wbID) {
	elem = IFwbInstances.get( wbID );
	if (! elem) return;
	
	elem.setOpen();
}

var IFWomenBar = Class.create();
IFWomenBar.prototype = {
	initialize: function(wbID, opts) {
		this.opts = opts;
		this.wbID = wbID;
		
		if ( this.opts.y == undefined) {
			wbPos = $(this.opts.barid).cumulativeOffset();
			this.opts.y = wbPos.top;
		}
		
		if ( this.opts.min_x == undefined) this.opts.min_x = -99999;
		if ( this.opts.max_x == undefined) this.opts.max_x = 99999;
		if ( this.opts.offset_x == undefined) this.opts.offset_x = 0;
		if ( this.opts.offset_y == undefined) this.opts.offset_y = 0;
		
		IFwbInstances.set(wbID, this);
		IFwbState.set(wbID, new Hash());
		IFwbTimer.set(wbID, new Hash());
				
		this.eventMouseOver = this.mouseOverA.bindAsEventListener(this);
		this.eventMouseOut = this.mouseOutA.bindAsEventListener(this);
		this.registerEvents();
		this.openTimer = null;
		this.isOpen = false;
		this.lastElem = null;
	},
	registerEvents: function() {
		// Alle a im DIV ermitteln
		myArray = $$('#'+this.opts.barid+' a');
		
		bodyElem = document.getElementsByTagName("body");
		for (var index = 0, len = myArray.length; index < len; ++index) {
			var item = myArray[index];
			Event.observe(item, "mouseover", this.eventMouseOver);
			Event.observe(item, "mouseout", this.eventMouseOut);
			
			var ifCode = item.rel;			
			var wcDiv = $( this.opts.prefix_wcdiv + "_" + ifCode );
			if ( wcDiv == undefined ) continue;
			
			wcDiv.ifCode = ifCode;
			wbID = this.wbID;
			Event.observe(wcDiv, "mouseout", function(event) {
				wcDiv = event.findElement('div');
				while((! wcDiv.ifCode)) {
					if (! wcDiv) return;
					wcDiv = wcDiv.parentNode;
				};
				
				IFwbState.get(wbID).set(wcDiv.ifCode, false);
				IFwbTimer.get(wbID).set(wcDiv.id, 
						window.setTimeout("IFWBClosePopup('"+wbID+"', '"+wcDiv.id+"', '"+wcDiv.ifCode+"')", 250)
					);
			});
			Event.observe(wcDiv, "mouseover", function(event) {
				wcDiv = event.findElement('div');
				while((! wcDiv.ifCode)) {
					if (! wcDiv) return;
					wcDiv = wcDiv.parentNode;
				};
				
				IFWBSetOpen(wbID);
				IFwbState.get(wbID).set(wcDiv.ifCode, true);
				tmp = IFwbTimer.get(wbID).get(wcDiv.id);
				if ( tmp != undefined ) {
					window.clearTimeout(tmp);
					IFwbTimer.get(wbID).unset(wcDiv.id);
				}
			});			
		}
	},
	
	setOpen: function() {
		this.clearOpenCloseTimers();
		if ( this.isOpen != true ) {
			this.isOpen = true;
			this.doOpen(this.lastElem);
		}
	},
	
	clearOpenCloseTimers: function() {
		if ( this.openTimer != null ) {
			window.clearTimeout(this.openTimer);
			this.openTimer = null;
		}		
	},	
	
	mouseOutA:  function(event) {
		this.clearOpenCloseTimers();
	},
	
	mouseOverA: function(event) {
		this.lastElem = event.findElement('a');
		
		if ( this.isOpen == false ) {
			if ( this.openTimer == null ) {
				// Timer noch nicht gesetzt
				// --> Timer setzen
				this.openTimer = window.setTimeout('IFWBSetOpen("'+this.wbID+'")', 500);
			}
			return;
		}
		
		this.doOpen(this.lastElem);
	},
	doOpen: function(elem) {
		if (! elem) return;
		if (elem == null) return;
		if (! elem.rel) return;
		
		var ifCode = elem.rel;
		
		var wcDiv = $( this.opts.prefix_wcdiv + "_" + ifCode );
		if ( wcDiv == undefined ) return;
		
		IFwbState.get(this.wbID).set(ifCode, true);
		tmp = IFwbTimer.get(this.wbID).get(wcDiv.id);
		if ( tmp != undefined ) {
			window.clearTimeout(tmp);
			IFwbTimer.get(this.wbID).unset(wcDiv.id);
		}

		if ( wcDiv.visible() ) return;		

		// Alle anderen Schließen
		myOpts = this.opts;
		IFwbState.get(this.wbID).each(function(pair) {
			if ( pair.key != ifCode && pair.value == true )
				IFwbState.get(this.wbID).set(pair.key, false);
				IFWBClosePopup(this.wbID, myOpts.prefix_wcdiv + "_" + pair.key, pair.key);
		});
		
		var elemPos = elem.cumulativeOffset();
		
		var newL = elemPos.left + this.opts.offset_x;
		var newT = this.opts.y + this.opts.offset_y;
		newL = Math.max(newL, this.opts.min_x);
		newL = Math.min(newL, this.opts.max_x);
		
		$(wcDiv).setStyle({
			  "display" : ""
			, "left" : newL + "px"
			, "top" : newT + "px"
		});
	}
}