## entries_table: str


<!-- Tab content -->
<div id="Entries" class="tabcontent">
  <div id="entr.actions" class="actions">
    <!-- Trigger/Open The Modal -->
    <button id="entr.myBtnReload" onclick="entr_update()">Reload</button>
    <button id="entr.myBtnImport" onclick="entr_myImport()">Import ...</button>
    <button id="entr.myBtnExport" onclick="entr_myExport()">Export ...</button>
    <button id="entr.myBtnPrint" onclick="entr_myPrint()">Print ...</button>
    <button id="entr.myBtnAdd" onclick="entr_myAdd()">Add entry ...</button>
    <button id="entr.myBtnEdit" disabled onclick="entr_myEdit()">Edit entry ...</button>
    <button id="entr.myBtnDelete" disabled onclick="entr_myDelete()">Delete entry</button>
    <button id="entr.myBtnResult" disabled onclick="entr_myResult()">Edit split times ...</button>
  </div>

  <div id="entr.results" class="data">
    ${entries_table | n}
  </div>

  <!-- The Modal -->
  <div class="modal" id="entr.importDialog">
    <!-- Modal content -->
    <div class="modal-content">
      <span class="close" onclick="document.getElementById('entr.importDialog').style.display='none'">&times;</span>
      <form id="entr.import.form" class="form-container" onsubmit="entr_submitImport(); return false;">
        <p>Format</p>
        <div>
          <input id="entr_radio_import_1" name="entr_import" type="radio" value="entr.import.1"
                 onchange="updateDisplayedParams('entr_import_1')" required checked/>
          <label for="entr_radio_import_1">IOF Interface Standard 3.0 Entry List</label>
        </div>
        <div>
          <input id="entr_radio_import_2" name="entr_import" type="radio" value="entr.import.2"
                 onchange="updateDisplayedParams('entr_import_2')" required/>
          <label for="entr_radio_import_2">IOF Interface Standard 3.0 Result List</label>
        </div>
        <div>
          <input id="entr_radio_import_3" name="entr_import" type="radio" value="entr.import.3"
                 onchange="updateDisplayedParams('entr_import_3')" required/>
          <label for="entr_radio_import_3">OE2003 csv, OE12 csv</label>
        </div>
        % if EXPERIMENTAL:
          <div>
            <input id="entr_radio_import_4" name="entr_import" type="radio" value="entr.import.4"
                   onchange="updateDisplayedParams('entr_import_4')" required/>
            <label for="entr_radio_import_4">Text</label>
          </div>
        % endif
        <p>Settings</p>
        <div id="entr_import">
          <div id="entr_import_1" class="params">
            <table>
              <tr>
                <th class="input-header"><label for="file1">File</label></th>
                <td><input id="entr.import.file1" name="browse1" type="file" class="required" accept=".xml"/></td>
              </tr>
            </table>
          </div>
          <div id="entr_import_2" class="params">
            <table>
              <tr>
                <th class="input-header"><label for="file2">File</label></th>
                <td><input id="entr.import.file2" name="browse2" type="file" class="required" accept=".xml"/></td>
              </tr>
            </table>
          </div>
          <div id="entr_import_3" class="params">
            <table>
              <tr>
                <th class="input-header"><label for="file3">File</label></th>
                <td><input id="entr.import.file3" name="browse3" type="file" class="required" accept=".csv,.txt"/></td>
              </tr>
            </table>
          </div>
          <div id="entr_import_4" class="params">
            <table>
              <tr>
                <th class="input-header"><label for="file4">File</label></th>
                <td><input id="entr.import.file4" name="browse4" type="file" class="required"/></td>
              </tr>
            </table>
          </div>
        </div>
        <p></p>
        <p></p>
        <button type="submit" class="btn">Import</button>
        <button type="button" class="btn cancel" onclick="document.getElementById('entr.importDialog').style.display='none'">Cancel</button>
      </form>
    </div>
  </div>

  <!-- The Modal -->
  <div class="modal" id="entr.exportDialog">
    <!-- Modal content -->
    <div class="modal-content">
      <span class="close" onclick="document.getElementById('entr.exportDialog').style.display='none'">&times;</span>
      <form id="entr.export.form" class="form-container" onsubmit="entr_submitExport(); return false;">
        <p>Format</p>
        <div>
          <input id="entr_radio_export_1" name="entr_export" type="radio" value="entr.export.1"
                 onchange="updateDisplayedParams('entr_export_1')" required checked/>
          <label for="entr_radio_export_1">IOF Interface Standard 3.0 Entry List</label>
        </div>
        <div>
          <input id="entr_radio_export_2" name="entr_export" type="radio" value="entr.export.2"
                 onchange="updateDisplayedParams('entr_export_2')" required/>
          <label for="entr_radio_export_2">IOF Interface Standard 3.0 Result List</label>
        </div>
        <div>
          <input id="entr_radio_export_3" name="entr_export" type="radio" value="entr.export.3"
                 onchange="updateDisplayedParams('entr_export_3')" required/>
          <label for="entr_radio_export_3">Result List for Splitsbrowser</label>
        </div>
        <div>
          <input id="entr_radio_export_4" name="entr_export" type="radio" value="entr.export.4"
                 onchange="updateDisplayedParams('entr_export_4')" required/>
          <label for="entr_radio_export_4">OE2003 csv</label>
        </div>
        <div>
          <input id="entr_radio_export_5" name="entr_export" type="radio" value="entr.export.5"
                 onchange="updateDisplayedParams('entr_export_5')" required/>
          <label for="entr_radio_export_5">OE12 csv</label>
        </div>
        <p>Settings</p>
        <div id="entr_export">
          <div id="entr_export_1" class="params">
          </div>
          <div id="entr_export_2" class="params">
          </div>
          <div id="entr_export_3" class="params">
          </div>
          <div id="entr_export_4" class="params">
          </div>
          <div id="entr_export_5" class="params">
          </div>
        </div>
        <p></p>
        <p></p>
        <button type="submit" class="btn">Export</button>
        <button type="button" class="btn cancel" onclick="document.getElementById('entr.exportDialog').style.display='none'">Cancel</button>
      </form>
    </div>
  </div>

  <!-- The Modal -->
  <div class="modal" id="entr.printDialog">
    <!-- Modal content -->
    <div class="modal-content">
      <span class="close" onclick="document.getElementById('entr.printDialog').style.display='none'">&times;</span>
      <form id="entr.print.form" class="form-container" onsubmit="entr_submitPrint(); return false;">
        <p>Print</p>
        <div>
          <input id="entr_radio_print_1" name="entr_print" type="radio" value="entr.print.1"
                 onchange="updateDisplayedParams('entr_print_1')" required checked/>
          <label for="entr_radio_print_1">Results</label>
        </div>
        <div>
          <input id="entr_radio_print_2" name="entr_print" type="radio" value="entr.print.2"
                 onchange="updateDisplayedParams('entr_print_2')" required/>
          <label for="entr_radio_print_2">Split times</label>
        </div>
        <p>Parameters</p>
        <div id="entr_print">
          <div id="entr_print_1" class="params">
              <input id="pdf_r_i" name="res_include_dns" type="checkbox" value="res.include_dns"/>
              <label for="pdf_r_i">Include not started competitors</label>
          </div>
          <div id="entr_print_2" class="params">
              <input id="pdf_sp_l" name="res_landscape" type="checkbox" value="res.landscape"/>
              <label for="pdf_sp_l">Landscape (page orientation)</label>
          </div>
        </div>
        <p></p>
        <p></p>
        <button type="submit" class="btn">Create PDF</button>
        <button type="button" class="btn cancel" onclick="document.getElementById('entr.printDialog').style.display='none'">Cancel</button>
      </form>
    </div>
  </div>

  <!-- The Modal -->
  <div class="modal" id="entr.addDialog">
  </div> 

  <!-- The Modal -->
  <div class="modal" id="entr.competitorsDialog">
  </div>

  <!-- The Modal -->
  <div class="modal" id="entr.deleteDialog">
    <!-- Modal content -->
    <div class="modal-content">
      <span class="close" onclick="document.getElementById('entr.deleteDialog').style.display='none'">&times;</span>
      <form id="entr.formDelete" class="form-container" onsubmit="entr_submitDelete(); return false;">
        <input id="entr.deleteId" name="id" type="text" hidden/>
        <p>Confirm: Delete the selected entry?</p>
        <button type="submit" class="btn">Delete</button>
        <button type="button" class="btn cancel" onclick="document.getElementById('entr.deleteDialog').style.display='none'">Cancel</button>
      </form>
    </div>
  </div>
  
  <!-- The Modal -->
  <div class="modal" id="entr.resultDialog">
  </div>

