{% extends "mobile/base.html" %}

{% block left_button %}
{% if servers %}
<div id="servers">
  <select data-native-menu="false" data-theme="c">
      <option>Servers</option>
    {% for server in servers %}
      <option id="{{ server.label }}_server" data-id="{{ server.id }}" {{ 'selected' if server.id == active_server }}>{{ server.label }}</option>
    {% endfor %}
  </select>
</div>
{% endif %}
{% endblock %}


{% block header %}<h1>XBMC</h1>{% endblock %}

{% block navbar %}
  <div data-role="navbar">
    <ul id="header_controls">
      <li><a class=
        "control stop" data-command="stop" href="#"><span class="icon">Stop</span></a></li>
      <li><a class="control play_pause" data-command="play_pause" href="#"><span class="icon">Play / Pause</span></a></li>
    </ul>
  </div>
{% endblock %}

{% block content %}
<ul data-role="listview">
    <li><a href="{{ url_for('recently_added_episodes') }}">Recently added episodes</a></li>
    <li><a href="{{ url_for('recently_added_movies') }}">Recently added movies</a></li>
    <li><a href="{{ url_for('recently_added_albums') }}">Recently added albums</a></li>
    <li><a href="{{ url_for('movie_library') }}">Movies</a></li>
    <li><a href="{{ url_for('tv_library') }}">TV Shows</a></li>
</ul>
{% endblock %}
