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

{% block scripts %}
<script type="text/javascript">
    codescene.views.projects.pmIntegration.init();
</script>
{% 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">
        <div class="title-area">
            <h1>Project Management Integration: Costs and Delivery Trends
              <a href="{{view-context}}/docs/integrations/integrate-project-management-data.html" target="_blank" class="help-link pull-right">
                <i class="fa fa-question-circle"></i>
              </a>
            </h1>
            <p class="lead text-muted">
              Integrate with a project management tool like Jira or Trello to retrieve costs and work type trends.
              The resulting data is used to put costs on the hotspots as well as detecting trends in the
              delivery performance. Examples include measuring trends in Planned vs Unplanned costs, batch sizes, and
              delivery lead times.<br/>
              Read more about this integration in <a href="{{view-context}}/docs/integrations/integrate-project-management-data.html" target="_blank">
              the documentation</a>.
            </a>
            </p>
        </div>
        <form action="{{view-context}}/projects/{{item.id}}/pm-integration" method="post"
            name="pm_integration_form">
            <div class="form-group">
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value=""
                            {% if not item.pm-data-provider-type %} checked="checked" {% endif %}>
                        Disabled
                    </label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value="jira"
                            {% ifequal item.pm-data-provider-type "jira" %} checked="checked" {% endifequal %}>
                        Jira
                    </label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value="trello"
                            {% ifequal item.pm-data-provider-type "trello" %} checked="checked" {% endifequal %}>
                        Trello
                    </label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value="azure"
                            {% ifequal item.pm-data-provider-type "azure" %} checked="checked" {% endifequal %}>
                        Azure DevOps
                    </label>
                </div>
                {% if any item.possible-repo-providers.github item.possible-repo-providers.other %}
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value="github"
                            {% ifequal item.pm-data-provider-type "github" %} checked="checked" {% endifequal %}>
                        GitHub Issues
                    </label>
                </div>
                {% endif %}
                {% if any item.possible-repo-providers.gitlab item.possible-repo-providers.other %}
                <div class="radio">
                  <label><input type="radio" name="pm-data-provider-type" value="gitlab"
                                {% ifequal item.pm-data-provider-type "gitlab" %} checked="checked" {% endifequal %}>
                    GitLab Issues
                  </label>
                </div>
                {% endif %}

                {% if feature-flags.shortcut-pm-data %}
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value="shortcut"
                            {% ifequal item.pm-data-provider-type "shortcut" %} checked="checked" {% endifequal %}>
                        Shortcut
                    </label>
                </div>
                {% endif %}
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value="youtrack"
                            {% ifequal item.pm-data-provider-type "youtrack" %} checked="checked" {% endifequal %}>
                        YouTrack
                    </label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="pm-data-provider-type" value="clickup"
                            {% ifequal item.pm-data-provider-type "clickup" %} checked="checked" {% endifequal %}>
                        ClickUp
                    </label>
                </div>
            </div>

            <div class="jira-provider-toggleable" {% ifunequal item.pm-data-provider-type "jira" %}
                style="display: none" {% endifunequal %}>
                {% include "cacsremoteservice/views/projects/pm-integration/jira-provider-v2.html" %}
            </div>

            <div class="trello-provider-toggleable" {% ifunequal item.pm-data-provider-type "trello" %}
                style="display: none" {% endifunequal %}>
                {% include "cacsremoteservice/views/projects/pm-integration/trello-provider-v2.html" %}
            </div>

            <div class="azure-provider-toggleable" {% ifunequal item.pm-data-provider-type "azure" %}
                style="display: none" {% endifunequal %}>
                {% include "cacsremoteservice/views/projects/pm-integration/azure-provider-v2.html" %}
            </div>

            <div class="github-provider-toggleable" {% ifunequal item.pm-data-provider-type "github" %}
                style="display: none" {% endifunequal %}>
                {% include "cacsremoteservice/views/projects/pm-integration/github-provider-v2.html" %}
            </div>

            <div class="gitlab-provider-toggleable" {% ifunequal item.pm-data-provider-type "gitlab" %}
            style="display: none" {% endifunequal %}>
            {% include "cacsremoteservice/views/projects/pm-integration/gitlab-provider-v2.html" %}
            </div>

            <div class="shortcut-provider-toggleable" {% ifunequal item.pm-data-provider-type "shortcut" %}
                style="display: none" {% endifunequal %}>
                {% include "cacsremoteservice/views/projects/pm-integration/shortcut-provider-v2.html" %}
            </div>

            <div class="youtrack-provider-toggleable" {% ifunequal item.pm-data-provider-type "youtrack" %}
                style="display: none" {% endifunequal %}>
                {% include "cacsremoteservice/views/projects/pm-integration/youtrack-provider-v2.html" %}
            </div>

            <div class="clickup-provider-toggleable" {% ifunequal item.pm-data-provider-type "clickup" %}
                style="display: none" {% endifunequal %}>
                {% include "cacsremoteservice/views/projects/pm-integration/clickup-provider-v2.html" %}
            </div>

            <div id='save-config-button'>
                <button class="default-button" type="submit">
                    <i class="save-progress-indicator fa fa-check"></i>
                    <span class="text">Save and Continue</span>
                </button>
            </div>
        </form>
    </div>
</div>
{% endblock %}