</div>


<script>
    var entr_view = "entries";
    var entr_comp_selected = null;

    function entr_reload_view(self) {
        entr_view = self.value;
        entr_update();
    }

    function entr_comp_highlight(e) {
        if (e.target.tagName == "TD") {
            if (entr_comp_selected) entr_comp_selected.className = '';
            entr_comp_selected = e.target.parentNode;
            entr_comp_selected.className = 'selected';
            document.getElementById('entry.comp.add').disabled = false;
            if (e.type == "dblclick") {
                entr_comp_save();
            }
        }
    }

    function entr_comp_save() {
        document.getElementById('entr.addCompId').value = entr_comp_selected.dataset.id;
        document.getElementById('ent_firstName').value = entr_comp_selected.getElementsByTagName('TD')[0].innerHTML;
        document.getElementById('ent_lastName').value = entr_comp_selected.getElementsByTagName('TD')[1].innerHTML;
        document.getElementById('ent_gender').value = entr_comp_selected.getElementsByTagName('TD')[2].innerHTML;
        document.getElementById('ent_year').value = entr_comp_selected.getElementsByTagName('TD')[3].innerHTML;
        document.getElementById('ent_chip').value = entr_comp_selected.getElementsByTagName('TD')[4].innerHTML;
        document.getElementById('ent_clubId').value = entr_comp_selected.getElementsByTagName('TD')[6].innerHTML;
        document.getElementById('entr.competitorsDialog').style.display = 'none';
    }

    var entr_selected = document.getElementById('entr.table').getElementsByClassName('selected')[0];

    function entr_highlight(e) {
        if (e.target.tagName == "TD") {
            if (entr_selected) entr_selected.className = '';
            entr_selected = e.target.parentNode;
            entr_selected.className = 'selected';
            document.getElementById('entr.myBtnDelete').disabled = false;
            document.getElementById('entr.myBtnResult').disabled = false;
            const assigned = entr_selected.dataset.assigned === "true";
            document.getElementById('entr.myBtnEdit').disabled = !assigned;
            if (e.type == "dblclick" && assigned) {
                entr_myEdit();
            }
        }
    }

    function entr_myImport() {
        document.getElementById('entr.importDialog').style.display = 'block';
        document.getElementById('entr_radio_import_1').checked = true;
        updateDisplayedParams("entr_import_1");
    }

    function entr_myExport() {
        document.getElementById('entr.exportDialog').style.display = 'block';
        document.getElementById('entr_radio_export_1').checked = true;
        updateDisplayedParams("entr_export_1");
    }

    function entr_myPrint() {
        document.getElementById('entr.printDialog').style.display = 'block';
        document.getElementById('entr_radio_print_1').checked = true;
        updateDisplayedParams("entr_print_1");
    }

    function entr_myAdd() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                document.getElementById('entr.addDialog').innerHTML = this.responseText;
                document.getElementById('entr.addDialog').style.display='block';
                align_form_table('entr.addFormTable');
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText);
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/fill_edit_form", true);
        var data = new FormData();
        data.append('event_id', window.event_id);
        data.append('id', '');
        xhr.send(data);
    }

    function entr_myCompetitors() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                document.getElementById('entr.competitorsDialog').innerHTML = this.responseText;
                document.getElementById('entr.competitorsDialog').style.display='block';
                document.getElementById('entr.comp.filter').focus()
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText);
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/fill_competitors_form", true);
        var data = {'event_id': window.event_id};
        xhr.send(data);
    }

    function entr_myEdit() {
        var table = document.getElementById('entr.table');
        for (var i = 1; i < table.rows.length; i++) {
            if (table.rows[i].className == "selected") { 
                var xhr = new XMLHttpRequest();
                xhr.onreadystatechange = function() {
                    if (this.readyState == 4 && this.status == 200) {
                        document.getElementById('entr.addDialog').innerHTML = this.responseText;
                        document.getElementById('entr.addDialog').style.display='block';
                        align_form_table('entr.addFormTable');
                    }
                    if (this.readyState == 4 && this.status == 409) {
                        window.alert(this.responseText);
                    }
                    if (this.readyState == 4 && this.status == 500) {
                        window.alert(this.responseText);
                    }
                };
                xhr.onerror = function() {
                    window.alert("Network error");
                };
                xhr.open("POST", "entry/fill_edit_form", true);
                var data = new FormData();
                data.append('event_id', window.event_id);
                data.append('id', table.rows[i].dataset.id);
                xhr.send(data);
            }
        }
    }

    function entr_myDelete() {
        var table = document.getElementById('entr.table');
        for (var i = 1; i < table.rows.length; i++) {
            if (table.rows[i].className == "selected") {
                document.getElementById('entr.deleteId').value=table.rows[i].dataset.id;
                document.getElementById('entr.deleteDialog').style.display='block'
            }
        }
    }

    function entr_myResult() {
        var table = document.getElementById('entr.table');
        for (var i = 1; i < table.rows.length; i++) {
            if (table.rows[i].className == "selected") {
                var xhr = new XMLHttpRequest();
                xhr.onreadystatechange = function() {
                    if (this.readyState == 4 && this.status == 200) {
                        document.getElementById('entr.resultDialog').innerHTML = this.responseText;
                        document.getElementById('entr.resultDialog').style.display = 'block';
                        tUpdateRows();
                    }
                    if (this.readyState == 4 && this.status == 409) {
                        window.alert(this.responseText);
                    }
                    if (this.readyState == 4 && this.status == 500) {
                        window.alert(this.responseText);
                    }
                };
                xhr.onerror = function() {
                    window.alert("Network error");
                };
                xhr.open("POST", "entry/fill_result_form", true);
                //xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
                var data = new FormData();
                data.append('event_id', window.event_id);
                data.append('id', table.rows[i].dataset.id);
                xhr.send(data);
            }
        }
    }

    function entr_submitImport() {
        var form = document.getElementById('entr.import.form');
        var data = new FormData(form);
        data.append('event_id', window.event_id);
        data.append('view', entr_view);
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                const obj = JSON.parse(this.responseText);
                entr_updateTable(obj.table);
                if ("status" in obj) {
                    document.getElementById('statusDialogContent').innerHTML = obj.status;
                    document.getElementById('statusDialog').style.display = "block";
                }
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText);
            }
            if (this.readyState == 4 && this.status == 413) {
                window.alert(this.responseText);
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/import", true);
        xhr.send(data);
    }

    function entr_submitExport() {
        var filename = '';
        var mimetype = 'application/xml';
        var form = document.getElementById('entr.export.form');
        var data = new FormData(form);
        data.append('event_id', window.event_id);
        data.append('view', entr_view);
        var selected = document.querySelector('input[name="entr_export"]:checked').value;
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                download(filename, this.response, mimetype);
                document.getElementById('entr.exportDialog').style.display = "none";
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(new TextDecoder().decode(this.response));
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(new TextDecoder().decode(this.response));
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/export", true);
        xhr.responseType = "arraybuffer";
        if (selected == "entr.export.1") {
            filename = "EntryList.xml";
        }
        if (selected == "entr.export.2") {
            filename = "ResultList.xml";
        }
        if (selected == "entr.export.3") {
            filename = "Splitsbrowser-ResultList.xml";
        }
        if (selected == "entr.export.4") {
            filename = "entries.csv";
            mimetype = "text/csv";
        }
        if (selected == "entr.export.5") {
            filename = "entries.csv";
            mimetype = "text/csv";
        }
        xhr.send(data);
    }

    function entr_submitPrint() {
        var form = document.getElementById('entr.print.form');
        var data = new FormData(form);
        data.append('event_id', window.event_id);
        data.append('view', entr_view);
        var selected = document.querySelector('input[name="entr_print"]:checked').value;
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4) {
                document.getElementById('progress').style.display = 'none';
                if (this.status == 200) {
                    download(filename, this.response, 'application/pdf');
                    document.getElementById('entr.printDialog').style.display = "none";
                }
                if (this.status == 409) {
                    showAlert(new TextDecoder().decode(this.response));
                }
                if (this.status == 500) {
                    showAlert(new TextDecoder().decode(this.response));
                }
            }
        };
        xhr.onerror = function() {
            showAlert("Network error");
        };
        xhr.open("POST", "entry/print", true);
        document.getElementById('progress').style.display='flex';
        xhr.responseType = "arraybuffer";
        if (selected == "entr.print.1") {
            filename = "result.pdf";
        };
        if (selected == "entr.print.2") {
            filename = "splittimes.pdf";
        };
        xhr.send(data);
    }

    function entr_submitAdd() {
        var form = document.getElementById('entr.formAdd');
        var data = new FormData(form);
        data.append('event_id', window.event_id);
        data.append('view', entr_view);
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                const obj = JSON.parse(this.responseText);
                filter_content = document.getElementById('entr.filter').value;
                entr_updateTable(obj.table);
                document.getElementById('entr.filter').value = filter_content;
                if (filter_content != "") {
                    filter_table('entr.table', 'tr', filter_content);
                }
                if ("status" in obj) {
                    document.getElementById('statusDialogContent').innerHTML = obj.status;
                    document.getElementById('statusDialog').style.display = "block";
                }
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText);
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/add", true);
        xhr.send(data);
    }

    function entr_submitDelete() {
        var form = document.getElementById('entr.formDelete');
        var data = new FormData(form);
        data.append('event_id', window.event_id);
        data.append('view', entr_view);
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                entr_updateTable(this.responseText)
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText)
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/delete", true);
        xhr.send(data);
    }

    function entr_update() {
        var xhr = new XMLHttpRequest();
        var data = new FormData();
        data.append('event_id', window.event_id);
        data.append('view', entr_view);
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                entr_updateTable(this.responseText);
                document.getElementById('entr.view').value = entr_view;
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText);
                evnt_update();
                openTab(event, 'Events');
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/update", true);
        xhr.send(data);
    }

    function set_entr_table_header_top() {
        h = document.getElementById('entr.actions').offsetHeight;
        document.getElementById('entr.theader').style.top = h - 1;

    }

    new ResizeObserver(set_entr_table_header_top).observe(document.getElementById('entr.actions'));

    function entr_updateTable(content) {
        // Get all elements with class="modal" and hide them
        modal = document.getElementsByClassName("modal");
        for (i = 0; i < modal.length; i++) {
            modal[i].style.display = "none";
        }
        document.getElementById('entr.results').innerHTML = content;
        document.getElementById('entr.myBtnEdit').disabled = true;
        document.getElementById('entr.myBtnDelete').disabled = true;
        document.getElementById('entr.myBtnResult').disabled = true;
        set_entr_table_header_top();
    }

    function tUpdateRows() {
        row = document.getElementById('punched_start_time');
        if (row != null) {
            tStatusUpdate(row);
            tBackgroundColorUpdate(row);
        }
        row = document.getElementById('punched_finish_time');
        if (row != null) {
            tStatusUpdate(row);
            tBackgroundColorUpdate(row);
        }
        rows = document.getElementById('punched_split_times').getElementsByTagName("tr");
        for (var j = 0; j < rows.length; j++) {
            tStatusUpdate(rows[j]);
            tBackgroundColorUpdate(rows[j]);
        }
    }

    function tStatusUpdate(row) {
        cells = row.getElementsByTagName("td");
        if (cells[0].innerHTML == "") {
            if (cells[3].innerHTML == "") {
                cells[4].innerHTML = "Removed";
            } else {
                cells[4].innerHTML = "Additional";
            }
        } else {
            if (cells[3].innerHTML == "") {
                cells[4].innerHTML = "Missing";
                cells[4].style.color = "red";
            } else {
                cells[4].innerHTML = "OK";
                cells[4].style.color = "green";
            }
        }
    }

    function tBackgroundColorUpdate(row) {
        cells = row.getElementsByTagName("td");
        if (cells[2].innerHTML == cells[3].innerHTML) {
            row.bgColor = "transparent";
        }
        else {
            row.bgColor = "LightGrey";
        }
    }
