Newer
Older
attend / index.html
<!doctype html>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width,user-scalable=no">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="pragma" content="no-cache">

<title>IST/HSI logon record checker</title>

<link rel="stylesheet" href="./lib/themes/sitelocal.css">
<link rel="stylesheet" href="./lib/themes/default.css">
<link rel="stylesheet" href="./lib/themes/default.date.css">
<link rel="stylesheet" href="./lib/themes/hexdots.css">

<body>
    <header>IST/HSI LOGON checker</header>
    <section class="section">

        <form>
            <fieldset>
                <label for="input_01">DATE:</label>
                <input
                    id="input_01"
                    class="datepicker"
                    name="date"
                    type="text"
                    autofocuss
                    onchange="timechanged()">
            </fieldset>
        </form>

        <form>
            <fieldset>
                <label for="input_from">From:</label>
                <input
                    id="input_from" 
                    type="time"
		    name="from" onchange="timechanged()">
                    
                    <!-- valuee="2:30 AM"
                    data-value="0:00" -->
                <label for="input_to">To:</label>
                <input
                    id="input_to"
                    type="time"
		    name="to" onchange="timechanged()"/>
		 | <label> 時間割単位:</label>
	        <select onchange="changed()" id="sel">
			<option value="0">--------</option>
			<option value="1">1限目(9:00-10:30)</option>
			<option value="2">2限目(11:10-12:40)</option>
			<option value="3">3限目(13:30-15:00)</option>
			<option value="4">4限目(14:10-16:40)</option>
			<option value="5">5限目(16:50-18:20)</option>
			<option value="99">深夜(18:00-23:59)</option>
			<option value="-1">早朝(0:00-8:30)</option>
		</select>
            </fieldset>
        </form>
        <form>
            <fieldset>
		    <input checked type="checkbox" id="logon" onchange="filter()"/>
		    <label for="logon" class="checkbox"> ログオン</label>
		    <input type="checkbox" id="logoff" onchange="filter()"/>
		    <label for="logoff" class="checkbox">ログオフ</label>
            </fieldset>
        </form>
        <form>
            <fieldset>
		    <input checked type="checkbox" id="grl" onchange="filter()"/>
		    <label for="grl" class="checkbox">GRL</label>
		    <input type="checkbox" id="ml1" onchange="filter()"/>
		    <label for="ml1" class="checkbox">ML1</label>
		    <input type="checkbox" id="ml2" onchange="filter()"/>
		    <label for="ml2" class="checkbox">ML2</label>
		    <input type="checkbox" id="hsi" onchange="filter()"/>
		    <label for="hsi" class="checkbox">HSI</label>
            </fieldset>
        </form>
        <form>
            <fieldset>
		    <input checked type="checkbox" id="uniq" onchange="filter()"/>
		    <label for="uniq" class="checkbox">重複カット</label>
            </fieldset>
        </form>

        <div id="output">
		<table>
			<tbody>
			<tr>
				<th>
					<input type='radio' class='radio' onclick='clicked()' id='date' name='sort' value='日時'>
					<label class='radio' for='date'> 日時 </label>
				</th>
				<th>
					<input type='radio' class='radio' onclick='clicked()' id='no' name='sort' value='学生番号' checked>
					<label class='radio' for='no'> 学生番号</label>
				</th>
				<th>
					<input type='radio' class='radio' onclick='clicked()' id='namename' name='sort' value='名前'>
					<label class='radio' for='namename'> 名前 </label>
				</th>
				<th>
					<input type='radio' class='radio' onclick='clicked()' id='reading' name='sort' value='ヨミガナ'>
					<label class='radio' for='reading'> ヨミガナ </label>
				</th>
				<th>
					<input type='radio' class='radio' onclick='clicked()' id='dep' name='sort' value='所属'>
					<label class='radio' for='dep'> 所属 </label>
				</th>
			</tr>
			</tbody>
		</table>
	</div>

        <div id="container"></div>
    </section>

    <div class="waitboard">
	    <div class="waititem">
		    <center>
			    Loading...<br><br>
			    <span class="hexdots-loader">
				    Loading...
			    </span>
		    </center>
	    </div>
    </div>

    <script src="./lib/jquery.1.9.1.js"></script>
    <script src="./lib/picker.js"></script>
    <script src="./lib/picker.date.js"></script>
    <script src="./lib/legacy.js"></script>
    <script src="./lib/translations/ja_JP.js"></script>

    <script type="text/javascript">
	var direction = 1;
	var db = null;
        var $input = $( '.datepicker' ).pickadate({
            formatSubmit: 'yyyy/mm/dd',
            // min: [2015, 7, 14],
            container: '#container',
            // editable: true,
            closeOnSelect: true,
            closeOnClear: true,
        });

        var datepicker = $input.pickadate('picker');

	function changed() {
		var sel = $("#sel").val();
		var from = $("#input_from")[0];
		var to = $("#input_to")[0];
		if (sel == 1) { from.value= "08:50";  to.value= "10:40"; timechanged();
		} else if (sel == 2) { from.value= "10:40";  to.value= "12:50"; timechanged();
		} else if (sel == 3) { from.value= "13:20";  to.value= "15:10"; timechanged();
		} else if (sel == 4) { from.value = "15:00";  to.value = "16:50"; timechanged();
		} else if (sel == 5) { from.value = "16:40";  to.value = "18:30"; timechanged();
		} else if (sel ==99) { from.value = "18:30";  to.value = "23:59"; timechanged();
		} else { from.value = "00:00";  to.value = "08:50"; timechanged(); }
	}
	var sortkey_prev = null;
	function timechanged() {
		sortkey_prev = null;
		date = $("#input_01")[0];
		from = $("#input_from")[0];
		to = $("#input_to")[0];
		if (date.value && from.value && to.value) {
			$(".waitboard").css("display", "block");
			$.post("../cgi-bin/attend/call.cgi", {date: date.value, from: from.value,
				to: to.value}, function(data) {
					db = data;
					clicked();
					filter();
					$(".waitboard").css("display", "none");
				});
		}
	}

	function check(i)  { return function (a,b) {
			if (a[i] > b[i]) return  1*direction;
			if (a[i] < b[i]) return -1*direction;
			return 0;
		};
	}
	function clicked() {
		s = $("input[name=sort]:checked").val();
		if (sortkey_prev == s) {
			direction = - direction;
		}
		sortkey_prev = s;
		if (s == "日時") {
			db = db.sort(check(1));
		} else if(s == "学生番号") {
			db = db.sort(check(4));
		}else if (s == "名前") {
			db = db.sort(check(5));
		}else if (s == "ヨミガナ") {
			db = db.sort(check(6));
		}else if (s == "所属") {
			db = db.sort(check(7));
		} else return;
		
		filter();
	}
	function filter() {
		var checkbox = {};
		["logon", "logoff", "grl", "ml1", "ml2", "hsi", "uniq"].forEach(
			function (s) {checkbox[s]=$("#"+s)[0].checked; });
		var table = $("#output table");
		$("#output table tbody tr:nth-child(n+2)").remove();
		var prev = null;
		db.forEach(function (s) {
			var room = s[0].split(".")[2];
			var accept = false;
			if (room == 116 && checkbox["grl"]) {
				accept = true;
			} else if (room == 117 && checkbox["ml1"]) {
				accept = true;
			} else if (room == 118 && checkbox["ml2"]) {
				accept = true;
			} else if (room == 119 && checkbox["hsi"]) {
				accept = true;
			}
			if (accept) {
				if((s[2] == "on"  && checkbox["logon"]) || (s[2] == "off" && checkbox["logoff"])) {
					console.log(prev, s[4], prev != s[4]);
					if(!checkbox["uniq"] || prev != s[4]) {
						var tr = $("<tr></tr>").appendTo(table);
						[1,4,5,6,7].forEach(function(i) {$("<td>"+s[i]+"</td>").appendTo(tr); });
					}
					prev = s[4];
				}
			}
			table.appendTo("#output");
		});

	}
    </script>
</body>