Light12306/Web12306/js/ui/widget_datedropdown.js

define(function (require, exports, module) {
	var param = require("../data.js");
	var utility = require("../utility.js");

	var getCurDate = function () {
		var now = new Date();
		//now = new Date(Math.floor(now.getTime() / 86400000) * 86400000);
		now = new Date(now.getFullYear(), now.getMonth(), now.getDate());

		return now;
	};
	var getDateString = function (date) {
		return date.getFullYear() + "-" + (date.getMonth() < 9 ? "0" : "") + (date.getMonth() + 1) + "-" + (date.getDate() < 10 ? "0" : "") + date.getDate();
	};
	var options = {
		maxSellDays: 19,
		selectDate: [],
		minDate: getCurDate()
	};

	var renderCalendar = function (container, monthStart) {
		var weekdayOfFirstDay = monthStart.getDay();
		var calendarBegin = new Date(monthStart.getTime() + 86400000 * weekdayOfFirstDay * -1);
		var cells = container.find("td");
		var thismonth = monthStart.getMonth();
		var currentDate = getCurDate();

		var dateTmp = calendarBegin;
		var minTime = param.minDate.getTime();
		var maxTime = param.maxDate.getTime();
		for (var i = 0; i < 42; i++) {
			var cell = cells.eq(i);
			cell.html(dateTmp.getDate());
			cell.removeClass();
			if (dateTmp.getMonth() !== thismonth || dateTmp.getTime() < minTime) {
				cell.addClass("date-notavailable");
			}else if (dateTmp.getTime() === currentDate.getTime()) {
				cell.addClass("date-current");
			} else if (dateTmp.getTime() <= maxTime) {
				cell.addClass("date-commonavailable");
			}
			cell.attr("data-date", getDateString(dateTmp));
			dateTmp = new Date(dateTmp.getTime() + 86400000);
		}

		//显示时间
		container.find("header").html(monthStart.getFullYear() + "年" + (monthStart.getMonth() + 1) + "月");
	};

	var showPopup = function (ele, showDate) {
		var selected = ele.data("selectedDate") || [];
		var curDate = utility.toDate(ele.val());
		//如果日历已经创建了，则不变。
		if (curDate)
			selected.push(getDateString(curDate));
		else curDate = getCurDate();
		showDate = showDate || curDate;

		var now = getCurDate();
		var dateDom = $("#dateSelector");


		var dayStart = new Date(showDate.getFullYear(), showDate.getMonth(), 1);
		var maxShowDay = new Date(dayStart.getTime() + 86400 * 1000 * options.maxSellDays * 2);

		if (dateDom.prop("data-month") !== getDateString(dayStart)) {
			renderCalendar(dateDom.find(">.month-first"), dayStart);
			renderCalendar(dateDom.find(">.month-second"), utility.addMonths(dayStart, 1));
			dateDom.prop("data-month", getDateString(dayStart));
		}

		//确定有标记
		dateDom.find("td").removeClass("date-selected").filter(selected.map(function (e) { return "[data-date='" + e + "']:not(.date-notavailable)"; }).join(",")).addClass("date-selected");
		dateDom.data("date-target", ele);

		//显示
		var offset = ele.offset();
		var left = (offset.left - dateDom.width() / 2);
		if (left < 1) left = 0;
		dateDom.css({ left: left + "px", top: (offset.top + ele.height()) + "px" });
		dateDom.show();
	};

	var init = function () {
		var date_classes = ["month-first", "month-second"];
		var dom = ['<div id="dateSelector">'];

		_.each(date_classes, function (e) {
			var cls = e + '';

			dom.push('<div class="' + cls + '"><section class="date-selector"><nav><span class="month-prev"><i class="fa fa-arrow-left"></i></span><span class="month-next"><i class="fa fa-arrow-right"></i></span><header></header></nav><table><tr><th>日</th><th>一</th><th>二</th><th>三</th><th>四</th><th>五</th><th>六</th></tr>');
			for (var i = 0; i < 6; i++) {
				dom.push("<tr>");
				for (var j = 0; j < 7; j++) {
					dom.push("<td></td>");
				}
				dom.push("</tr>");
			}
			dom.push("</table></section></div>");
		});
		$("body").append(dom.join(""));

		$("#dateSelector").mousedown(function (e) {
			var target = $("#dateSelector").data("date-target");
			if (!target || !target.length)
				return false;

			if (target[0].dataset.keepopen === "true") {
				e.stopPropagation && e.stopPropagation();
				e.preventDefault && e.preventDefault();
			}

			var et = $(e.target);
			if (et.is("#dateSelector td")) {
				if (et.hasClass("date-notavailable")) return;

				target.val(et.attr("data-date")).change();
				et.toggleClass("date-selected");

				return true;
			}
			var dt = utility.toDate($("#dateSelector").prop("data-month"));
			if (et.is(".month-prev") || et.is(".month-prev .fa-arrow-left")) {
				dt = utility.addMonths(dt, -2);
				showPopup(target, dt);
			}
			if (et.is(".month-next") || et.is(".month-next .fa-arrow-right")) {
				dt = utility.addMonths(dt, 2);
				showPopup(target, dt);
			}

			return false;
		});
	};
	init();

	var selector = "input.ui-date";
	$(document).on("focus", selector, function () {
		showPopup($(this));
	}).on("blur", selector, function () {
		$("#dateSelector").hide().removeData("date-target");
	});
});