{% comment %}
This file is licensed under the MIT License (MIT) available on
http://opensource.org/licenses/MIT.
{% endcomment %}

<div class="walletmenu" id="walletmenu" onclick="walletMenuListener(event);" ontouchstart="walletMenuListener(event);">
{% assign platformsByPlatform = site.platforms | group_by: "platform" %}
  <ul>
  {% for platform in platformsByPlatform %}

    {% comment %}
      ! WORKAROUND START
      Working around an issue with getting proper platform name from the list
      of platforms. After original group_by, the "name" key becomes a stringified
      hash. So we need to make these "hackish" transformations to make it working
      properly.
    {% endcomment %}
    {% capture platformName %}{{ platform.name | split: "=>" | last | split: '"' }}{% endcapture %}
    {% assign platformName = platformName | trim | replace: '}' '' | replace: ' ' '' %}
    {% comment %}
      ! WORKAROUND END
    {% endcomment %}

    {% assign platformClass = "wallet-" | append: platformName %}
    {% if page.id contains platformName %}
      {% assign platformClass = platformClass | append: " active" %}
    {% endif %}
    <li class="{{ platformClass }}">
      {% if platformName == 'hardware' or platformName == 'web' %}
      {% assign platformHref = "/" | append: page.lang | append: "/wallets/" | append: platformName | append: "/" %}
        <a href="{{ platformHref }}">{% translate walletcat{{platformName}} choose-your-wallet %}</a>
      {% else %}
        <a>{% translate walletcat{{platformName}} choose-your-wallet %}</a>
      {% endif %}
      {% if platform.items.size > 1 %}
        <ul>
        {% for item in platform.items %}
          {% assign osClass = "wallet-" | append: item.os.name %}
          {% if page.id contains item.id %}
            {% assign osClass = osClass | append: " active" %}
          {% endif %}
          <li class="{{ osClass }}">
            <a href="/{{ page.lang }}/wallets/{{ platformName }}/{{ item.os.name }}/">
              {% translate platform{{item.os.name}} choose-your-wallet %}
            </a>
          </li>
        {% endfor %}
        </ul>
      {% endif %}
    </li>
  {% endfor %}
  </ul>
</div>