/*
	window.js needs window.css
	Π2009 | WDS New Media GmbH
	Pascal Vorsmann
	
	Version 1.0 2010-01-25
	
	pascal´s kleine Windows Klasse zum Erstellen eines kleinen dynamischen Fensters mit folgenden features:
	- variable Größe
	- Overlay im Hintergrund
	- Dragable
	- mehrere Instanzen
	
*/
var global_depth=0;
var global_id = new Array();
var mydrag = new Array();
var MXcord = null;
var MYcord = null;
Event.observe(document, 'click', recordCoordinates);
	  
// Callback function to handle the event.
function recordCoordinates(event) {
  MXcord = Event.pointerX(event);
  MYcord = Event.pointerY(event);
}

// Funktion zum ermitteln der Fenstergdimension für Overlays etc
function getPageDimensions() {
		var pageDimensions =[];
		var xScroll, yScroll;
		if (window.innerHeight && window.scrollMaxY) {	
			xScroll = document.body.scrollWidth;
			yScroll = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){ 
			xScroll = document.body.scrollWidth;
			yScroll = document.body.scrollHeight;
		} else { 
			xScroll = document.body.offsetWidth;
			yScroll = document.body.offsetHeight;
		}

		var windowWidth, windowHeight;
		if (self.innerHeight) {	
			windowWidth = self.innerWidth;
			windowHeight = self.innerHeight;
		} else if (document.documentElement && document.documentElement.clientHeight) { 
			windowWidth = document.documentElement.clientWidth;
			windowHeight = document.documentElement.clientHeight;
		} else if (document.body) { 
			windowWidth = document.body.clientWidth;
			windowHeight = document.body.clientHeight;
		}	
		
		if(yScroll < windowHeight){
			pageDimensions['height'] = windowHeight;
		} else { 
			pageDimensions['height'] = yScroll;
		}

		if(xScroll < windowWidth){	
			pageDimensions['width'] = windowWidth;
		} else {
			pageDimensions['width'] = xScroll;
		}
		return pageDimensions;
	}
	
// Funktion um Keytasten abzufangen 
function monitorKeyboard() {
	document.onkeydown = eventKeypress.bind(this); 
}
// Funktion um auf ESC (27) zu reagieren
function eventKeypress(e){
	if (e == null) {
		var keycode = event.keyCode;
	} else {
		var keycode = e.which;
	}
	switch (keycode) { 
		case 27: 
			par = (global_id.length)-1;
			if(global_id[par]){
				//alert("My ID: "+global_id[par]);
				HideWindow(global_id[par]);
			}
		break;
	}
}	

// Funktion für die nächste freie Ebene 
function getNextHighestDepth(){
	global_depth+=10;
	return global_depth;
}

