{% extends 'projects/stage_base.html' %}
{% load humanize %}
{% load sekizai_tags %}
{% load staticfiles %}

{% block stage_breadcrumb_links %}
    <li><a href="{% url 'projects_stage_view' stage.project.pk stage.pk %}">{{ stage.name }}</a></li>
    <li class="active">Deployment started {{ object.date_created|naturaltime }}</li>
{% endblock stage_breadcrumb_links %}

{% block content %}
    <h1>Deployment started {{ object.date_created|naturaltime }}</h1><br/>

    <div class="row">
        <div class="col-md-6">
            <div class="well">
                <dl class="dl-horizontal">
                    <dt>Comments</dt>
                    <dd>{{ object.comments }}</dd>
                    <dt>Date Started</dt>
                    <dd>{{ object.date_created }}</dd>
                    <dt>Deployer</dt>
                    <dd><a href="{% url "accounts_user_view" object.user.pk %}">{{ object.user.email }}</a></dd>
                    <dt>Project</dt>
                    <dd><a href="{% url "projects_project_view" object.stage.project.pk %}">{{ object.stage.project.name }}</a></dd>
                    <dt>Stage</dt>
                    <dd><a href="{% url "projects_stage_view" object.stage.project.pk object.stage.pk %}">{{ object.stage.name }}</a></dd>
                    <dt>Task</dt>
                    <dd>{{ object.task.name }}</dd>
                    <dt>Task Description</dt>
                    <dd>{{ object.task.description|linebreaksbr }}</dd>
                </dl>
            </div>
        </div>
        <div class="col-md-6">
            <div class="well">
                <fieldset style="text-align: center;margin-bottom:10px;" id="status_section">
                    {% if object.status == object.PENDING %}
                        <legend>Status: Working</legend>
                        <i class="glyphicon glyphicon-time text-info" style="font-size:90px;"></i>
                    {% elif object.status == object.SUCCESS %}
                        <legend>Status: Success!</legend>
                        <i class="glyphicon glyphicon-ok text-success" style="font-size:90px;"></i>
                    {% else %}
                        <legend>Status: Failed!</legend>
                        <i class="glyphicon glyphicon-warning-sign text-danger" style="font-size:90px;"></i>
                    {% endif %}
                </fieldset>
            </div>
        </div>
    </div>
    <div class="well">
        {% block output %}
            {% if object.status == object.PENDING %}
                <iframe src="{% url 'projects_deployment_output' object.stage.project_id object.stage_id object.pk %}" id="deployment_output"></iframe>
            {% else %}
                <div id="deployment_output"><pre class="prettyprint">{{ object.output }}</pre></div>
            {% endif %}
        {% endblock %}
    </div>


    {% addtoblock "js" %}
        <script>
            var deployment_pending = {% if object.status == object.PENDING %}true{% else %}false{% endif %};
            var deployment_id = {{ object.pk }};
         </script>
        {% block deployment_scripts %}
            <script src="{% static 'projects/js/deployment.js' %}"></script>
        {% endblock %}
    {% endaddtoblock %}

{% endblock content %}