/**
 * $.munmodal.dialog(); 普通dialog框方法
 * $.munmodal.alert(); 封装好的alert方法
 * $.munmodal.confirm(); 封装好的confirm方法
 * $.munmodal.message(); 封装好的message方法
 */
(function($) {
	var munmodal = function() {
		//diglog方法默认配置 
		this.dialogconfig = {
			/**
			 * title {string|element}
			 * closeicon {true | false}
			 * content {string | element}
			 * buttons {array}
			 * maskclose {true | false}
			 * maskopacity { numbe (0-1)}
			 * duration { number }
			 * closecallback {function}
			 * width {number | auto}
			 * left {number | middle}
			 * top {number | middle}
			 */
			title: "null",
			closeicon: true,
			content: "null",
			buttons: [{
				type: "cancel",
				btntext: "cancel",
				callback: null
			}, {
				type: "ok",
				btntext: "ok",
				callback: null
			}],
			maskclose: true,
			maskopacity: "0.6",
			duration: false,
			closecallback: null,
			width: null,
			left: "middle",
			top: "middle",
		};
		//alert方法默认配置
		this.alertconfig = {
			type: "info",
			title: "提示信息",
			content: "null",
			oktext: "确定",
			okcallback: null,
			maskopacity: "0.6",
			width: null,
			left: "middle",
			top: "middle",
		};
		//confirm方法默认配置
		this.confirmconfig = {
			type: "info",
			title: "提示信息",
			content: "null",
			canceltext: "取消",
			cancelcallback: null,
			oktext: "确定",
			okcallback: null,
			maskopacity: "0.6",
			width: null,
			left: "middle",
			top: "middle",
		};
		//message方法默认配置
		this.messageconfig = {
			type: "info",
			title: "提示信息",
			content: "null",
			duration: "2000",
			closecallback: null,
			left: "middle",
			top: "40%",
		}
	};
	munmodal.prototype = {
		//dom节点渲染方法
		creat: function(config) {
			var _this_ = this;
			var mask = $('<div class="munui-modal-mask"></div>');
			var content = $('<div class="' + config.contentclass + '"></div>');
			var header = $('<div class="' + config.headerclass + '"></div>');
			var body = $('<div class="' + config.bodyclass + '"></div>')
			var footer = $('<div class="' + config.footerclass + '"></div>');
			var closeicon = $('<i class="iconfont icon-close"></i>');
			if (config.closeicon) {
				closeicon.click(function(e) {
					e.stoppropagation();
					_this_.effect(mask, "opacity");
					_this_.effect(content, "scale");
					window.settimeout(function() {
						$("body").removeattr("style");
						mask.remove();
					}, 300);
					config.closecallback && config.closecallback();
				})
				content.append(closeicon);
			}
			if (config.title) {
				header.html(config.title);
				content.append(header);
			}
			body.html(config.content);
			content.append(body);
			$(config.buttons).each(function() {
				var type = this.type ? this.type : null;
				var btntext = this.btntext ? this.btntext : null;
				var callback = this.callback ? this.callback : null;
				var button = $('<button class="munui-modal-botton munui-' + type + '" type="button">' + btntext + '</button>');
				if (callback) {
					button.click(function(e) {
						var isclose = callback();
						e.stoppropagation();
						if (isclose != false) {
							_this_.effect(mask, "opacity");
							_this_.effect(content, "scale");
							window.settimeout(function() {
								$("body").removeattr("style");
								mask.remove();
							}, 300);
						}
					})
				} else {
					button.click(function(e) {
						e.stoppropagation();
						_this_.effect(mask, "opacity");
						_this_.effect(content, "scale");
						window.settimeout(function() {
							$("body").removeattr("style");
							mask.remove();
						}, 300);
					})
				}
				footer.append(button);
			});
			content.append(footer);
			if (config.width && config.width != "auto") {
				content.css("width", config.width);
			}
			mask.html(content);
			mask.css("backgroundcolor", "rgba(55,55,55," + config.maskopacity + ")");

			$("body").append(mask);
			var scrollbarwidth1 = $(window).width();
			$("body").css({"overflow":"hidden"});
			var scrollbarwidth2 = $(window).width();
			$("body").css({"paddingright":scrollbarwidth2-scrollbarwidth1+"px"});
			if (config.left && config.left != "middle") {
				content.css({
					"marginleft": config.left,
				})
			} else {
				content.css({
					"left": "50%",
					"marginleft": -content.outerwidth() / 2 + "px",
				})
			}
			if (config.top && config.top != "middle") {
				content.css({
					"margintop": config.left
				})
			} else {
				content.css({
					"top": "50%",
					"margintop": -content.outerheight() / 2 + "px"
				})
			}
			this.effect(mask, "opacity");
			this.effect(content, "scale");
			if (config.duration && config.duration != 0) {
				window.settimeout(function() {
					_this_.effect(mask, "opacity");
					_this_.effect(content, "scale");
					window.settimeout(function() {
						$("body").removeattr("style");
						mask.remove();
					}, 300);
					config.closecallback && config.closecallback();
				}, config.duration);
			}
			if (config.maskclose) {
				content.click(function(e) {
					e.stoppropagation();
				})
				mask.click(function(e) {
					e.stoppropagation();
					_this_.effect(mask, "opacity");
					_this_.effect(content, "scale");
					window.settimeout(function() {
						$("body").removeattr("style");
						mask.remove();
					}, 300);
					config.closecallback && config.closecallback();
				})
			}
		},
		dialog: function(cfg) {
			//对dialog方法的参数进行拓展
			var config = $.extend({}, this.dialogconfig, cfg, {
				contentclass: "munui-modal-content",
				headerclass: "munui-modal-header",
				bodyclass: "munui-modal-body",
				footerclass: "munui-modal-footer",
			});
			//对dialog方法执行渲染
			this.creat(config);
		},
		alert: function(cfg) {
			//对alert方法的参数进行拓展和拼接成默认的dialog方法参数形式
			var config = $.extend({}, this.alertconfig, cfg)
			var isconfig = $.extend({}, config, {
				contentclass: "munui-confirm-content",
				headerclass: "munui-confirm-header",
				bodyclass: "munui-confirm-body",
				footerclass: "munui-confirm-footer",
				title: '<i class="iconfont munui-cl-' + config.type + ' munui-' + config.type + '"></i><span class="munui-confirm-text">' + config.title + '</span>',
				content: config.content,
				buttons: [{
					type: "ok",
					btntext: config.oktext,
					callback: config.okcallback
				}],
			});
			//对alert方法执行渲染
			this.creat(isconfig);
		},
		confirm: function(cfg) {
			//对confirm方法的参数进行拓展和拼接成默认的dialog方法参数形式
			var config = $.extend({}, this.confirmconfig, cfg);
			var isconfig = $.extend({}, config, {
				contentclass: "munui-confirm-content",
				headerclass: "munui-confirm-header",
				bodyclass: "munui-confirm-body",
				footerclass: "munui-confirm-footer",
				title: '<i class="iconfont munui-cl-' + config.type + ' munui-' + config.type + '"></i><span class="munui-confirm-text">' + config.title + '</span>',
				content: config.content,
				buttons: [{
					type: "cancel",
					btntext: config.canceltext,
					callback: config.cancelcallback
				}, {
					type: "ok",
					btntext: config.oktext,
					callback: config.okcallback
				}],
			});
			//对confirm方法执行渲染
			this.creat(isconfig);
		},
		message: function(cfg) {
			//message方法另行处理
			var _this_ = this;
			var config = $.extend({}, this.messageconfig, cfg);
			//创建dom节点
			var messagehtml = $('<div class="munui-message-content"><i class="iconfont munui-cl-' + config.type + ' munui-' +
				config.type + '"></i><span>' + config.content + '</span></div>');
			$("body").append(messagehtml);
			//设置水平居中和距离顶部的位置
			if (config.left && config.left != "middle" ) {
				messagehtml.css({
					"left": config.left,
				});
			}else{
				messagehtml.css({
					"left": "50%",
					"marginleft": -messagehtml.outerwidth() / 2,
				});
			}
			if (config.top && config.top != "middle" ) {
				messagehtml.css({
					"top": config.top,
				});
			}else{
				messagehtml.css({
					"top": "50%",
					"marginleft": -messagehtml.outerheight() / 2,
				});
			}
			//执行动画
			_this_.effect(messagehtml, "top-opacity");
			//廷时关闭
			window.settimeout(function() {
				_this_.effect(messagehtml, "top-opacity");
				window.settimeout(function() {
					messagehtml.remove();
				}, 300);
				//执行回调
				config.closecallback && config.closecallback();
			}, config.duration);
		},
		effect: function(ele, transitionname) {
			//动画封装，配合css样式
			if (ele.hasclass("transitiontime")) {
				ele.addclass("transition-" + transitionname);
			} else {
				ele.addclass("transition-" + transitionname);
				window.settimeout(function() {
					ele.addclass("transitiontime");
					ele.removeclass("transition-" + transitionname);
				}, 100);
			}
		},
		//全局移除方法
		remove: function() {
			$("body").removeclass("overflowbody");
			var a = $(".munui-modal-mask,.munui-message-content");
			a.remove();
			for(i in a){
				delete a[i];
			}
		}
	};
	window.munmodal = munmodal;
	$.munmodal = new munmodal();

})(jquery);