</script>


<!-- The Modal -->
<div class="modal" id="entr.editPunchDialog">
    <!-- Modal content -->
    <div class="modal-content" style="margin: 10% 10% 5%;">
        <span class="close" onclick="document.getElementById('entr.editPunchDialog').style.display='none'">&times;</span>
        <form id="entr.formPunchEdit" class="form-container" onsubmit="entr_submitPunchEdit(); return false;">
            <p>Command</p>
            <div id="div_edit_punch_edit">
                <input id="entr_radio_ep_edit" name="command" type="radio" value="entr_ep_edit"
                       onchange="updateDisplayedParams('entr_ep_edit')" required checked/>
                <label for="entr_radio_ep_edit">Edit the selected punch</label>
            </div>
            <div id="div_edit_punch_del">
                <input id="entr_radio_ep_del" name="command" type="radio" value="entr_ep_del"
                       onchange="updateDisplayedParams('entr_ep_del')" required/>
                <label for="entr_radio_ep_del">Remove the selected punch</label>
            </div>
            <div id="div_edit_punch_add">
                <input id="entr_radio_ep_add" name="command" type="radio" value="entr_ep_add"
                       onchange="updateDisplayedParams('entr_ep_add')" required/>
                <label for="entr_radio_ep_add">Add an additional punch before the selected punch</label>
            </div>
            <p>Parameters</p>
            <div id="edit_punch_command">
                <div id="entr_ep_edit" class="params">
                    <p>Leave time field blank if time is unknown</p>
                    <table>
                        <tr>
                            <th class="input-header"><label for="punch_control_edit" disabled>Control</label></th>
                            <td><input id="punch_control_edit" name="control" type="text" readonly value=""/></td>
                        </tr>
                        <tr>
                            <th class="input-header"><label id="punch_time_edit_label" for="punch_time_edit">Time</label></th>
                            <td><input id="punch_time_edit" name="punch_time" type="time" step="1" value="" oninput="mark_label(this)"/></td>
                        </tr>
                    </table>
                </div>
                <div id="entr_ep_del" class="params">
                    <table>
                        <tr>
                            <th class="input-header"><label for="punch_control_del" disabled>Control</label></th>
                            <td><input id="punch_control_del" name="control" type="text" readonly value=""/></td>
                        </tr>
                    </table>
                </div>
                <div id="entr_ep_add" class="params">
                    <p>Leave time field blank if time is unknown</p>
                    <table>
                        <tr>
                            <th class="input-header"><label for="punch_control_add">Control *</label></th>
                            <td><input id="punch_control_add" name="control" type="number" class="required" min="1" max="999" value="" oninput="mark_label(this)"/></td>
                        </tr>
                        <tr>
                            <th class="input-header"><label for="punch_time_add">Time</label></th>
                            <td><input id="punch_time_add" name="punch_time" type="time" step="1" value="" oninput="mark_label(this)"/></td>
                        </tr>
                    </table>
                </div>
            </div>
            <p></p>
            <p></p>
            <button type="submit" class="btn">Save</button>
            <button type="button" class="btn cancel" onclick="document.getElementById('entr.editPunchDialog').style.display='none'">Cancel</button>
        </form>
    </div>
