<div class="uk-width-1-5@xl uk-width-1-4@m uk-width-1-1">
  <%# DESKTOP %>
  <div class="sidebar uk-visible@m" uk-height-viewport="offset-top: true">
    <h2 class="uk-text-center uk-margin-remove-bottom uk-margin-remove-top uk-padding">Wiki</h2>

    <div class="uk-overflow-auto uk-margin-left" style="max-height: calc(100vh - 80px - 121px);" id="wiki-nav">
      <h4>General</h4>
      <hr class="esm-border-color-blue">
      <ul class="uk-list uk-visible@s sidebar-items">
        <%= link_to wiki_path, id: "link-wiki" do %>
          <li class="<%= "selected" if action_name == "index" %>">
            Getting Started
          </li>
        <% end %>

        <%# <%= link_to wiki_getting_started_v2_path, id: "link-wiki" do %>
          <%# <li class="<%= "selected" if action_name == "getting_started_v2" %>
          <%# Getting Started (<code>@esm v2</code>) %>
          <%# </li> %>
          <%# <% end %>

          <%= link_to wiki_commands_path, id: "commands-link" do %>
            <li class="<%= "selected" if action_name == "commands" %>">
              Commands
            </li>
          <% end %>
        </ul>

        <h4>How To <small>(Server)</small></h4>
        <hr class="esm-border-color-blue">
        <ul class="uk-list uk-visible@s sidebar-items">
          <%= link_to wiki_gambling_path, id: "link-gambling" do %>
            <li class="<%= "selected" if action_name == "gambling" %>">
              Gambling
            </li>
          <% end %>

          <%= link_to wiki_notification_configuration_path, id: "link-notification_configuration"  do %>
            <li class="<%= "selected" if action_name == "notification_configuration" %>">
              Notifications
            </li>
          <% end %>

          <%= link_to wiki_server_xm8_notification_routing_path, id: "link-admin_xm8_routing"  do %>
            <li class="<%= "selected" if action_name == "server_xm8_notification_routing" %>">
              XM8 Notification Routing
            </li>
          <% end %>
        </ul>

        <h4>How To <small>(Player)</small></h4>
        <hr class="esm-border-color-blue">
        <ul class="uk-list uk-visible@s sidebar-items">
          <%= link_to wiki_player_xm8_notification_routing_path, id: "link-player_xm8_routing"  do %>
            <li class="<%= "selected" if action_name == "player_xm8_notification_routing" %>">
              XM8 Notification Routing
            </li>
          <% end %>
        </ul>

        <h4>Changelogs</h4>
        <hr class="esm-border-color-blue">
        <ul class="uk-list uk-visible@s sidebar-items">
          <% WikiController::CHANGELOG_ENTRIES.each do |date| %>
            <%= link_to wiki_changelog_path(date: date), id: "link-#{date}" do %>
              <li class="<%= "selected" if @changelog == date %>">
                <%= date %>
              </li>
            <% end %>
          <% end %>
        </ul>

        <h4>API</h4>
        <hr class="esm-border-color-blue">
        <ul class="uk-list uk-visible@s sidebar-items">
          <% WikiController::API_ENTRIES.each do |entry| %>
            <%= link_to wiki_api_path(function: entry), id: "link-#{entry}" do %>
              <li class="<%= "selected" if @function == entry %>">
                ESM_<%= entry %>
              </li>
            <% end %>
          <% end %>
        </ul>

        <h4>Legal</h4>
        <hr class="esm-border-color-blue">
        <ul class="uk-list uk-visible@s sidebar-items">
          <%= link_to wiki_tos_path, id: "link-tos" do %>
            <li class="<%= "selected" if action_name == "tos" %>">
              Terms of Use
            </li>
          <% end %>

          <%= link_to wiki_privacy_path, id: "link-privacy" do %>
            <li class="<%= "selected" if action_name == "privacy" %>">
              Privacy Policy
            </li>
          <% end %>
        </ul>
      </div>
    </div>

    <%# MOBILE %>
    <div class="uk-hidden@m uk-container uk-margin-top">
      <h2 class="uk-text-center">Wiki</h2>
      <ul class="uk-list uk-text-center">
        <li class="<%= action_name == "index" ? "uk-active" : "" %>"><%= link_to "Getting Started", wiki_path %></li>
        <%# <li class="<%= action_name == "getting_started_v2" ? "uk-active" : "" %>
        <%# <%= link_to "Getting Started (<code>@esm v2</code>)".html_safe, wiki_getting_started_v2_path %>
        <%# </li> %>
        <li class="<%= action_name == "commands" ? "uk-active" : "" %>"><%= link_to "Commands", wiki_commands_path %></li>
        <li class="<%= action_name == "notification_configuration" ? "uk-active" : "" %>"><%= link_to "Notification Configuration", wiki_notification_configuration_path %></li>
        <li class="<%= action_name == "gambling" ? "uk-active" : "" %>"><%= link_to "Gambling", wiki_gambling_path %></li>
        <li class="<%= action_name == "api" ? "uk-active" : "" %>"><%= link_to "API", wiki_api_path %></li>
        <li class="<%= action_name == "tos" ? "uk-active" : "" %>"><%= link_to "Terms of Service", wiki_tos_path %></li>
        <li class="<%= action_name == "privacy" ? "uk-active" : "" %>"><%= link_to "Privacy Policy", wiki_privacy_path %></li>
      </ul>
      <% if action_name == "api" %>
        <select class="uk-select uk-margin api-switcher">
          <% WikiController::API_ENTRIES.each do |entry| %>
            <option value="<%= wiki_api_path(function: entry) %>" <%= "selected" if @function == entry %>>
                        <%= entry %>
                    </option>
            <% end %>
          </select>
        <% end %>
      </div>
    </div>