{% extends "base.html" %}

{% block navbar_logout %}
  <div class="navbar-item"><button class="button is-warning"><a class="navbar-item" href="{{ url_for('logout') }}">Logout</a></button></div>
{% endblock %}

{% block content %}
    <h1 class="title is-large butter-title">{{ _('Application Settings') }}</h1>

{% import "bulma_wtf.html" as wtf %}
    <form action="" method="post" enctype="multipart/form-data" novalidate >
        {{ form.hidden_tag() }}
        <div class="control block">
             {{ form.submit( class="button is-link") }}
            {% if config['SETTINGS_CHANGED'] %}
            {{ form.apply_changes(class="button is-warning") }}
            {% endif %}
        </div>


        <label class="label is-large">Services</label>

        <div class="field checkbox">
            {{ wtf.form_bool_field(form.enable_map_viewer) }}
            <p class="help butter-form-margin">Whether map services are enabled.</p>
        </div>
        <div class="field checkbox">
            {{ wtf.form_bool_field(form.enable_chat) }}
            <p class="help butter-form-margin">Whether Matrix chat services are enabled.</p>
        </div>
        <div class="field checkbox">
            {{ wtf.form_bool_field(form.enable_deltachat) }}
            <p class="help butter-form-margin">Whether messaging using DeltaChat is enabled.</p>
        </div>
        <div class="field checkbox">
            {{ wtf.form_bool_field(form.enable_file_viewer) }}
            <p class="help butter-form-margin">Whether files services via USB are enabled.</p>
        </div>
               <div class="field checkbox">
            {{ wtf.form_bool_field(form.enable_app_store) }}
            <p class="help">Whether app store services are enabled.</p>
        </div>

        <hr>
        <label class="label is-large">Branding and name</label>

        <div class="field">
            {{ wtf.form_input_field(form.butterbox_name, form.butterbox_name.errors) }}
            <p class="help">This is the name shown in the UI.
                            Current name: {{ get_setting('butterbox_name') }}, accessed at {{ get_setting('butterbox_name') }}.local.</p>
        </div>
        <div class="field">
            {{ wtf.form_input_field(form.butterbox_hostname, form.butterbox_hostname.errors) }}
            <p class="help">This is the URL used to access the box by adding .local in your browser.
                            Current hostname: {{ get_setting('butterbox_hostname') }}.local.</p>
        </div>
        <div class="field">
            <label class="label">{{ form.butterbox_logo.label }} </label>
            <div class="control block">{{ form.butterbox_logo(class='label', style="width: 280px") }}</div>
            {{ wtf.field_errors(form.butterbox_logo.errors) }}
            <div class="block"><p class="help">This is the logo shown in the UI. Current logo:</p></div>
            <img src="{{ get_setting('butterbox_logo') }}" style="height: 50px">
        </div>


        <hr>
        <label class="label is-large">Wi-Fi and access point</label>

    {% if raspap_installed %}
        <div class="field">
            {{ wtf.form_input_field(form.ssid, form.ssid.errors) }}
            <p class="help"> This is the name of the advertised Wi-Fi network. Current SSID: {{ get_setting('ssid') }}</p>
        </div>
        <div class="field password">
            {{ wtf.form_input_field(form.wifi_password,  form.wifi_password.errors) }}
            <p class="help"> This is the secret key needed to connect to the Wi-Fi network. By default, this is not set and everyone can join.
                Current password: {{ get_setting('wifi_password') or 'Not set'  }}</p>
        </div>

        <div class="field checkbox">
            {{ wtf.form_bool_field(form.enable_access_point) }}
            <p class="butter-form-margin help">Whether this box will advertise a Wi-Fi network.</p>
        </div>
        <div class="field checkbox">
            {{ wtf.form_bool_field(form.enable_wifi_sharing) }}
            <p class="butter-form-margin help">Whether a share button for the Wi-Fi network is available.</p>
        </div>
    {% else %}
                <p> Access point is only enabled when using a Raspberry Pi. </p>
    {% endif %}

        <hr>
        <label class="label is-large">Access and security</label>

        <div class="control field">
            {{ wtf.form_password_field(form.admin_password, form.admin_password.errors) }}
            <p class="help">Password for accessing this browser interface.</p>
        </div>
        <div class="control block">
          <label class="label">{{ form.root_account_settings.label }} </label>
          {% for subfield in form.root_account_settings %}
               <label class="radio butter-form-margin">
                   {% if get_setting('root_account_settings') == subfield._value() %}
                     <input id='{{subfield.id}}' type='radio' name='{{subfield.name}}' value='{{subfield._value()}}' checked/>
                   {% else %}
                     <input id='{{subfield.id}}' type='radio' name='{{subfield.name}}' value='{{subfield._value()}}'/>
                   {% endif %}
               {{ subfield.label }}
               </label>
            {% endfor %}
            {{ wtf.field_errors(form.root_account_settings.errors)}}
        </div>

           <div class="control block">
           <label class="label">{{ form.ssh_access_settings.label }} </label>
          {% for subfield in form.ssh_access_settings %}
               <label class="radio butter-form-margin">
                   {% if get_setting('ssh_access_settings') == subfield._value() %}
                     <input id='{{subfield.id}}' type='radio' name='{{subfield.name}}' value='{{subfield._value()}}' checked/>
                   {% else %}
                     <input id='{{subfield.id}}' type='radio' name='{{subfield.name}}' value='{{subfield._value()}}'/>
                   {% endif %}
               {{ subfield.label }}
               </label>
            {% endfor %}
               {{ wtf.field_errors(form.ssh_access_settings.errors) }}
           </div>


    </form>

{% endblock %}