Ext.namespace('core', 'core.Window');

core.Window=Ext.extend(Ext.util.Observable, {
	constructor:function(config){
		this.id =  Ext.id();
		this.url = '';
		this.template='<table style="margin: 0px; padding: 0px;" width="100%" cellpadding="0" cellspacing="0">'+
		'<tbody><tr style="margin: 0px; padding: 0px;">'+
		'<td style="border: 1px solid rgb(92, 92, 92); margin: 0px; padding: 0px; background-color: rgb(255, 255, 255);" valign="top">'+
		'<table style="margin: 0px; padding: 0px;" width="100%" cellpadding="0" cellspacing="0">'+
		'<tbody><tr><td>'+
		'<span style="font-family:Arial; font-size:13px;	font-weight:bold; color:#768084; padding-left:25px; padding-top:12px; position:absolute; display:block;">{title}</span>'+
		'<span class="box-close" style="padding-right: 15px; padding-top: 12px;">'+
		'<a href="" onclick="return false;" id="close-window-{id}">Закрыть</a></span>'+
		'</td></tr></tbody></table>'+
		'<div id="box-content" style="height:{height}px">{body}</div></td><td style="margin: 0px; padding: 0px; background-repeat: repeat-y; width: 3px; vertical-align: top;" valign="top" background="/core/images/ten3_2.gif"><img style="border: 0px solid black; padding: 0px; position: absolute; margin-top: 0px; margin-left: 0px; margin-right: 0px;" src="/core/images/ten3_1.gif" height="6" width="3" border="0"></td></tr><tr><td style="margin: 0pt; padding: 0pt; background-repeat: repeat-x; height: 4px;" background="/core/images/ten2_3.gif"><img style="margin: 0px; padding: 0px; float: left;" src="/core/images/ten1_3.gif" height="4" width="3" border="0"></td><td style="margin: 0pt; padding: 0pt;" valign="top" align="left"><img style="margin: 0px; padding: 0px; float: left;" src="/core/images/ten3_3.gif" height="4" width="3" border="0"></td></tr></tbody></table>';

		var default_config = {
			id: id,
			width:250,
			height:250,
			url:'',
			title: '',
			body: '11'
		}
		config = config || {};
		Ext.apply(this, config);
		core.Window.superclass.constructor.call(this, config);
		this.Tpl = new Ext.Template(this.template);
		this.Tpl.overwrite(this.Tpl, this);
		this.fireEvent('close', this);
		this.template = this.Tpl.innerHTML;



	},
	getViewSize: function() {
		return [Ext.lib.Dom.getViewWidth(), Ext.lib.Dom.getViewHeight()];
	},
	show: function()
	{
		if (!Ext.get(this.id))
		{
			var ScrollTop = document.body.scrollTop;
			if (ScrollTop == 0)
			{

				if (window.pageYOffset)

				ScrollTop = window.pageYOffset;

				else

				ScrollTop = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
			}

			var xx = ScrollTop;

			var avH = screen.availHeight;

			var avW = screen.availWidth;
			var top = (avH*2)/100;
			var left = (avW*2)/100;

			if (ScrollTop !=0)
			{

				var marTop ='margin-top:'+xx+'px;';

			}
			else
			{
				var marTop = "";
			}
			var du="";
			if (Ext.isIE)
			{
				var du = "margin-top:"+xx+"px;"
			}
			else
			{
				var du = 'top: '+top+'%;  '+marTop+'';
			}

			var config_window ={

				id:this.id,
				tag: 'div',

				style:'display: block; '+du+'  width: '+this.width+'px; height:'+this.height+'px; left: '+left+'%;',
				html: this.template,
				cls:'box'
			};

			Ext.DomHelper.append(document.body, config_window, true).fadeIn();

			if (this.url != '')
			{

				Ext.get('box-content').load({url:this.url});
			}

			var closebtn = Ext.fly('close-window-'+this.id);
			closebtn.on('click', this.close, this, {
				single: true,
				delay: 100,
				stopEvent : true
			});
			
		}

	},

	close:function(){
		if (Ext.get(this.id))
		{
			Ext.get(this.id).fadeOut({
				easing: 'easeOut',
				endOpacity: 0,
				duration: .5,
				callback:function(e){
					e.remove();
				}
			});
		}
		this.fireEvent('close', this);
	}

});