{% macro warning_message(message) %}
    {% if message %}
        <div class="alert alert-warning alert-dismissible show" role="alert">
            Warning: {{ message }}
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    {% endif %}
{% endmacro %}

{% macro error_message(message) %}
    {% if message %}
        <div class="alert alert-danger alert-dismissible show" role="alert">
            Error: {{ message }}
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    {% endif %}
{% endmacro %}

<!--TODO: Better explanation of data format (maybe on another page)-->
{% macro add_data(return_page, data_upload_warnings, data_upload_errors) %}
    <h4>Add New Dataset <span class="glyphicon glyphicon-question-sign" style="font-size:15px" data-toggle="tooltip" data-placement="right" title="The data file must be a comma-separate values file (.csv) with a header. Each row should contain the SMILES and each of the property values for a molecule."></span></h4>
    <form enctype="multipart/form-data" action="{{url_for('upload_data', return_page=return_page)}}" method="POST">
        Name: <input type="text" name="datasetName" required>
        <br><br>
        <input type="file" name="dataset" accept=".csv" required>
        <br>
        <button type="submit" class="btn btn-primary btn-sm">Upload</button>
    </form>

    <br>

    {% if data_upload_warnings %}
        {% for warning in data_upload_warnings %}
            {{ warning_message(warning) }}
        {% endfor %}
    {% endif %}

    {% if data_upload_errors %}
        {% for error in data_upload_errors %}
            {{ error_message(error) }}
        {% endfor %}
    {% endif %}
{% endmacro %}

{% macro add_checkpoint(return_page, checkpoint_upload_warnings, checkpoint_upload_errors) %}
    <h4>Add New Checkpoint <span class="glyphicon glyphicon-question-sign" style="font-size:15px" data-toggle="tooltip" data-placement="right" title="The model file must be a PyTorch model checkpoint (.pt) or a zip folder (.zip) containing model checkpoints created by our code."></span></h4>

    <form enctype="multipart/form-data" action="{{url_for('upload_checkpoint', return_page=return_page)}}" method="POST">
        Name: <input type="text" name="checkpointName" required>
        <br><br>
        <input type="file" name="checkpoint" accept=".pt,.zip" required>
        <br>
        <button type="submit" class="btn btn-primary btn-sm">Upload</button>
    </form>

    <br>

    {% if checkpoint_upload_warnings %}
        {% for warning in checkpoint_upload_warnings %}
            {{ warning_message(warning) }}
        {% endfor %}
    {% endif %}

    {% if checkpoint_upload_errors %}
        {% for error in checkpoint_upload_errors %}
            {{ error_message(error) }}
        {% endfor %}
    {% endif %}
{% endmacro %}

{% macro chemdraw() %}
<script type="text/javascript" language="javascript" src="/static/jsme/jsme/jsme.nocache.js"></script>
<script>
    function jsmeOnLoad() {
        jsmeApplet = new JSApplet.JSME("jsme_container", "565px", "400px");
    };
</script>
<div id="jsme_container"></div>
{% endmacro %}
