artemis/titles/mai2/templates/events/mai2_events.jinja

156 lines
4.4 KiB
Django/Jinja

{% extends "core/templates/index.jinja" %}
{% block content %}
<h1>Events</h1>
<form id="verForm" method="POST" action="/game/mai2/events/version.change">
<select id="version" name="version" onchange="updateVer()" form="verForm">
{% for ver in range(version_list|length) %}
<option value="{{ver}}">{{ version_list[ver] }}</option>
{% endfor %}
</select>
</form>
<table class="table table-dark table-striped-columns" id="tbl_events">
<caption>Viewing all events</caption>
<thead>
<tr>
<th>ID</th>
<th>Version</th>
<th>Event ID</th>
<th>Event Type</th>
<th>Name</th>
<th>Start Date</th>
<th>Enabled</th>
<th>Actions</th>
</tr>
</thead>
{% if events is not defined or events|length == 0 %}
<tr>
<td colspan="11" style="text-align:center"><i>No Events</i></td>
</tr>
{% endif %}
</table>
<div id="div_tbl_ctrl">
<select id="sel_per_page" onchange="update_tbl()">
<option value="10" selected>10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
&nbsp;
<button class="btn btn-primary" id="btn_prev" disabled onclick="chg_page(-1)"><<</button>
<button class="btn btn-primary" id="btn_next" onclick="chg_page(1)">>></button>
</div>
<script type="text/javascript">
{% if events is defined %}
const TBL_DATA = {{events}};
{% else %}
const TBL_DATA = [];
{% endif %}
document.getElementById("version").value = {{ sesh.maimai_version }};
var per_page = 0;
var page = 0;
function updateVer() {
var sel = document.getElementById("version");
var frm = document.getElementById("verForm");
if (sel.value == {{ sesh.maimai_version }}) {
return;
}
frm.submit();
}
function update_tbl() {
if (TBL_DATA.length == 0) { return; }
var tbl = document.getElementById("tbl_events");
for (var i = 0; i < per_page; i++) {
try{
tbl.deleteRow(1);
} catch {
break;
}
}
per_page = document.getElementById("sel_per_page").value;
if (per_page >= TBL_DATA.length) {
page = 0;
document.getElementById("btn_next").disabled = true;
document.getElementById("btn_prev").disabled = true;
}
for (var i = 0; i < per_page; i++) {
let off = (page * per_page) + i;
if (off >= TBL_DATA.length) {
if (page != 0) {
document.getElementById("btn_next").disabled = true;
document.getElementById("btn_prev").disabled = false;
}
break;
}
var data = TBL_DATA[off];
var row = tbl.insertRow(i + 1);
var cell_id = row.insertCell(0);
cell_id.innerHTML = data.id;
var cell_ver = row.insertCell(1);
cell_ver.innerHTML = data.version;
var cell_evtid = row.insertCell(2);
cell_evtid.innerHTML = data.eventId;
var cell_evttype = row.insertCell(3);
cell_evttype.innerHTML = data.eventType;
var cell_name = row.insertCell(4);
cell_name.innerHTML = data.name;
var cell_date = row.insertCell(5);
cell_date.innerHTML = data.startDate;
var call_enabled = row.insertCell(6);
if (data.enabled === "true")
call_enabled.innerHTML = "✔"
else
call_enabled.innerHTML = "✖"
var cell_action = row.insertCell(7);
cell_action.innerHTML = "<a href=/game/mai2/events/" + data.id +"><button class='btn btn-primary'>🖉</button></a>"
}
}
function chg_page(num) {
var max_page = TBL_DATA.length / per_page;
console.log(max_page);
page = page + num;
if (page > max_page && max_page >= 1) {
page = max_page;
document.getElementById("btn_next").disabled = true;
document.getElementById("btn_prev").disabled = false;
return;
} else if (page < 0) {
page = 0;
document.getElementById("btn_next").disabled = false;
document.getElementById("btn_prev").disabled = true;
return;
} else if (page == 0) {
document.getElementById("btn_next").disabled = false;
document.getElementById("btn_prev").disabled = true;
} else {
document.getElementById("btn_next").disabled = false;
document.getElementById("btn_prev").disabled = false;
}
update_tbl();
}
update_tbl();
</script>
{% endblock content %}