{% extends "shell.html" %}

{% block title %}{{ search_query }}{% endblock %}

{% block head %}
<link rel="stylesheet" href="/static/themes/default/settings.css"/>
<link rel="stylesheet" href="/static/themes/{{theme.internal_name()}}/settings.css"/>
{% endblock %}

{% block page %}
<div class="main">
    {% include "ui/userbar.html" %}
    {% if alpha %}<span id="alpha-warning">WARNING! askLyphe is in alpha! user experience is in no way representative of the final product!</span>{%
    endif %}
    {% include "ui/navbar.html" %}

    <div class="pagecontent">
        <div class="settings-area">
            {% match error %}
            {% when Some with (val) %}
            <div class="error">{{ val }}</div>
            {% when None %}
            {% endmatch %}
            <div class="pagegradient">
                <div class="settings-row">
                    <div id="username" class="settings-section">
                        <h2>username</h2>
                        <span>{{ info.username }} (cannot currently be changed)</span>
                    </div>
                    <div id="email" class="settings-section">
                        <h2>email</h2>
                        <span>{{ info.email }}</span>
                        <br/>
                        <span>to change your email, you must email an administrator at devnull@voremicrocomputers.com</span>
                        <br/>
                        <span>(this will be changed in the future)</span>
                    </div>
                    <div id="password" class="settings-section">
                        <h2>change password</h2>
                        <span>this cannot currently be performed (which we are also working on fixing)</span>
                    </div>
                </div>
                <div class="settings-row">
                    <div id="theme" class="settings-section">
                        <h2>theme</h2>
                        <p>your current theme is: "{{true_theme.display_name()}}"</p>
                        {% if true_theme.internal_name() != theme.internal_name() %}
                        <p>today's random theme is {{ theme.display_name() }}</p>
                        {% endif %}
                        <form action="/user_settings/set_theme" method="post">
                            <label for="theme-selector">theme</label>
                            <select name="theme" id="theme-selector">
                                {% for t in themes %}
                                <option value="{{t.internal_name()}}" {%if true_theme.internal_name()==t.internal_name()%}selected{%endif%}>{{t.display_name()}}</option>
                                {% endfor %}
                            </select>
                            <button type="submit" id="theme-submit">change theme!</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {% include "ui/footer.html" %}
</div>
{% endblock %}