/*site zIndex composition

60-70		= bubble
80			= Alpha black layer
90			= tools (cjack, etc)
94, 95, 96	= clownie (goodie, card, goodie)
100			= the header
105			= help
110			= popup windows

*/

	var g_ar_viewer = new Array();
	var gWidthBody = 1004;
	function openViewer(width, height, url, id, title,  extra_html){

		SetAlphaPanel(30);
		showSelect('hidden');


		if(extra_html == undefined)
			extra_html = '';


		var d =  gById(id);

		if(d == null){

			d = document.createElement("DIV");
			d.style.cssText = 'position:absolute;';
			d.id = id;
			d.style.zIndex = 110;

		}


		d.style.left = (WindowSize('width')-width)/2 + 'px'; //todo, half screen

		var top = (((WindowSize('height')-height)/2)+WindowScroll('top'));

		if(top < document.body.scrollTop)
			d.style.top = WindowScroll('top');
		else
			d.style.top  = top + 'px';

		d.style.border = '1px black solid';

		d.innerHTML =	'<table class="tableList" style="width:' + width + 'px;">' +
							'<tr class="head2">' +
								'<td style="text-align:left;">' + title + '</td>' +
								'<td style="text-align:right;"><a href="javascript:closeViewer(\'' + id + '\');">X</a></td>' +
							'</tr>' +
						'</table>' +
						'<iframe frameborder="0" style="width:' + width + 'px;height:' + height + 'px;" src=' + url +' ></iframe>' + 	
						extra_html;		

		document.body.appendChild(d);

		if( !g_ar_viewer.ar_find(id))
			g_ar_viewer[g_ar_viewer.length] = id;

	}



	function openViewer2(width, height, url, id, title,  extra_html){

		SetAlphaPanel(30);
		showSelect('hidden');

		if(extra_html == undefined)
			extra_html = '';

		var d =  gById(id);

		if(d == null){

			d = document.createElement("DIV");
			d.style.cssText = 'position:absolute;';
			d.id = id;
			d.style.zIndex = 110;

		}


		d.style.left = (WindowSize('width')-width)/2 + 'px'; //todo, half screen

		var top = (((WindowSize('height')-height)/2)+WindowScroll('top'));

		if(top < document.body.scrollTop)
			d.style.top = WindowScroll('top');
		else
			d.style.top  = top + 'px';


		d.style.width	= width  + 24 + 'px';



		//_L(title)
		//javascript:closeViewer(\'' + id + '\');
/*

	<div class="inside" style="width:' + width + ';height:' + height + ';">

*/


		d.innerHTML =	'<div class="top-left-2"></div><div class="top-right-2"></div><div class="inside-2">' +
						'<div class="notopgap BigTitle" style="text-align:left;">' + _L(title) + 
						'</div><div style="margin-bottom:10px;"  onclick="javascript:closeViewer(\'' + id + '\');" class="x_close">' +
						'x' +  
						'</div>' +
						'<iframe frameborder="0" style="width:' + width + 'px;height:' + height + 'px;" src=' + url +' ></iframe>' +
						 extra_html + 
						'</div><div class="bottom-left-2"></div><div class="bottom-right-2"></div>';			







		document.body.appendChild(d);



		if( !g_ar_viewer.ar_find(id))
			g_ar_viewer[g_ar_viewer.length] = id;

	}




	function closeViewer(id){

		g_ar_viewer.ar_remove(id);

		if(g_ar_viewer.length==0){
			SetAlphaPanel(0);
			showSelect('visible');
		}

		document.body.removeChild(gById(id));

	}