index.html

---
layout: default
title: Regions
---

<div class="columns narrow-reverse-columns">
  <div class="column is-6">
    <h2 class="title is-2">Regions</h2>
    <table class="table is-bordered is-striped is-narrow is-hoverable is-fullwidth has-sticky-header regions" id="regions">
      <thead>
        <tr>
          <th scope="col" class="sort" data-sort="name">Region <i class="fas fa-sort"></i></th>
          <th scope="col" class="sort has-text-centered" data-sort="tried">Tried <i class="fas fa-sort"></i></th>
          <th scope="col" class="sort has-text-centered" data-sort="to_try">To Try <i class="fas fa-sort"></i></th>
          <th scope="col" class="sort has-text-centered" data-sort="mean_rating">Mean Rating <i class="fas fa-sort"></i></th>
        </tr>
      </thead>
      
      <tbody class="list">
        {% for region in site.data %}
          {% assign tried_counter = tried_counter | plus: region[1].tried.size %}
          {% assign to_try_counter = to_try_counter | plus: region[1].to_try.size %}
          {% assign total_rating = 0 %}

          {% if region[1].tried.size > 0 %}
            {% for whisky in region[1].tried %}
              {% assign total_rating = total_rating | plus: whisky.rating %}
            {% endfor %}
            {% assign mean_rating = total_rating | times: 1000 | divided_by: region[1].tried.size %}
            {% assign mean_rating = mean_rating | divided_by: 1000.0 %}
            {% assign mean_rating = mean_rating | round: 1 %}
          {% else %}
            {% assign mean_rating = 0 %}
          {% endif %}

          <tr>
            <td class="name pt-2 pb-2" scope="row"><a href="/{{ region[0] }}">{{ region[0] | replace: "-", " " | capitalize }}</a></td>
            <td class="tried pt-2 pb-2 has-text-centered" scope="row">{{ region[1].tried.size | default: 0 }}</td>
            <td class="to_try pt-2 pb-2 has-text-centered" scope="row">{{ region[1].to_try.size | default: 0 }}</td>
            {% if tried_counter > 0 %}
              <td class="mean_rating pt-2 pb-2 has-text-centered" scope="row">{{ mean_rating }}</td>
            {% else %}
              <td class="mean_rating pt-2 pb-2 has-text-centered" scope="row">0</td>
            {% endif %}
          </tr>
        {% endfor %}
          <tr class="unsortable totals">
            <td class="name pt-2 pb-2" scope="row">Totals:<br />
              <a class="show-means" data-target=".regions" href="#">(show mean ratings)</a>
            </td>
            <td class="tried pt-2 pb-2 has-text-centered" scope="row">{{ tried_counter }}</td>
            <td class="to_try pt-2 pb-2 has-text-centered" scope="row">{{ to_try_counter }}</td>
            <td></td>
          </tr>
      </tbody>
    </table>
  </div>

  <div class="column is-5 is-offset-1">
    <h3 class="title is-4 mt-5">Search:</h3>
    <div class="content">
      <input class="input" type="text" id="search" placeholder="Search whisky names...">
      <ul class="search-results" id="results"></ul>
    </div>
    
    <h3 class="title is-4 mt-5">Rating definitions:</h3>
    <ul>
      <li class="mb-2"><b>0</b>: Not good, won't drink again</li>
      <li class="mb-2"><b>1</b>: Ok, may drink again if low on options</li>
      <li class="mb-2"><b>2</b>: Excellent, likely to drink again</li>
      <li class="mb-2"><b>3</b>: Superb, should own</li>
    </ul>
  </div>
</div>

<script type="text/javascript" src="/assets/js/index.js"></script>