{% extends "jinhtml/skel.html" %}
{% block headcss %}
	<link rel = "stylesheet" type = "text/css" href = "/css/list.css">
{% endblock %}

{% block onload %}
	pushevent (); 
	pushtestdata ();
	var switchlistobj = document.getElementById("switchlist")
	switchlistobj.className += "selected";
	switchlistobj.onclick = "";
{% endblock %}

{% block headjs %}
	<script src = "/js/list.js" type = "text/javascript"></script>
	<script>
		function pushtestdata () {//push test data
			var classname = ["date", "week", "time", "content"];
			var testevents = new Array ();
			testevents.push ("2012.11.28", "星期三", "20:30 - 22:00", "期末Project Online");
			testevents.push ("2012.12.1", "星期六", "8:30 - 11:30", "校園馬拉松");
			testevents.push ("2012.12.21", "星期五", "?:?? - ?:??", "世界末日");
			testevents.push ("2013.1.7", "星期一", "0:00 - ", "期末考Online");
			testevents.push ("2013.6.20", "星期四", "0:00 - 24:00", "生日大會");
			for (var i = 0 ; i < testevents.length ; i++) {
				$ ("#event" + Math.floor (i / 4 + 1) + classname[i % 4]).text (testevents[i]);
			}
		}
		function pushdata () {
			$.ajax ({
				type: "POST",
				url: "/access/insert",
				data: "title=123&content=eventcontent&icon=5&year=2012&month=12&date=16&hour=10&minute=10&datafrom=google&remind=77",
				success: function () {
					alert ("POST SUCCESS!!");
				}
			});
		}
	</script>
{% endblock %}

{% block body %}
	<div id = "searchbar" align = "center">
		<select id = "searchingoption" onchange = "changesearchingbar (this);">
			<option value = "date"> 日期 </option>
			<option value = "content" selected = "selected"> 標題 </option>
		</select>
		<input id = "searchingcontent" type = "text" onkeyup = "searchevent ();">
		<div id = "searchingdate" style = "display:none;">
			<input id = "searchingdatemonth" type = "text" size = "2" onkeyup = "searchevent ();"> 月
			<input id = "searchingdateday" type = "text" size = "2" onkeyup = "searchevent ();"> 日
		</div>
	</div>
	<div align = "center">
		<table id = "listcal" cellpadding = "0" cellspacing = "0" style = "width:100%;">
			<thead>
				<tr>
					<td colspan = "3" id = "date"> 日期 </td>
					<td id = "eventcontent"> 標題 </td>
				</tr>
			</thead>
			<tbody id = "eventbody">
			</tbody>
		</table>
	</div>
	<div id = "unmatchedmessage">
		找不到活動
	</div>
	<button type = "button" onclick = "pushdata ();"> Click Me !! </button>
{% endblock %}