/*
 * zCool UI 0.3 - Javascript
 *
 * Copyright (c) 2008 zhou BaiMin (zCool.cn)
 * Dual licensed under the MIT (MIT-LICENSE.txt)
 * and GPL (GPL-LICENSE.txt) licenses.
 *
 * $Date: 2009-07-02 09:28:00 BeiJing $
 * $Revision: 30 $
 */
// @import zCool.js
// 扩展UI类
(function(window, $, undefined){
	
	var DOC = window.document,
	
	ROOT = DOC.documentElement,
	
	// 窗口对象构造器
    $UIWindow = $.UI.defined('Window', function(root, settings){
			
			$.UI.call(this, root, settings);
			
			// 设置窗口（坐标/大小等参数）
			this.open();
			
   	});
	
    // 扩展$UIWindow原型
    $.override($UIWindow.prototype, {
		
	defaultSettings: {
		
		method: '',
		
		// 窗口题头设置
		icoClass: 'icons-application',
		icoCss: '',
		titleText:  '新窗口',
		
		// 窗口控制区设置，主要包含控制按钮
		closeButtonEnable: true,
		maximizeButtonEnable: false,
		minimizeButtonEnable: false,
		
		// 窗口操作区设置，主要包含操作按钮
		confirmButtonEnable: false,
		cancelButtonEnable: false,
		
		// 是否遮罩页面
		maskEnable: true,
		
        // 打开窗口的源对象
		opener: null,
		
		// 是否包含一个page对象
		page: null,
		
		// 实例是否闲置
		free: true,
		
		// 窗口定位
		top: 'middle',
		left: 'center',
		
		// 窗口尺寸 16:9
//		width: 'auto',
//		height: 'auto',
		width: 320,
		height: 150,
		maxWidth: 2000,
		maxHeight: 1200,
		minWidth: 150,
		minHeight: 150,
		reduceWidth: null,
		reduceHeight: null,
		
		// 可拖拽窗口位置
		dragEnable: false,
		
		// 可改变窗口尺寸
		resizeEnable: false
		
	},
	
		methodsClass: 'Window-alert Window-confirm Window-dialog',
		
		// 设置窗口header
		setHeader: function(){
			
			if( !this.header ){
				this.header = this.createHeader();
				this.setDOMMemberByClass(this.header);
			}
			
			$( this.ico ).addClass( this.icoClass ).css( this.icoCss );
			$( this.title ).text( this.headerTitle.title = this.titleText );
			
			return this;
		},
		
		// 创建窗口header
		createHeader: function(){
			this.header = $(
				'<div class="Window-header">' +
					'<h1 class="Window-header-title ellipsis" title="新窗口">' + 
						'<i class="Window-ico icons"></i>' + 
						'<span class="Window-title">新窗口</span>' + 
					'</h1>' +
				'</div>'
			).appendTo( this.panelTc )[0];
			
			return this.header;
		},
		
		// 设置窗口footer
		setFooter: function(){
			
			if( !this.footer ){
				
				this.footer = this.createFooter();
				var names = this.setDOMMemberByClass(this.footer);
				this.setDOMMemberOn(names, ['click']);
			}
			
			names = ['confirmButton', 'cancelButton'];
				
			this.setDOMMemberEnable(names/*, 'none'*/);
			
			return this;
		},
		
		// 创建窗口footer
		createFooter: function(){
			this.footer = $(
				'<div class="Window-footer">' + 
					'<div class="Window-handler">' + 
						'<a class="w-button w-button30 Window-confirm-button">' + 
							'<i class="icons icons-accept"></i>' + 
							'<span class="w-button-text">确 定</span>' + 
						'</a>' + 
						'<a class="w-button w-button30 Window-cancel-button">' + 
							'<i class="icons icons-cancel"></i>' + 
							'<span class="w-button-text">取 消</span>' + 
						'</a>' + 
					'</div>' + 
				'</div>'
			).appendTo( this.panelBc )[0];
			
			return this.footer;
		},
		
		// 设置窗口控制区
		setController: function(){
			
			if( !this.controller ){
				
				this.controller = this.createController();
				var names = this.setDOMMemberByClass( this.controller );
				this.setDOMMemberOn(names, ['click']);
			}
			
			names = ['closeButton', 'maximizeButton', 'minimizeButton', 'reduceButton'];
				
			this.setDOMMemberEnable(names/*, 'none'*/);
			
			return this;
		},
		
		// 创建窗口控制区
		createController: function(){
			this.controller = $(
				'<div class="Window-controller">' +
					'<a href="javascript:void(0);" class="Window-close-button ico" title="关闭">关闭</a>' +
					'<a href="javascript:void(0);" class="Window-maximize-button ico" title="最大化">最大化</a>' +
					'<a href="javascript:void(0);" class="Window-reduce-button ico" title="还原">还原</a>' +
					'<a href="javascript:void(0);" class="Window-minimize-button ico" title="最小化">最小化</a>' +
				'</div>'
			).appendTo( this.root )[0];
			
			return this.controller;
		},
		
        // 设置窗口实例
        render: function( settings ){
			
			if( settings ){
				this.extend(true, settings);
			}
			
			this.setMethodClass();
			
			// 已被调用
			this.free = false;
			
			// 窗口header设置
			this.setHeader();
			
			// 窗口footer设置
			this.setFooter();
			
			// 窗口controller设置
			this.setController();
			
			// 若需插页（插入一个DOM根元素）
			this.loadPage();
			
			// 打开页面遮罩
			if( this.maskEnable ){
				 this.maskEnable = $('<div class="Window-mask"/>').appendTo('body');
			}
			
			// 设置窗口尺寸
			this.setSize();
			
			// 设置窗口位置
			this.setPosition();
			
			return this;
        },
		
		setMethodClass: function(){
			if( this.method ){
				$(this.root).
					removeClass( this.methodsClass ).
						addClass( 'Window-' + this.method );
			}
		},
		
		// 计算并设置窗口尺寸
		setSize: function(){
			
			$(this.root).css({
				width: ''
				,height: ''
			});
			
			// 获取y纵向部件的尺寸
			var $panelMc = $(this.panelMc).
				css('overflow:hidden; width:0; height:0;');
				
			var originalHeight = this.root.clientHeight;
				
			// 获取x横向部件的尺寸
			var $partX = $([this.panelTc, this.panelBc, this.controller]).
				css('overflow:hidden; width:0; height:0;');
				
			var originalWidth = this.root.clientWidth;
				originalWidth = 18;
			
			$partX.css('');
			
			var width = this.width, 
				height = this.height;
			
			// 若窗口自适应内容的尺寸，计算结果		
			if( typeof width !== 'number' ){
				width = this.width = this.panelMc.scrollWidth + originalWidth;
			}
			if( typeof height !== 'number' ){
				height = this.height = this.panelMc.scrollHeight + originalHeight;
			}
					
			// 校正定义的窗口尺寸在限制的范围内（宽度）
			if( width > this.maxWidth ){
				width = this.width = this.maxWidth;
			}
			else if( width < this.minWidth ){
				width = this.width = this.minWidth;
			}
			
			// 同上（高度）	
			if( height > this.maxHeight ){
				height = this.height = this.maxHeight;
			}
			else if( height < this.minHeight){
				height = this.height = this.minHeight;
			}
			
			$panelMc.css(
				'width:' + (width - originalWidth) + 'px;' + 
				'height:' + (height - originalHeight) + 'px;'
			);
			
			$(this.root).css({
				width: width + 'px'
				,height: height + 'px'
			});
			
			return this;
		},
		
		// 计算并设置窗口位置
		setPosition: function(){
			
			$.setPosition(this.root, this.top, this.left, true);
			return this;
		},
		
        // 打开窗口
        open: function( settings ){
			this.render( settings );
			this.root.style.visibility = 'visible';
			$(this.DOC).window().resize( this.bind(this.windowResize) );
			return this;
        },
		
		// 窗口大小改变时，重新调整坐标
		windowResize : function(e){
			// 若可窗口最大化
			if( this.maximizeButtonEnable ){
				// 若窗口已最大化
				if( $( this.maximizeButton ).hasClass('none') ){
					this.maximize(e);
				}
				// 若窗口已还原
				else{
					this.setPosition();
				}
			}
			else{
				this.setPosition();
			}
		},
		
        // 关闭按钮
        closeButtonClick: function(e){
			this.close(e);
		},
		
		maximizeButtonClick: function(e){
			this.maximize(e);
		},
		
		// 最大化
		maximize: function(e){
			
			var doc = this.DOC,
				html = doc.documentElement,
				body = doc.body,
				width = html.clientWidth || body.clientWidth,
				height = html.clientHeight || body.clientHeight;
				
			if( e.currentTarget !== $(doc).window()[0] ){	
				this.reduceWidth = this.width;
				this.reduceHeight = this.height;
			}
			this.width = width;
			this.height = height;
			this.setSize();
			this.setPosition();
			$( this.maximizeButton ).addClass('none');
			$( this.reduceButton ).removeClass('none');
		},
		
		reduceButtonClick: function(e){
			this.reduce(e);
		},
		
		// 还原
		reduce: function(e){
			
			var doc = this.DOC,
				html = doc.documentElement,
				body = doc.body,
				width = html.clientWidth || body.clientWidth,
				height = html.clientHeight || body.clientHeight;
				
			this.width = this.reduceWidth;
			this.height = this.reduceHeight;
			delete this.reduceWidth;
			delete this.reduceHeight;
			this.setSize();
			this.setPosition();
			$( this.maximizeButton ).removeClass('none');
			$( this.reduceButton ).addClass('none');
		},
		
        // 确认按钮
        confirmButtonClick: function(e){
			this.close(e);
		},
		
        // 确认按钮
        cancelButtonClick: function(e){
			this.close(e);
		},
		
        // 关闭窗口
        close: function(e){
			
			$(this.DOC).window().noResize( this.windowResize );
			
			// 清除遮罩
			if( this.maskEnable ){
				this.maskEnable.remove();
				this.maskEnable = true;
			}
			
			// 重置DOM成员的样式（隐藏）
			$( this.root ).removeClass(this.methodsClass).css('');
			$( this.panelMc ).css('');
			$( this.ico ).css('').removeClass( this.icoClass );
			
			// 若通过DOM事件触发
			if(e){
				switch(e.currentTarget){
				
					case this.closeButton:
					this.emit('close', e);
					break;
				
					case this.cancelButton:
					this.emit('cancel', e);
					break;
				
					case this.confirmButton:
					this.emit('confirm', e);
					break;
				}
			}
			else{
				this.emit('close', e);
			}
			
			// 删除页面
			this.unloadPage();
			
			// 删除实例注册的事件
			this.no();
			
			// 重置选项
			this.resetSettings();
			
			// 
			this.destroy( true );
		}
        
    });
    
	
    // $UIWindow新增方法
    $.override($UIWindow, {
		
        // 打开一个窗口
        open: function(settings){
			
			var instance = this.getFreeInstance();
			
			if( instance ){
				return instance.render(settings);
			}
			else{
				return new this(null, settings);
			}
        },
		
        // 打开一个alert窗口
        alert: function(settings){
			
			settings || (settings = {});
			
			settings.page || (settings.page = {});
			
			settings.method = 'alert';
			// "确定"按钮可用
			settings.confirmButtonEnable = true;
				
			var page = {
					icoClass: 'icons44-important'
					,icoCss: ''
					,contentHtml: ''
				};
				
			settings.page = $.extend(true, page, settings.page)
				
			page.root = $(
				'<table class="Window-alert-page-root">' + 
					'<tbody>' + 
						'<tr>' + 
							'<td>' + 
								'<div class="Window-alert-page-body">' + 
									'<i class="icons icons44 ' + page.icoClass + ' Window-alert-page-ico"></i>' + 
									'<div class="Window-alert-page-content">' + 
										(page.contentHtml || '') + 
									'</div>' +  
								'</div>' + 
							'</td>' + 
						'</tr>' + 
					'</tbody>' + 
				'</table>'
			)[0];
			
			var win = this.open(settings);
			
			return win;
        },
		
        // 打开一个confirm窗口
        confirm: function(settings){
			
			settings || (settings = {});
			settings.method = 'confirm';
			// "取消"按钮可用
			settings.cancelButtonEnable = true;
			
			var win = this.alert(settings);
			
			return win;
        },
		
        // 打开一个窗口
        dialog: function(settings){
			
			settings || (settings = {});
			settings.method = 'dialog';
			
			// "确定"按钮可用
			//settings.confirmButtonEnable = true;
			// "取消"按钮可用
			//settings.cancelButtonEnable = true;
			
			var win = this.open(settings);
			//win.handleEnable(true);
			
			return win;
        }
		
    });
    
})(this, zCool);

