{% extends "sentry/projects/manage.html" %}

{% load crispy_forms_tags %}
{% load i18n %}
{% load sentry_helpers %}

{% block inner %}
    <div class="page-header">
        <h2>
            {% if rule.id %}
                {% trans "Edit Rule" %}
            {% else %}
                {% trans "New Rule" %}
            {% endif %}
            <small>Applying to Events</small>
        </h2>
    </div>
    <div id="new-rule-form">
        <form method="POST" action="">
            {% csrf_token %}

            {% if not form_is_valid %}
                <div class="alert-block alert alert-error">
                    <p>{% trans "There were errors with your submission. Please ensure all options are filled out correctly." %}</p>
                </div>
            {% endif %}

            {{ form|as_crispy_errors }}

            <fieldset>
                <div class="controls{% if form_errors.label %} error{% endif %}">
                    <label>{% trans "Label:" %}</label> <input type="text" name="label" placeholder="{% trans "e.g. My Rule Name" %}">
                </div>
            </fieldset>

            <fieldset>
                <div><legend>Conditions</legend></div>
                <p>When <select name="action_match" style="width:100px" class="select2-small">
                    <option value="all">all of</option>
                    <option value="any">any of</option>
                    <option value="none">none of</option>
                </select> these conditions are met:</p>
                <table class="condition-list table table-striped">
                    <colgroup>
                        <col>
                        <col style="width:50px">
                    </colgroup>
                    <tbody></tbody>
                </table>
                <div class="controls">
                    <select id="condition-select" class="span6" placeholder="add a condition"></select>
                </div>
            </fieldset>

            <fieldset>
                <div><legend>Actions</legend></div>
                <p>Take these actions every time this rules matches:</p>
                <table class="action-list table table-striped">
                    <colgroup>
                        <col>
                        <col style="width:50px">
                    </colgroup>
                    <tbody></tbody>
                </table>
                <div class="controls">
                    <select id="action-select" class="span6" placeholder="add an action"></select>
                </div>
            </fieldset>

            <div class="actions">
                <button type="submit" class="btn btn-primary">{% trans "Save Rule" %}</button>
            </div>
        </form>
    </div>

    <script>
    new app.NewProjectRulePage({
        el: '#new-rule-form',
        actions: {{ action_list|safe }},
        conditions: {{ condition_list|safe }},
        form_data: {{ form_data|to_json|safe }},
        form_errors: {{ form_errors|to_json|safe }}
    });
    </script>
{% endblock %}
