{% extends "trading/base.html" %}
{% load bootstrap4 %}
{% load humanize %}

{% block title %}
    {% with title="Commodity detail" %}
        {{ block.super }}
    {% endwith %}
{% endblock title %}

{% block content %}
    <div class="row">
        <div class="col-sm">
            <h4>{{object.name}}</h4>
        </div>
    </div>
    <div class="row">
        <div class="col-sm">
            <table class="table">
                <tbody>
                    <tr>
                        <td scope="row">Created by</td>
                        <td>{{object.created_by.username}}</td>
                    </tr>
                    {% if object.symbol %}
                    <tr>
                        <td scope="row">Trading symbol</td>
                        <td>{{object.symbol}}</td>
                    </tr>
                    {% endif %}
                    <tr>
                        <td scope="row">In circulation</td>
                        <td>{{object.in_circulation|intcomma}}</td>
                    </tr>
                    <tr>
                        <td scope="row">Held in pending transactions</td>
                        <td>{{object.amount_pending|intcomma}}</td>
                    </tr>
                    <tr>
                        <td scope="row">Trading volume (all time)</td>
                        <td>{{trading_volume_all|intcomma}}</td>
                    </tr>
                    <tr>
                        <td scope="row">Trading volume (past 24 hours)</td>
                        <td>{{trading_volume_day|intcomma}}</td>
                    </tr>
                    <tr>
                        <td scope="row">Trading volume (past hour)</td>
                        <td>{{trading_volume_hour|intcomma}}</td>
                    </tr>
                    <tr>
                        <td scope="row">Market spread</td>
                        <td>{{object.market_spread|intcomma}} user{{object.market_spread|pluralize}} ({{market_spread_ratio|intcomma}}%)</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
{% endblock %}