{{/*
  Copyright 2014 Team 254. All Rights Reserved.
  Author: pat@patfairbank.com (Patrick Fairbank)

  UI for entering realtime scores.
*/}}
{{define "title"}}Scoring{{end}}
{{define "body"}}
<div class="row">
  <div class="text-center" id="waitingMessage" style="display: none;">
    <h3>Waiting for the next match...</h3>
  </div>
  <div id="autoScoring" class="col-lg-12 well well-{{.Alliance}}" style="display: none;">
    <div class="col-lg-6">
      <div>
        <h2>Autonomous Period</h2>
        <p>Use the following keyboard shortcuts:</p>
        <div class="row">
          <div class="col-lg-3 col-lg-offset-1 scoring">r/R</div>
          <div class="col-lg-8 scoring-comment">Auto runs +/-</div>
        </div>
        <div class="row">
          <div class="col-lg-3 col-lg-offset-1 scoring">Enter</div>
          <div class="col-lg-8 scoring-comment">Commit autonomous score</div>
        </div>
      </div>
    </div>
    <div class="col-lg-6">
      <div>
        <h2>Autonomous Score</h2>
        <div class="row">
          <div class="col-lg-4 col-lg-offset-1 scoring-comment">Auto runs</div>
          <div class="col-lg-2 scoring-comment" id="autoRuns"></div>
        </div>
        <h3 class="text-center scoring-message">Press Enter to commit autonomous score</h3>
      </div>
    </div>
  </div>
  <div id="teleopScoring" class="col-lg-12 well well-{{.Alliance}}" style="display: none;">
    <div class="col-lg-6">
      <div>
        <h2>Teleoperated Period</h2>
        <p>Use the following keyboard shortcuts:</p>
        <div class="row">
          <div class="col-lg-3 col-lg-offset-1 scoring">c/C</div>
          <div class="col-lg-8 scoring-comment">Climbs +/- (ignore Levitate)</div>
        </div>
        <div class="row">
          <div class="col-lg-3 col-lg-offset-1 scoring">a</div>
          <div class="col-lg-8 scoring-comment">Back to autonomous</div>
        </div>
      </div>
    </div>
    <div class="col-lg-6">
      <div>
        <h2>Teleoperated Score</h2>
        <div class="row">
          <div class="col-lg-4 col-lg-offset-1 scoring-comment">Climbs</div>
          <div class="col-lg-2 scoring-comment" id="climbs"></div>
        </div>
      </div>
    </div>
  </div>
  <div class="text-center col-lg-12">
    <button type="button" class="btn btn-info" id="commitMatchScore" onclick="commitMatchScore();"
        style="display: none;">Commit Final Match Score</button>
  </div>
</div>
{{end}}
{{define "script"}}
<script>
  var alliance = "{{.Alliance}}";
</script>
<script src="/static/js/match_timing.js"></script>
<script src="/static/js/scoring_display.js"></script>
{{end}}
