{% extends "framework.html" %}

{% block content %}
    <div>
        <form action="" method="post">
            {% csrf_token %}
            <input type="text" class="form-control" id="smiles" name="smiles" placeholder="SMILES"
                   value="{{ smiles }}"/>
            <input type="text" class="form-control" id="smiles" name="smirks" placeholder="SMIRKS"
                   value="{{ smirks }}"/>
            <button type="submit" class="btn btn-primary">Test</button>
        </form>
    </div>
    {% if result %}
        {{ smiles }}<p></p>
        <img width='400' src='{% url 'depict' %}?smiles={{ smiles|urlencode }}'><br>
        <p></p>
        {% if rule %}
            {{ smirks }}
            <p></p>
            {{ rule.reactants_smarts }}
            <p></p>
            {{ rule.products_smarts }}
            <p></p>
            <div>
                {{ rule.as_svg|safe }}
            </div>
        {% endif %}
        <h2>Diff</h2>
        {% if diff %}
            {% for d in diff %}
                {{ d }}
            {% endfor %}
        {% else %}
            {{ "No diff" }}
        {% endif %}
        <div>
            <div class="col-md-6">
                <h2>Ambit</h2>
                {% for p in ambit_res %}
                    {{ p }}<br>
                    <img width='400' src='{% url 'depict' %}?smiles={{ p|urlencode }}'><br>
                {% endfor %}
            </div>

            <div class="col-md-6">
                <h2>RDKit</h2>
                {% for p in rdkit_res %}
                    {{ p }}<br>
                    <img width='400' src='{% url 'depict' %}?smiles={{ p|urlencode }}'><br>
                {% endfor %}
            </div>
        </div>
    {% endif %}
{% endblock content %}