/**
 * Create modal box on top window
 * - jQuery needed
 * @author Razor (coyc00@gmail.com)
 */


function topmodalbox(url, width, height)
{
	var url = url;
	var width = width==undefined ? '500' : width;
	var height = height==undefined ? '500' : height;
	var obj1;
	var obj2;
	var body_css;

	var style = '\
		<div id="topmodalbox_style">\
			<style type="text/css">\
				#topmodalbox_overlay {\
					position:absolute;\
					z-index:9998;\
					top:0px;\
					left:0px;\
					width:100%;\
					height:100%;\
					background:#000;\
					opacity:0.6;\
					-khtml-opacity:0.6;\
					-moz-opacity:0.6;\
					filter:alpha(opacity=60);\
				}\
				#topmodalbox_box {\
					display:none;\
					position:absolute;\
					z-index:9999;\
					background:#fff;\
				}\
				#topmodalbox_box .head {\
					background:#d2d2d2;\
					padding:2px 10px 2px 10px;\
					text-align:right;\
				}\
				#topmodalbox_box .head a {\
					color:#000;\
					text-decoration:none;\
				}\
				#topmodalbox_box .body {\
					width:'+width+'px;\
					height:'+height+'px;\
					padding:10px;\
				}\
				#topmodalbox_box iframe {\
					border:0px;\
				}\
			</style>\
		</div>';

	var overlay = '<div id="topmodalbox_overlay"></div>';

	var box = '\
		<div id="topmodalbox_box">\
			<div class="head">\
				<a href="#close" onclick="return false;">&#215;</a>\
			</div>\
			<div class="body">\
				<iframe src="'+url+'" width="'+width+'" height="'+height+'" frameborder="0"></iframe>\
			</div>\
		</div>';




	var open = function() {
		// set body margin and padding to zero
		body_css = {
			'margin-top': jQuery('body', top.document).css('margin-top'),
			'margin-bottom': jQuery('body', top.document).css('margin-bottom'),
			'margin-left': jQuery('body', top.document).css('margin-left'),
			'margin-right': jQuery('body', top.document).css('margin-right'),
			'padding-top': jQuery('body', top.document).css('padding-top'),
			'padding-bottom': jQuery('body', top.document).css('padding-bottom'),
			'padding-left': jQuery('body', top.document).css('padding-left'),
			'padding-right': jQuery('body', top.document).css('padding-right')
		};
		jQuery('body', top.document).css('margin', '0px');
		jQuery('body', top.document).css('padding', '0px');

		// hide visible objects
		obj1 = jQuery('object:visible').hide();
		obj2 = jQuery('object:visible', top.document).hide();

		// add style
		jQuery('body', top.document).prepend(style);

		// show overlay
		jQuery('#topmodalbox_style', top.document).after(overlay);
		jQuery('#topmodalbox_overlay', top.document).bind("click", close);

		// show box
		jQuery('#topmodalbox_overlay', top.document).after(box);
		jQuery('#topmodalbox_box', top.document).fadeIn();
		jQuery('#topmodalbox_box .head a', top.document).bind("click", close);

		// positioning
		if (jQuery.browser.msie) {
			top.window.attachEvent('onresize', resize);
			top.window.attachEvent('onscroll', scroll);
		} else {
			top.window.onresize = resize;
			top.window.onscroll = scroll;
		}
		resize();
	}


	var close = function() {
		// remove topmodalbox elements
		jQuery('#topmodalbox_box, #topmodalbox_overlay, #topmodalbox_style', top.document).remove();

		// restore body CSS
		jQuery('body', top.document).css(body_css);

		// show objects
		obj1.show();
		obj2.show();
	}


	var resize = function() {
		jQuery('#topmodalbox_overlay', top.document).css({
			'width':jQuery(top.document).width()+'px',
			'height':jQuery(top.document).height()+'px'
		});
		box_pos();
	}


	var scroll = function() {
		jQuery('#topmodalbox_overlay', top.document).css({
			'top':jQuery(top.document).scrollTop()+'px',
			'left':jQuery(top.document).scrollLeft()+'px'
		});
		box_pos();
	}


	var box_pos = function() {
		jQuery('#topmodalbox_box', top.document).css({
			'margin-top':jQuery(top.document).scrollTop()+'px',
			'margin-left':parseInt(jQuery(top.document.body).width()/2 - width/2)+'px'
		});
	}



	// ----- CONSTRUCTOR:
	open();
}
