<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" th:replace="base::layout(~{::title}, ~{::main})">
<head>
  <title>Process Model Choice</title>
</head>
<body>
<main>
  <section class="pt-6 pb-6 pl-5 pr-5">
    <form class="pt-3" th:action="@{/enactpm}" method="post">
      <p class="is-size-4">Choose the Process Model to be enacted</p>

      <div class="field has-addons">
        <div class="control is-expanded">
          <div class="select is-fullwidth">
            <select id="dropDownList" name="pmiri"
                    th:onchange="'window.location.href = \'' + @{/gettraces} + '?iri=\' + encodeURIComponent(this.value) ' ">
              <option th:value="1">select PM</option>
              <option th:each="pm: ${pms}" th:value="${pm.iri}" th:text="${pm}"
                      th:selected="${pm.iri == current}"></option>
            </select>
          </div>
        </div>
        <div class="control">
          <button type="submit" class="button is-primary" name="action" value="new">Start New Enactment</button>
        </div>
      </div>
    </form>
    <section th:if="${traces != null}">
      <p>This Process Model has ongoing enactments. Do you wish to continue with a previously started enactment?</p>
      <table class="table is-striped is-hoverable is-fullwidth">
        <thead>
        <tr>
          <th>Name</th>
          <th><abbr title="Internationalized Resource Identifier">IRI</abbr></th>
          <th>Start Time</th>
          <th></th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="trace: ${traces}" class="trace-continuation-row" th:attr="data-name=${trace.name},data-iri=${trace.iri},data-timestamp=${trace.timestampF},data-action=@{/enactpm}">
          <th th:text="${trace.name}"></th>
          <td th:text="${trace.iri}"></td>
          <td th:text="${trace.timestampF}"></td>
          <td><button class="button is-primary is-small">Continue Enactment</button></td>
        </tr>
        </tbody>
      </table>
    </section>
  </section>
</main>
</body>
</html>
