Light12306/Web12306/js/ui/widget.js

define(function (require, exports) {
	var mask = $('<div id="mask"></div>');
	var maskCallback = [];
	var unmaskCallback = [];
	var maskEleCount = 0;

	document.body.appendChild(mask[0]);
	//当动画完成后，如果没有显示的必要，那么就移除它。
	//这里没有考虑没有如果没有这个事件触发的情况
	var masked = false;
	mask.on("transitionend", function () {
		var cb = null;

		if (!mask.hasClass("final")) {
			mask.hide();

			while (cb = unmaskCallback.shift())
				cb.call(mask);
		} else {
			while (cb = maskCallback.shift())
				cb.call(mask);
		}

	});

	//将当前对象置于居中的位置，并允许以指定方式做便宜
	var centerEle = function (e, offsety) {
		var width = e.width();
		var height = e.height();

		offsety = offsety || 20;
		e.css("margin-left", "-" + (width / 2) + "px");
		e.css("margin-top", "-" + (height / 2 + offsety) + "px");

		if (!e.hasClass("float-dialog"))
			e.addClass("float-dialog");
	};

	var maskScreen = exports.mask = function (callback) {
		if (mask.hasClass("final") || masked) {
			if (callback) callback();
			return;
		}
		if (callback)
			maskCallback.push(callback);

		masked = true;
		mask.height(document.body.scrollHeight + "px");
		mask.show();
		setTimeout(function () { mask.addClass("final"); }, 1);
	};
	var unmaskScreen = exports.unmask = function (callback) {
		if (!mask.hasClass("final") || !masked) {
			callback && callback();
			return;
		}

		if (callback)
			maskCallback.push(callback);
		masked = false;
		mask.removeClass("final");
	};
	exports.showFloatDialog = function (ele, callback) {
		if (ele.attr("data-masked")) {
			if (callback)
				callback();
			return;
		}

		ele.attr("data-masked", 1);
		maskEleCount++;
		centerEle(ele);
		maskScreen(function () {
			ele.show();
			ele.animate({ opacity: 'show', "margin-top": "+=20px" }, 'fast', 'linear', callback);
		});
		ele.trigger("openDialog");
	};
	exports.hideFloatDialog = function (ele, callback) {
		if (!ele.attr("data-masked")) {
			if (callback) callback();
			return;
		}

		ele.removeAttr("data-masked");
		maskEleCount--;
		ele.animate({ opacity: 'hide', "margin-top": "-=20px" }, 'fast', 'linear', function () {
			if (!maskEleCount)
				unmaskScreen(callback);
		});
		ele.trigger("closeDialog");
	};

	//监听文档级别事件，显示悬浮窗
	$(document).on("refreshDialog.widget", function () {
		var e = $(this);
		var height = e.height();

		e.animate({ top: "-" + (height / 2) + "px" }, 'fast', 'linear');
	});
	$(document).on("click.widget", ".float-dialog .cancel-button", function () {
		exports.hideFloatDialog($(this).closest(".float-dialog"));
	});
});