// Function zum Generieren eines Fensters
function ShowWindow(w,h,url){
	// Fenstergröße ermitteln für Overlay
	pageDimensions = getPageDimensions();
	// Nächste freie Ebene bestimmen
	depth = getNextHighestDepth();
	global_id.push(depth);
	// Dummy-Code
	window_code = '<div id="zoom">'+
					'<table cellpadding="0" cellspacing="0" style="border:0px; width: 100%; height: 100%;" id="zoom_table">'+
						'<tbody>'+
							'<tr>'+
								'<td id="ol_'+depth+'" class="ol"></td>'+
								'<td id="om_'+depth+'" class="om drag"></td>'+
								'<td id="or_'+depth+'" class="or"></td>'+
							'</tr>'+
							'<tr>'+
								'<td id="ml_'+depth+'" class="ml"></td>'+
								'<td id="mm_'+depth+'" class="mm">'+
									'<div id="zoom_content">'+
										'<iframe id="iframe_'+depth+'" name="iframe_'+depth+'" src="about:blank" width="100%" height="100%" frameborder="0" marginwidth="0" marginheight="0" scrolling="auto" allowtransparency="true"></iframe>'+
									'</div>'+
				                '</td>'+
								'<td id="mr_'+depth+'" class="mr"></td>'+
							'</tr>'+
							'<tr>'+
								'<td id="ul_'+depth+'" class="ul"></td>'+
								'<td id="um_'+depth+'" class="um"></td>'+
								'<td id="ur_'+depth+'" class="ur"></td>'+
							'</tr>'+
						'</tbody>'+
					'</table>'+
					'<a style="position: absolute; top: 0pt; left: 0pt;" id="zoom_close" title="Close" href="JavaScript:;" OnClick="HideWindow(\''+depth+'\'); return false;">'+
						'<img style="border: medium none ; margin: 0pt; padding: 0pt;" alt="Close" src="images/fancy/closebox.png">'+
					'</a>'+
				'</div>';
	// Window
	win = document.createElement('div');
	win.setAttribute('id', 'mywindow'+depth);
	//win.setAttribute((document.all ? 'className' : 'class'), 'mywindow');
	win.innerHTML = window_code;
	
	// Window In Seite nach Body einsetzen
	var body = document.getElementsByTagName('body')[0];
	body.appendChild(win);
	
	// AB HIER KÖNNEN DANN ELEMENTE ÜBER DAS DOM ERGO PROTOTYPE ANGESPROCHEN WERDEN

	// Zindex für Overlay und Fenster
	zindexwin	= 1000+depth;
	zindexover	= 1000+(depth-1);
	// Overlay auf 100% höhe bringen
	$('myoverlay').setStyle({ 'display':'block', 'top':'0px', 'left':'0px', 'position':'absolute', 'height': pageDimensions['height']+'px', 'zIndex':zindexover });
	var hw = w/2;
	if(MYcord){
		var hh = MYcord-(parseInt(h)+80);
		$('mywindow'+depth).setStyle({ 'position':'absolute', 'display': 'none', 'width':w+'px', 'height':h+'px', 'top':+hh+'px', 'left':'50%', 'marginLeft':'-'+hw+'px', 'zIndex':zindexwin}); 
	}else{
		var hh = h/2;
		$('mywindow'+depth).setStyle({ 'position':'absolute', 'display': 'none', 'width':w+'px', 'height':h+'px', 'top':'50%', 'marginTop':'-'+hh+'px', 'left':'50%', 'marginLeft':'-'+hw+'px', 'zIndex':zindexwin}); 
	}
	//$('mywindow'+depth).setStyle({ 'position':'absolute', 'display': 'none', 'width':w+'px', 'height':h+'px', 'top':'50%', 'marginTop':'-'+hh+'px', 'left':'50%', 'marginLeft':'-'+hw+'px', 'zIndex':zindexwin}); 
	$('mywindow'+depth).appear({ from: 0.0, to: 1.0, duration: 1.0 });
	
	mydrag[depth] = new Draggable('mywindow'+depth, { handle: 'om_'+depth });

	// Iframe höhe Berechnen!
	iframeh = h-($('ol_'+depth).getHeight()+$('ul_'+depth).getHeight());
	iframew = w-($('ol_'+depth).getHeight()+$('ul_'+depth).getHeight());
	$('iframe_'+depth).setStyle({'height':iframeh+'px'});
		
	// URL im Fenster laden!
	$('iframe_'+depth).src=url+'&depth='+depth;
	
	// Abbruch per ESC starten
	monitorKeyboard();
}
function HideWindow(depth){
	// Prüfen nach Anzahl und ggf. Overlay stehen lassen und fenster nur löschen wenn es keines gibt das übergeordnet ist getNextHighestDepth-1>depth
	// Fenster und Overlay löschen
	$('zoom_content').innerHTML='';
	mydrag[depth].destroy();
	Element.remove($('mywindow'+depth));
	$('myoverlay').setStyle({ 'display':'none'});
	global_depth-=10;
	global_id.pop();
}