{% extends "base.html" %}
{% block title %}{{ instrument.name|default:"Instrument not found" }} - Configure new jobs{% endblock %}
{% load static %}
{% block body %}
    {% if not instrument or message %}
        <div class="text-center col-md-6 col-md-offset-3 card card-body" id="message">
            {{ message }}
        </div>
        {% else %}
        {% if not instrument.is_active %}
            <div class="text-center col-md-6 col-md-offset-3 card card-body">
                Instrument is not active.
            </div>
        {% else %}
            <title>{{ instrument.name }} - Configure New Runs</title>

            <div class="row">
                <div class="col-md-12 text-center">
                    <h2>{{ instrument.name }} - Configure New Runs</h2>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3">
                    {% include "snippets/instrument_status.html" with processing=processing queued=queued last_instrument_run=last_instrument_run only %}
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 text-center">
                    <p>
                        <a href="{% url 'runs:variables_summary' instrument=instrument.name %}">View upcoming saved configurations</a>
                    </p>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 text-center">
                    <p>
                        {% if current_experiment_reference > 0 %}
                        <a href="{% url 'runs:variables' instrument=instrument.name start=run_start %}" id="go_to_other">Click here to submit variables for a run range</a>
                        {% else %}
                        <a href="{% url 'runs:variables_by_experiment' instrument=instrument.name experiment_reference=submit_for_experiment_reference %}" id="go_to_other">Click here to submit variables for an experiment reference</a>
                        {% endif %}
                    </p>
                </div>
            </div>
            <br/>
        <form id="instrument_variables" method="POST" action="{% url 'runs:variables' instrument=instrument.name %}" class="form-horizontal">
        {% csrf_token %}
        <input type="hidden" id="upcoming_runs" name="upcoming_runs" value="{{ upcoming_run_variables }}"/>
        <input type="hidden" id="is_editing" name="is_editing" value="{{ editing }}"/>
        <div class="row">
            <div class="col-md-9">
                {% include "snippets/variables/form_warnings.html" %}
                <br/>
                {% if current_experiment_reference > 0 %}
                <div class="js-variable-by-experiment">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label for="run_start" class="col-form-label col-md-3">Experiment Reference
                                    Number</label>
                                <div class="col-md-9">
                                    <input type="number" id="experiment_reference_number"
                                           name="experiment_reference_number" value="{{ current_experiment_reference }}"
                                           class="form-control"/>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                {% else %}
                <div class="js-variable-by-run">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label for="run_start" class="col-form-label col-md-3">Run Number Start</label>
                                <div class="col-md-9">
                                    <input type="number" id="run_start" name="run_start" value="{{ run_start }}" min="{{ minimum_run_start }}" class="form-control"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-10 col-md-offset-1">
                            <div class="alert alert-warning collapse" id="run_finish_warning">
                                <strong>Please Note:</strong> The <a href="#" class="js-show-default-variables">default
                                script values</a> will be used from run <span id="next_run"></span> onwards. You will be
                                able to change this by selecting the appropriate "edit variables" link from the
                                Instrument Summary page.
                            </div>
                        </div>
                    </div>
                </div>
                {% endif %}

                <div class="js-variables-container">
                    {% include "snippets/variables/form.html" with standard_variables=standard_variables advanced_variables=advanced_variables variable_help=variable_help instrument=instrument.name only %}
                </div>
            </div>
            <div class="col-md-3">
                <div class="card card-body">
                    <div class="row">
                        <div class="col-md-12"><h4>Additional Actions</h4></div>
                    </div>
                    <div class="row">
                        <ul class="js-form-actions">
                            {% include "snippets/reset_buttons.html" %}
                        </ul>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12 js-action-explaination"></div>
                </div>
            </div>
        </div>
        <div class="form-group variables-buttons">
            <div class="col-md-9 text-right">
                <a href="{% url 'runs:list' instrument.name %}" class="btn btn-danger" id="cancel">Cancel</a>
                <input type="submit" value="Submit Changes" class="btn btn-success" id="variableSubmit"/>
            </div>
        </div>
        </form>

            <div class="modal fade" id="default-variables-modal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span
                                    aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                            <h4 class="modal-title">Default Variables</h4>
                        </div>
                        <div class="modal-body">
                            <h5>Standard Variables</h5>
                            {% for name,variable in default_standard_variables.items %}
                                <div>
                                    <strong>{{ name }}:</strong> {{ variable.value }}
                                </div>
                            {% endfor %}
                            <h5>Advanced Variables</h5>
                            {% for name,variable in default_advanced_variables.items %}
                                <div>
                                    <strong>{{ name }}:</strong> {{ variable.value }}
                                </div>
                            {% endfor %}
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal fade" id="conflicts-modal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span
                                    aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                            <h4 class="modal-title">Overwrite Existing Variables?</h4>
                        </div>
                        <div class="modal-body">
                            <p>There are already saved values that fall within this run range chosen.</p>
                            <p>These variables start at the following runs: <span class="js-conflicts-list"></span></p>
                            <p>Do you want to overwrite these with the new values?</p>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                            <button type="button" class="btn btn-primary js-conflicts-confirm" id="replace_confirm">Yes, Replace</button>
                        </div>
                    </div>
                </div>
            </div>
        {% endif %}
    {% endif %}
{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" href="{% static "css/vendor/prettify.css" %}">
{% endblock %}
{% block scripts %}
    <script src='{% static "javascript/vendor/prettify.js" %}'></script>
    <script src='{% static "javascript/run_variables.js" %}'></script>
{% endblock %}