</div>


<script>
    var selectedRow = 0;

    function entr_myPunchEdit(j) {
        selectedRow = j;

        if (j == -1) {
            cells = document.getElementById("punched_start_time").cells;
            document.getElementById('div_edit_punch_add').hidden = true;
            document.getElementById('punch_time_edit').className = 'required';
            document.getElementById('punch_time_edit_label').innerText = 'Time *';

        } else if (j == -2) {
            cells = document.getElementById("punched_finish_time").cells;
            document.getElementById('div_edit_punch_add').hidden = true;
            document.getElementById('punch_time_edit').className = 'required';
            document.getElementById('punch_time_edit_label').innerText = 'Time *';

        } else {
            var tbody = document.getElementById("punched_split_times");
            var cells = tbody.rows[j].cells;
            document.getElementById('div_edit_punch_add').hidden = false;
            document.getElementById('punch_time_edit').className = '';
            document.getElementById('punch_time_edit').required = false;
            document.getElementById('punch_time_edit_label').innerText = 'Time';
        }

        document.getElementById('entr_radio_ep_edit').checked = true;
        document.getElementById('punch_control_edit').defaultValue = cells[1].innerHTML;
        document.getElementById('punch_control_edit').value = cells[1].innerHTML;
        document.getElementById('punch_control_del').defaultValue = cells[1].innerHTML;
        document.getElementById('punch_control_del').value = cells[1].innerHTML;
        document.getElementById('punch_control_add').defaultValue = "";
        document.getElementById('punch_control_add').value = "";
        document.getElementById('punch_time_add').defaultValue = "";
        document.getElementById('punch_time_add').value = "";
        document.getElementById('div_edit_punch_del').hidden = cells[3].innerText == "";

        punch_time_edit = document.getElementById('punch_time_edit')
        if (cells[3].innerText == "") {
            punch_time_edit.defaultValue = cells[2].innerText;
            punch_time_edit.value = cells[2].innerText;
        } else if (cells[3].innerText == "Unknown") {
            punch_time_edit.defaultValue = "";
            punch_time_edit.value = "";
        } else {
            punch_time_edit.defaultValue = cells[3].innerText;
            punch_time_edit.value = cells[3].innerText;
        }

        // Reset label color if dialog is already used and opened a second time
        element = document.getElementById("edit_punch_command");
        label = element.getElementsByTagName("label");
        for (i = 0; i < label.length; i++) {
            label[i].style.color = 'inherit';
        }

        updateDisplayedParams('entr_ep_edit');
        document.getElementById('entr.editPunchDialog').style.display='block';
    }

    function entr_submitPunchEdit() {
        var form = document.getElementById('entr.formPunchEdit');
        var data = new FormData(form);
        data.append('selectedRow', selectedRow);
        data.append('event_id', window.event_id);
        data.append('entry_id', document.getElementById('entr.spId').value);
        e = document.getElementById('entr.result.punched_start_time')
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                document.getElementById('entr.resultDialog').innerHTML = this.responseText;
                tUpdateRows();
                document.getElementById('entr.editPunchDialog').style.display='none'
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText)
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/editPunch", true);
        xhr.send(data);
    }

    function entr_submitSplitTimes() {
        var form = document.getElementById('entr.formSplitTimes');
        var data = new FormData(form);
        data.append('event_id', window.event_id);
        data.append('view', entr_view);
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                entr_updateTable(this.responseText)
            }
            if (this.readyState == 4 && this.status == 409) {
                window.alert(this.responseText)
            }
            if (this.readyState == 4 && this.status == 500) {
                window.alert(this.responseText);
            }
        };
        xhr.onerror = function() {
            window.alert("Network error");
        };
        xhr.open("POST", "entry/splitTimes", true);
        xhr.send(data);
    }
</script>