{% extends "base.html" %}

{% block head %}
<link rel="stylesheet" href="{{ url_for('static', filename='index.css') }}">
{% endblock %}

{% block content %}
<div id="outer">
    <nav id="sidebar">
        {% set quads = {"ade":"♢", "bea":"♡", "cam":"♧", "des":"♤"} %}
        {% for quad in quads %}
        {% if sdomains[quad] %}
        <div style="--hue: var(--{{ quad }});">
            <h2>{{ quads[quad] }}</h2>
            <ul>
                {% for domain in sdomains[quad] %}
                <li><a href="{{ sdomains[quad][domain] }}">{{ domain }}</a></li>
                {% endfor %}
            </ul>
        </div>
        {% endif %}
        {% endfor %}
    </nav>
    <main>
        <nav id="sector">
            <a href="/ade" style="--hue: 130;">♢</a>
            <a href="/bea" style="--hue: 242;">♡</a>
            <a href="/cam" style="--hue: 350;">♧</a>
            <a href="/des" style="--hue: 73;">♤</a>
        </nav>
        <hr id="sectorbar">
        <div id="main-split">
            <div id="apps">
                {% for category in domains[quad] %}
                <div>
                    <h2>{{ category }}</h2>
                    <ul>
                        {% for domain in domains[quad][category] %}
                        {% if domains[quad][category][domain] %}
                        <li><a href="{{ domains[quad][category][domain] }}">{{ domain }}</a></li>
                        {% else %}
                        <li><a class="failed">{{ domain }}</a></li>
                        {% endif %}
                        {% endfor %}
                    </ul>
                </div>
                {% endfor %}
                {% if fpdata["links"] %}
                <div>
                    <h2>Links</h2>
                    <ul>
                        {% for link in fpdata["links"] %}
                        <li><a href="{{ fpdata['links'][link] }}">{{ link }}</a></li>
                        {% endfor %}
                    </ul>
                </div>
                {% endif %}
            </div>
            <div id="other">
                <div id="welcome">
                    <h2>{{ fpdata["header"] }}</h2>
                    <p>{{ fpdata["text"] }}</p>
                    <i>For assistance, please contact the Sector Administrator at <a
                            href="mailto:{{ fpdata['email'] }}@icolotl.com">{{ fpdata['email'] }}@icolotl.com</a>.</i>
                </div>
                <div id="login">
                    <h2>Index Unified Login</h2>
                    <form method="post" action="{{ url_for('login') }}">
                        {% if session["username"] %}
                        <span>Welcome, <b>{{ session["username"] }}</b>.</span>
                        <input type="submit" value="Log Out">
                        {% else %}
                        <label for="username">Username:</label>
                        <input id="username" name="username" autocomplete="username">
                        <label for="password">Password:</label>
                        <input type="password" id="password" name="password" autocomplete="current-password">
                        <input type="submit" value="Log In">
                        {% endif %}
                    </form>
                </div>
                <div id="news">
                    <h2>News</h2>
                    <h3>Error: Not Implemented</h3>
                    <p>Unable to connect to Index Feed.</p>
                    <hr>
                    <h3>Example Text</h3>
                    <p>Foo, Bar, Baz, Quux</p>
                </div>
            </div>
        </div>
    </main>
</div>
{% endblock %}