<!DOCTYPE html>
<html lang="en">

<head>

  <!-- 
    This is the Handlebars template for the Admin page 
    - The page displays the current list of logs returned by server.js
    - The user can clear the log by first setting up an admin key
  -->

  <meta charset="utf-8" />
  <link rel="icon" href="https://glitch.com/favicon.ico" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />

  <title>Hello SQLite: Logs</title>

  <!-- Import the webpage's stylesheet -->
  <link rel="stylesheet" href="/style.css" />

</head>

<body>
  <div class="wrapper">
    <div class="content" role="main">

      <!-- This is the start of content for our page -->
      {{#if error}}
      <p class="error">
        {{error}}
      </p>
      {{else}}

      <!-- The server script returns the logs in an array -->
     
      <!-- Write out a table row for each entry in the log array showing choice and timestamp -->
      {{#if schedule.length}}
          <div>
            <h2>League Schedule</h2>
            <table>
              <tr>
                <th>Date</th>
                <th>Home Team</th>
                <th>Away Team</th>
                <th></th>
              </tr>
              {{#each schedule}}
                <tr>
                  <td>{{date}}</td>
                  <td>{{hometeam}}</td>
                  <td>{{awayteam}}</td>
                  <td> <form action="/deleteGame" method="post" onsubmit="return confirm('Do you really want to delete this game?');"><input type="text" id="gameid" name="gameid" style="display: none;" value="{{id}}"/><button type="submit">Delete Game</button></form>
                   </td>
                </tr>
              {{/each}}
            </table>
          </div>
      {{else}}
      <p class="error">
        No records!
      </p>
      {{/if}}

      <!-- The user can clear the logs if they first set up an admin key in the env -->
      <form action="/addGame" method="post">
        <h2>
          Add Game
        </h2>
       
               
        <!-- Server returns a failed flag if the submitted key doesn't match -->
        {{#if failed}}
        <p class="error">
          {{failed}}
        </p>
        {{/if}}
        Date: <input type="text" id="date" name="date" required>
        Home Team: <select id="hometeam" name="hometeam">
          {{#each teams}}
            <option value="{{id}}">{{name}}</option>
              
          {{/each}}
        </select>
        Away Team: <select id="awayteam" name="awayteam">
          {{#each teams}}
            <option value="{{id}}">{{name}}</option>
              
          {{/each}}
        </select>
        <button type="submit">Insert Game</button>
      </form>
      
      {{#if stats.length}}
          <div>
            <h2>Player Stats</h2>
            <table>
              <tr>
                <th>Name</th>
                <th>Team</th>
                <th>Goals</th>
                <th>Assists</th>
              </tr>
              {{#each stats}}
                <tr>
                  <td>{{name}}</td>
                  <td>{{team}}</td>
                  <td>{{goals}}</td>
                  <td>{{assists}}</td>
                  
                </tr>
              {{/each}}
            </table>
          </div>
      {{else}}
      <p class="error">
        No records!
      </p>
      {{/if}}
      <form action="/addPlayer" method="post">
        <h2>
          Add Player
        </h2>
       
        First Name: <input type="text" id="fname" name="fname" required>
        Last Name: <input type="text" id="lname" name="lname" required>
        Email: <input type="text" id="email" name="email" required>
        TeamID: <input type="text" id="teamid" name="teamid" value="{{teamid}}" required>
        
        <button type="submit">Insert Player</button>
      </form>
      {{/if}}
    </div>
  </div>
  <!-- The footer holds our remix button — you can use it for structure or cut it out ✂ -->
  <footer class="footer">
    <div class="links"></div>
    <a href="/">Home</a>
    <span class="divider">|</span>
    <a href="/logs">Admin</a>
    <a class="btn--remix" target="_top" href="https://glitch.com/edit/#!/remix/glitch-hello-sqlite">
      <img src="https://cdn.glitch.com/605e2a51-d45f-4d87-a285-9410ad350515%2FLogo_Color.svg?v=1618199565140"
        alt="" />
      Remix on Glitch
    </a>
  </footer>
</body>

</html>
