go.charczuk.com@v0.0.0-20240327042549-bc490516bd1a/projects/kana-server/pkg/static/_views/quiz.html (about)

     1  <!--
     2  Copyright (c) 2023 - Present. Will Charczuk. All rights reserved.
     3  Use of this source code is governed by a MIT license that can be found in the LICENSE file at the root of the repository.
     4  -->
     5  {{ define "quiz" }} {{ template "header" . }}
     6  <div class="container quiz">
     7    <div class="row">
     8  
     9      <div class="four columns align-center">
    10        <div class="latest-result">
    11          {{ $latest := .Quiz.LatestResult }}
    12          {{ if $latest }}
    13          {{ if $latest.Correct }}
    14          <h1 class="bp3-heading text-intent-success">Correct</h1>
    15          <h1>{{ $latest.Prompt }} is {{ $latest.Expected }}</h1>
    16          {{ else }}
    17          <h1 class="bp3-heading text-intent-danger">Incorrect</h1>
    18          <h1>{{ $latest.Prompt }} is {{ $latest.Expected }}</h1>
    19          {{ end }}
    20          {{ else }}
    21          <h4 class="bp3-heading bp3-text-muted">No Answers Yet</h4>
    22          {{ end }}
    23        </div>
    24      </div>
    25  
    26      <div class="four columns align-center bp3-card">
    27        <form class="bp3-form" method="POST" action="/quiz/{{ .Quiz.ID }}/answer" autocomplete="off">
    28          <input type="hidden" name="createdUTC" value="{{ .CreatedUTC | time_unix_nano }}" />
    29          <input type="hidden" name="prompt" value="{{ .Prompt }}" />
    30          <input type="hidden" name="expected" value="{{ .Expected }}" />
    31          <h1 class="quiz-prompt">{{ .Prompt }}</h1>
    32          <input type="text" name="actual" class="bp3-input bp3-large bp3-fill" dir="auto" tabindex="0" autofocus
    33            required />
    34          <input type="submit" style="display: none" />
    35        </form>
    36      </div>
    37  
    38      <div class="four columns quiz-stats-sidebar bp3-text-small">
    39        <!-- quiz settings -->
    40        <div class="bp3-card">
    41          <h6 class="bp3-heading">Quiz</h6>
    42          {{ if .Quiz.Hiragana }}
    43          <div class="row">
    44            <label class="bp3-text-muted six columns">Includes Hiragana</label>
    45          </div>
    46          {{ end }}
    47          {{ if .Quiz.Katakana }}
    48          <div class="row">
    49            <label class="bp3-text-muted six columns">Includes Katakana</label>
    50          </div>
    51          {{ end }}
    52          <div class="row">
    53            <label class="bp3-text-muted six columns">Answered / Max</label>
    54            <div class="align-right">
    55              {{.Quiz.Stats.Total}} / {{ .Quiz.MaxQuestions }}
    56            </div>
    57          </div>
    58          <div class="row">
    59            <label class="bp3-text-muted six columns">Max Prompt Count</label>
    60            <div class="align-right">
    61              {{ .Quiz.MaxPrompts }}
    62            </div>
    63          </div>
    64          <div class="row">
    65            <label class="bp3-text-muted six columns">Max Repeat History</label>
    66            <div class="align-right">
    67              {{ .Quiz.MaxRepeatHistory }}
    68            </div>
    69          </div>
    70        </div>
    71  
    72        <!-- quiz stats -->
    73        <div class="bp3-card">
    74          {{ $stats := .Quiz.Stats }}
    75          <h6 class="bp3-heading">Overall Stats.</h6>
    76          <div class="row">
    77            <label class="bp3-text-muted six columns">Total</label>
    78            <div class="align-right six columns">
    79              {{ $stats.Correct }} / {{ $stats.Total }} / {{ $stats.PercentCorrect | printf "%.2f" }}%
    80            </div>
    81          </div>
    82          <div class="row">
    83            <label class="bp3-text-muted six columns">Average</label>
    84            <div class="align-right six columns">
    85              {{ $stats.ElapsedAverage | duration_round_millis }}
    86            </div>
    87          </div>
    88          <div class="row">
    89            <label class="bp3-text-muted six columns">90th Percentile</label>
    90            <div class="align-right six columns">
    91              {{ $stats.ElapsedP90 | duration_round_millis }}
    92            </div>
    93          </div>
    94        </div>
    95  
    96        <!-- prompt stats -->
    97        <div class="bp3-card">
    98          {{ $promptStats := .Quiz.PromptStats }}
    99          <h6 class="bp3-heading">Kana Stats.</h6>
   100          <div class="bp3-heading row">
   101            <label class="bp3-text-muted six columns text-underline">Kana</label>
   102            <div class="align-right six columns text-underline">Pct. Correct / Weight</div>
   103          </div>
   104          {{ range $index, $kana := $promptStats }}
   105          <div class="row">
   106            <label class="bp3-text-muted six columns">{{ $kana.Prompt }}</label>
   107            <div class="align-right six columns">
   108              {{ $kana.PercentCorrect | printf "%.2f" }}% / {{ $kana.Weight }}
   109            </div>
   110          </div>
   111          {{ else }}
   112          <div class="row">
   113            <div class="bp3-text-muted twelve columns align-center">No Answers Yet</div>
   114          </div>
   115          {{ end }}
   116        </div>
   117      </div>
   118    </div>
   119  </div>
   120  {{ template "footer" . }}
   121  {{ end }}