<div class="modal hide fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="run_modal_title" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="run_modal_title">Run: <a href="/project/{{ global_state.data.projectId }}/jobs/{{ run.get_job().id }}/" target="_self">{{ run.get_job().title }}</a></h3>
    </div>
    <div class="modal-body" id="status-modal">
        <div class="tabbable">
            <ul class="nav nav-tabs" ng-switch on="run.get_run_log() != null">
                <li ng-switch-when="true" class="active">
                    <a href="#log" data-toggle="tab" target="_self">Log output</a>
                </li>
                <li ng-class="{active: run.get_run_log() == null}">
                    <a href="#details" data-toggle="tab" target="_self">Details</a>
                </li>
                <li>
                    <a href="#command" data-toggle="tab" target="_self">Script</a>
                </li>
            </ul>
            <div class="tab-content" ng-switch on="run.get_run_log() != null">
                <div id="log" ng-switch-when="true" class="tab-pane active">
                    <p><pre>{{ run.get_run_log().content }}</pre></p>
                </div>
                <div id="command" class="tab-pane">
                    <p><pre>{{ run.get_job().script_content }}</pre></p>
                </div>
                <div id="details" ng-class="{'tab-pane': true, active: run.get_run_log() == null}">
                    <table class="table table-bordered">
                        <tbody>
                            <tr>
                                <th>Status</th>
                                <td>{{ run.get_state_string() }}</td>
                            </tr>
                            <tr>
                                <th>Scheduled</th>
                                <td>{{ run.schedule_dts | formatdts }}</td>
                            </tr>
                            <tr>
                                <th>In queue</th>
                                <td>{{ run.enqueue_dts | formatdts }}</td>
                            </tr>
                            <tr>
                                <th>Started</th>
                                <td>{{ run.start_dts | formatdts }}</td>
                            </tr>
                            <tr>
                                <th>Returned</th>
                                <td>{{ run.return_dts | formatdts }}</td>
                            </tr>
                            <tr>
                                <th>Run duration</th>
                                <td>{{ run.get_duration_string() }}</td>
                            </tr>
                        </tbody>
                    </table>

                    <div ng-switch on="run.get_job().description != null">
                        <p ng-switch-when="true">{{ run.get_job().description }}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal-footer">
        <div ng-controller="JobActionCtrl">
            <div ng-class="{hidden: auth_permissions != true, 'pull-left': true}">
                <ng-switch on="scheduled_run == null">
                    <div ng-switch-when="true" class="btn-group">
                        <button class="btn" ng-click="scheduleNow(false)"><i class="icon-play"></i> <span>Schedule job now</span></button>
                        <button ng-class="{btn: true, 'dropdown-toggle': true, hidden: job.children.length < 1}" data-toggle="dropdown">
                            <span class="caret"></span>
                        </button>
                        <ul ng-class="{'dropdown-menu': true, hidden: job.children.length < 1}">
                            <li><a href="#" ng-click="scheduleNow(true)">Schedule now incl. children</a></li>
                        </ul>
                    </div>
                    <div ng-switch-when="false" class="btn-group">
                        <button class="btn" disabled="disabled"><i class="icon-ok"></i> Job scheduled</button>
                    </div>
                </ng-switch>

                <ng-switch on="job.enqueue_is_enabled">
                    <button ng-switch-when="true" class="btn btn-danger" ng-click="toggleEnqueue(false)"><span>Suspend enqueue for job</span></button>
                    <button ng-switch-when="false" class="btn btn-success" ng-click="toggleEnqueue(true)"><span>Enable enqueue for job</span></button>
                </ng-switch>
            </div>
        </div>

        <div class="inline" ng-controller="RunActionCtrl">
            <ng-switch on="auth_permissions == true && run.get_state() == 'started'">
                <div ng-switch-when="true" class="inline">
                    <ng-switch on="kill_request == null">
                        <button class="btn btn-danger" disabled="disabled" ng-switch-when="false">Kill-request has been sent</button>
                        <button class="btn btn-danger" ng-switch-when="true" ng-click="killRun()">Kill this run</button>
                    </ng-switch>
                </div>
            </ng-switch>
        </div>
        <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div>
