{% extends "cacsremoteservice/views/layouts/master.html" %}

{% block scripts %}
<script>
  codescene.views.configurations.notifications.init();
</script>
{% endblock %}

{% block secondary-nav %}
{% include "cacsremoteservice/views/projects/project-header.html" with project=item tabs=tabs %}
{% endblock %}

{% block secondary-nav %}
{% include "cacsremoteservice/views/projects/project-header.html" with project=item tabs=tabs %}
{% endblock %}

{% block main %}
<div class="project-webhooks-view" id="page-body">
    {% include "cacsremoteservice/views/partials/validation-errors.html" %}

    <div class="text-content">
      <h1>Notifications Configuration
        <a href="{{view-context}}/docs/guides/misc/notifications.html#per-project-configuration" target="_blank" class="help-link pull-right">
          <i class="fa fa-question-circle"></i>
        </a>
      </h1>
    <p class="lead text-muted">
      Receive notifications for analysis events and warnings about the state of your code.
      This project-specific configuration can be used to override the <a href="{{view-context}}/configuration/notifications">global notification settings</a>.
    </p>
      <div class="slack-notifications">
      <section>
        <h2>Slack Notifications</h2>
        <p>
          Notifications can be pushed to your <a target="_blank" href="https://slack.com/">Slack</a> channel.
          Read more about the <a target="_blank" href="https://api.slack.com/">Slack API here</a>.
        </p>

        <form action="{{view-context}}/projects/{{item.id}}/notifications/slack" method="post">

          <!-- internal id identifying the global provider configuration -->
          <input type="hidden" name="slack-global-provider-id" value="{{notification-providers.slack.notification-provider/id}}" />

          <div class="form-group">
            <label>
              <!-- This input uses the same javascript as the "Use Slack Notifications" in the global config
                   and also the same view handler logic for converting params to clojure data.
                   That's why it has the id 'slack-active' and not 'slack-override' or similar. -->
              <input id="slack-active" type="checkbox" name="slack-active" {% if notification-providers.slack.notification-provider/project-override? %} checked {% endif %} />
              Override <a href="{{view-context}}/configuration/notifications">Global Slack Notifications</a> settings
            </label>
          </div>

          <div class="slack-notification-toggleable"
               {% if not notification-providers.slack.notification-provider/project-override? %} style="display: none" {% endif %}>

            <div id="slack-notification-settings">
              <h3>Slack Notifications Settings</h3>

              <p>
                <i>Fill in the recipient and check notifications you want to receive.</i>
              </p>

              <div class="form-group">
                <label for="slack-recipient">Notification recipient:</label>
                <p>
                  Slack notifications will be sent to this recipient.
                  You can <mark>specify an individual Slack user as <b><i>@username</i></b> or a channel as <b><i>#channel</i></b>.</mark>
                </p>
                <input class="form-control"
                  type="text"
                  id="slack-recipient"
                  name="slack-recipient"
                  value="{{notification-providers.slack.notification-provider/recipient}}"
                  />
              </div>

              {% include "cacsremoteservice/views/configuration/notifications-settings-fragment.html" %}

            </div>
          </div>
          <button class="default-button" type="submit">Save Slack Notifications Settings</button>
        </form>
      </section>
      </div>
    </div>


</div>
{% endblock %}