Ext.ns('App');
Ext.ns('App.window');

App.window.PopupWindow = Ext.extend(Ext.Window, {

    height : 650,
    width : 650,

	ratio: 0.9,

	fixedSize: true,	// Auto-scales the window to the browser viewport
	fixedWidth: false,	// Uses fixed with during autoscale
    modal : true,

    title: '',
	url: '',

	initComponent: function() {

		Ext.apply(this, {
			bodyCfg: {
				tag: 'iframe',
				src: this.url,
				style: 'border: 0 none'
			},

			maximizable: !this.fixedSize,
			minimizable: !this.fixedSize,
			draggable: !this.fixedSize,
			resizable: !this.fixedSize
		});

		if (this.fixedSize) {

			var doResize = function() {
				var pageWidth = Ext.getBody().getWidth();
				var pageHeight = Ext.getBody().getHeight();
				
				var width = this.fixedWidth ? this.width : (pageWidth * this.ratio);
				var height = pageHeight * this.ratio;

				this.setSize({
					width: width,
					height: height
				});

				this.setPagePosition(
					(pageWidth / 2) - (width / 2),
					(pageHeight / 2) - (height / 2)
				);

			};

			Ext.EventManager.onWindowResize(doResize, this);

			this.on('beforeshow', doResize);
		}

		App.window.PopupWindow.superclass.initComponent.apply(this, arguments);
	}

});