{% extends 'projects/base_project.html' %}
{% load crispy_forms_tags %}

{% block title %}{% if object %}Edit{% else %}Create{% endif %} Automation - {{ block.super }}{% endblock %}

{% block content_project %}

<form method="post" id="automation-form">
    {% csrf_token %}
    {{ form.configuration_json }}
    {{ form.trigger_type }}

    <div class="row">
        <div class="col-lg-4 col-md-5 col-sm-12">
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">General Settings</h3>
                    <div class="box-tools pull-right">
                        {{ form.is_enabled|as_crispy_field }}
                    </div>
                </div>
                <div class="box-body">
                    <div class="form-group">
                        <label class="control-label">Type</label>
                        <div class="notification-type-readonly">
                            {% if trigger_type == 'report' %}
                            <i class="fa fa-calendar automation-type-icon automation-type-icon--report"></i>
                            <span>Report</span>
                            {% else %}
                            <i class="fa fa-bolt automation-type-icon automation-type-icon--alert"></i>
                            <span>Alert</span>
                            {% endif %}
                        </div>
                    </div>
                    {{ form.name|as_crispy_field }}

                    <div class="pull-right">
                        <a href="{% url 'automations' org_name=request.current_organization.name project_name=project.name %}" class="btn btn-default">Cancel</a>
                        <button type="submit" class="btn btn-primary">Save</button>
                    </div>
                </div>
            </div>
            <div class="box box-solid">
                <div class="box-header with-border">
                    <h3 class="box-title"><i class="fa fa-info-circle"></i> Info</h3>
                </div>
                <div class="box-body">
                    {% if trigger_type == 'report' %}
                    <p>Report automations collect matching CVEs over a full daily or weekly period, based on the selected timezone.</p>
                    <p>Actions are executed later, at the scheduled time, on the CVEs collected in that report. For example, a daily report sent at 09:00 includes CVEs from the previous full day.</p>
                    {% else %}
                    <p>Alert automations run every hour on CVEs that matched during the previous hour.</p>
                    <p>Use them for near real-time actions, such as sending a notification as soon as a CVE enters the project or matches your conditions.</p>
                    {% endif %}
                </div>
            </div>
        </div>

        <div class="col-lg-8 col-md-7 col-sm-12">
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">Conditions</h3>
                </div>
                <div class="box-body">
                    <!-- SCHEDULE Section (report only; alert uses WHEN below) -->
                    {% if trigger_type == 'report' %}
                    <div class="automation-section">
                        <div class="section-header">
                            <span class="section-label">SCHEDULE</span>
                            <span class="section-description trigger-description-inline">
                                Collect matching CVEs over a
                                <select name="frequency" id="id_frequency" class="form-control trigger-frequency-select select2" required>
                                    <option value="daily" {% if form.frequency.value == 'daily' %}selected{% endif %}>Daily</option>
                                    <option value="weekly" {% if form.frequency.value == 'weekly' %}selected{% endif %}>Weekly</option>
                                </select>
                                period in the
                                {{ form.schedule_timezone }}
                                timezone
                            </span>
                        </div>
                        {% if form.schedule_timezone.errors %}
                            <p class="text-danger">{{ form.schedule_timezone.errors.0 }}</p>
                        {% endif %}
                        {% if form.trigger_type.errors %}<p class="text-danger">{{ form.trigger_type.errors.0 }}</p>{% endif %}
                        {% if form.frequency.errors %}
                            <p class="text-danger">{{ form.frequency.errors.0 }}</p>
                        {% endif %}
                    </div>
                    {% endif %}

                    <!-- WHEN Section (event type only: which events trigger the automation) -->
                    {% if trigger_type == 'alert' %}
                    <div class="automation-section" id="when-section">
                        <div class="section-header">
                            <span class="section-label">WHEN</span>
                            <span class="section-description">
                                one or more of these events occur
                            </span>
                        </div>
                        <div id="triggers-container"></div>
                        <select class="add-dropdown select2" id="add-trigger-dropdown" data-placeholder="Add event...">
                            <option value="">Add event...</option>
                        </select>
                    </div>
                    {% endif %}

                    <!-- Conditions: OR groups (each group = AND of conditions) -->
                    <div id="conditions-section">
                        <!-- First AND group (IF / SCOPE for report) -->
                        <div class="automation-section">
                            <div class="condition-group" data-group-index="0">
                                <div class="section-header">
                                    <span class="section-label">{% if trigger_type == 'report' %}SCOPE{% else %}IF{% endif %}</span>
                                    <span class="section-sublabel">optional</span>
                                    <span class="section-description">
                                        all of these conditions match
                                    </span>
                                </div>
                                <div class="group-conditions"></div>
                                <select class="add-dropdown select2 add-condition-dropdown" data-placeholder="Add optional filter..." data-group-index="0">
                                    <option value="">Add optional filter...</option>
                                </select>
                            </div>
                            <button type="button" class="btn btn-default btn-add-or-group" id="add-or-group-btn">
                                <i class="fa fa-plus"></i> Add OR group
                            </button>
                        </div>
                        <div id="condition-groups-container">
                            <!-- OR IF groups appended here, each in their own automation-section -->
                        </div>
                        <template id="condition-group-or-template">
                            <div class="automation-section">
                                <div class="condition-group" data-group-index="">
                                    <div class="section-header section-header-with-remove">
                                        <span class="section-label">OR {% if trigger_type == 'report' %}SCOPE{% else %}IF{% endif %}</span>
                                        <span class="section-description">all of these conditions match</span>
                                        <button type="button" class="btn btn-sm btn-default btn-remove-or-group" title="Remove this OR group">
                                            <i class="fa fa-trash"></i> Remove OR group
                                        </button>
                                    </div>
                                    <div class="group-conditions"></div>
                                    <select class="add-dropdown select2 add-condition-dropdown" data-placeholder="Add optional filter..." data-group-index="">
                                        <option value="">Add optional filter...</option>
                                    </select>
                                </div>
                            </div>
                        </template>
                    </div>

                    <!-- THEN Section -->
                    <div class="automation-section">
                        <div class="section-header">
                            <span class="section-label">THEN</span>
                            {% if trigger_type == 'report' %}
                            <span class="section-sublabel">optional</span>
                            <span class="section-description trigger-description-inline">
                                Run these actions
                                <span id="weekly-day-container" class="trigger-weekday-inline" {% if form.frequency.value != 'weekly' %}style="display:none"{% endif %}>
                                    every
                                    <select name="schedule_weekday" id="id_schedule_weekday" class="form-control trigger-weekday-select select2">
                                        {% for day_key, day_label in form.schedule_weekday.field.choices %}
                                            {% with selected_day=form.schedule_weekday.value|default:'monday' %}
                                            <option value="{{ day_key }}" {% if selected_day == day_key %}selected{% endif %}>{{ day_label }}</option>
                                            {% endwith %}
                                        {% endfor %}
                                    </select>
                                </span>
                                at
                                <input
                                    type="time"
                                    name="schedule_time"
                                    id="id_schedule_time"
                                    class="form-control trigger-inline-time"
                                    value="{{ form.schedule_time.value|time:'H:i'|default:'09:00' }}"
                                    step="3600"
                                    required
                                >
                            </span>
                            {% else %}
                            <span class="section-description">
                                perform these actions
                            </span>
                            {% endif %}
                        </div>
                        {% if trigger_type == 'report' %}
                        {% if form.schedule_time.errors %}
                            <p class="text-danger">{{ form.schedule_time.errors.0 }}</p>
                        {% endif %}
                        {% if form.schedule_weekday.errors %}
                            <p class="text-danger">{{ form.schedule_weekday.errors.0 }}</p>
                        {% endif %}
                        {% endif %}
                        <div id="actions-container"></div>
                        <select class="add-dropdown select2" id="add-action-dropdown" data-placeholder="Add action...">
                            <option value="">Add action...</option>
                        </select>
                    </div>

                    {% if form.configuration_json.errors %}
                    <p class="text-danger automation-config-errors">{{ form.configuration_json.errors.0 }}</p>
                    {% endif %}
                    <div id="automation-config-errors" class="text-danger automation-config-errors" style="display:none;"></div>
                </div>
            </div>
        </div>
    </div>
</form>

<script>
var automationData = {{ automation_data_json|safe }};
var automationOptions = {
    notifications: [{% for n in notifications %}{id: "{{ n.id }}", name: "{{ n.name|escapejs }}"}{% if not forloop.last %},{% endif %}{% endfor %}],
    users: [{% for u in organization_members %}{id: "{{ u.id }}", name: "{{ u.username|escapejs }}"}{% if not forloop.last %},{% endif %}{% endfor %}],
    statuses: [{% for k, v in status_choices %}{id: "{{ k }}", name: "{{ v|escapejs }}"}{% if not forloop.last %},{% endif %}{% endfor %}]
};
var automationTriggerType = "{{ trigger_type }}";
</script>

{% endblock %}