{% include 'common/begin.html' %}

<main>
    <h1>Our finances - transparency is key!</h1>
    <p>
        <b>Warning</b> - no guarantees can be made that this information is 100% accurate.
        Crypto currency prices are being updated once every hour.
        <br>
        <b>As of: </b> <span id="lastUpdateDisplay">Loading...</span>
        <script>
            const unix_timestamp = {{ finances.last_update }};
            lastUpdateDisplay.innerText = new Date(unix_timestamp * 1000).toLocaleString();
        </script>
    </p>

    <a href="/finances/json" target="_blank">
        <button class="special">
            <i class="bi bi-file-earmark-arrow-down"></i>
            Download entire database
        </button>
    </a>

    <h2>Donations</h2>  

    <div class="featured__facts box"><p>
        We have received <b>{{ finances.donations_num }} donations</b> so far,
        totaling  <b>${{ finances.donations_total }}</b>. The largest donation is <b>${{ finances.donations_max }}</b>.
    </p></div>
    <div class="featured__facts box"><p>
        The average donation has an amount of <b>${{ finances.donations_avg }}</b>.
        Most people used <b>{{ finances.most_used_donation_currency }}</b> to donate.
    </p></div>

    <h2>Expenses</h2>
    <div class="featured__facts box"><p>We have spent <b>${{ finances.expenses_total }}</b> so far, <b>${{ finances.expenses_wages }}</b> of which are wages to our employees.</p></div>

    <h2>Balance</h2>
    <div class="featured__facts box"><p>Our current balance is ~<b>${{ finances.donations_total - finances.expenses_total }}</b>.
        Please note that this is just a rough estimate and not an exact value. Due to transaction fees and price fluctuations,
        the actual balance is actually lower.
    </p></div>

    <h2>Transactions</h2>
    {{ transaction_table | safe }}
</main>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css">
<script src="//cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script>
    $(document).ready( function () {
        $('#transactionTable').DataTable({
            'order': [[ 4, 'desc' ]]
        });
    } );

    // add a column that links to https://3xpl.com/search?q= and then the "Proof" column value of each row
    const table = document.getElementById('transactionTable');
    for (let i = 1; i < table.rows.length; i++) {
        const row = table.rows[i];
        const proof = row.cells[5].innerText;

        if (proof == '') continue;

        row.cells[5].innerHTML = `<a href="https://3xpl.com/search?q=${proof}" target="_blank"><i class="bi bi-box-arrow-up-right"></i></a>`;
    }

</script>

{% include 'common/end.html' %}