{% extends "layout.html" %}
{% import 'macros/tables.html' as m_tables %}
{% import 'macros/cards.html' as m_cards %}

{% macro extract_orders(order_list, sim_or_real) -%}
    {% for orders in order_list %}
        {% for order in orders %}
            {{ m_tables.order_tr(order, convert_type(order.get_order_type()), convert_timestamp(order.get_creation_time()), sim_or_real) }}
        {% endfor %}
    {% endfor %}
{%- endmacro %}

{% block body %}
<div class="card">
    <div class="card-header"><h1>Market status</h1></div>
    <div class="card-body">
        <br>
        <div class="card-deck">
            {% for pair, status in pairs_with_status.items() %}
                {{ m_cards.pair_status_card(pair, status, watched_symbols) }}
            {% endfor %}
        </div>
    </div>
</div>
<br>
<div class="card">
    <div class="card-header">
        <h2>Open orders
            <span class="float-right">
                <a href="{{ url_for('trades') }}">
                    <i class="fa fa-history" data-toggle="tooltip" data-placement="top" title="Trades history"></i>
                </a>
            </span>
        </h2>
    </div>
    <div class="card-body">
        <div class="table-responsive">
          <table id="open_order_datatable" class="table table-striped table-bordered table-hover">
            <caption>List of open orders</caption>
          <thead>
            <tr>
                <th scope="col">#</th>
                <th scope="col">Exchange</th>
                <th scope="col">Symbol</th>
                <th scope="col">Type</th>
                <th scope="col">Price</th>
                <th scope="col">Quantity</th>
                <th scope="col">Real / Simulated</th>
                <th scope="col">Creation</th>
            </tr>
          </thead>
          <tbody>
            {{ extract_orders(real_open_orders, "Real") }}
            {{ extract_orders(simulated_open_orders, "Simulated") }}
          </tbody>
          </table>
        </div>
    </div>
</div>

<div class="card-footer text-center">
    <a href="{{ url_for('trades') }}" class="btn btn-outline-info btn-lg waves-effect">Trades history</a>
</div>


{% endblock %}

{% block additional_scripts %}
<script src="{{ url_for('static', filename='js/components/interface_settings.js') }}"></script>
{% endblock additional_scripts %}