{% extends "base.html" %}
{% load compress staticfiles hc_extras %}

{% block title %}Account Settings - {% site_name %}{% endblock %}

{% block content %}
<div class="row">
    <div class="col-sm-12">
        <h1 class="settings-title">Settings</h1>
    </div>
</div>

<div class="row">
    <div class="col-sm-3">
        <ul class="nav nav-pills nav-stacked">
            <li><a href="{% url 'hc-profile' %}">Account</a></li>
            {% if show_pricing %}
            <li><a href="{% url 'hc-billing' %}">Billing</a></li>
            {% endif %}
            <li class="active"><a href="{% url 'hc-notifications' %}">Email Reports</a></li>
            <li><a href="{% url 'hc-badges' %}">Badges</a></li>
        </ul>
    </div>

    <div class="col-sm-9 col-md-6">
        <div class="panel panel-{{ status }}">
            <div class="panel-body settings-block">
                <form method="post">
                    {% csrf_token %}
                    <h2>Email Reports</h2>

                    <p>Send me monthly emails about:</p>
                    <label class="checkbox-container">
                        <input
                            name="reports_allowed"
                            type="checkbox"
                            {% if profile.reports_allowed %} checked {% endif %}>
                        <span class="checkmark"></span>
                        The status of checks in all teams I belong to
                    </label>

                    <br>
                    <p>If any checks are down:</p>

                    <label class="radio-container">
                        <input
                            type="radio"
                            name="nag_period"
                            value="0"
                            {% if profile.nag_period.total_seconds == 0 %} checked {% endif %}>
                        <span class="radiomark"></span>
                        Do not remind me
                    </label>
                    <label class="radio-container">
                        <input
                            type="radio"
                            name="nag_period"
                            value="86400"
                            {% if profile.nag_period.total_seconds == 86400 %} checked {% endif %}>
                        <span class="radiomark"></span>
                        Remind me daily
                    </label>
                    <label class="radio-container">
                        <input
                            type="radio"
                            name="nag_period"
                            value="3600"
                            {% if profile.nag_period.total_seconds == 3600 %} checked {% endif %}>
                        <span class="radiomark"></span>
                        Remind me hourly
                    </label>

                    <br />
                    <p style="color: #888">
                        Reports will be delivered to {{ profile.user.email }}. <br />
                        {% if profile.next_report_date %}
                            Next monthly report date is
                            {{ profile.next_report_date.date }}.
                        {% endif %}
                    </p>
                    <br />


                    <button
                        name="update_reports_allowed"
                        type="submit"
                        class="btn btn-default pull-right">Save Changes</button>
                </form>
            </div>
            {% if status == "info" %}
            <div class="panel-footer">
                Your settings have been updated!
            </div>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
{% compress js %}
<script src="{% static 'js/jquery-2.1.4.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
{% endcompress %}
{% endblock %}