<h4>[% gettext('Peers properties') %]</h4>

<table class="peers_info">
    <colgroup>
        <col width="23%"/>
        <col width="10%"/>
        <col width="23%"/>
        <col width="10%"/>
        <col width="24%"/>
        <col width="10%"/>
    </colgroup>
    <tbody>
        <tr>
            <th>[% gettext('Peers connected')       %]</th>
            <td>[% data.info.peers_connected        %]</td>
            <th>[% gettext('Peers accounted')       %]</th>
            <td>[% data.info.peers_accounted        %]</td>
            <th>[% gettext('Peers max')             %]</th>
            <td>[% data.info.peers_max              %]</td>
        </tr>
        <tr>
            <th>[% gettext('Peers not connected')   %]</th>
            <td>[% data.info.peers_not_connected    %]</td>
            <th>[% gettext('Peers complete')        %]</th>
            <td>[% data.info.peers_complete         %]</td>
            <th>[% gettext('Peers min')             %]</th>
            <td>[% data.info.peers_min              %]</td>
        </tr>
        <tr>
            <th></th>
            <td></td>
            <th></th>
            <td></td>
            <th>
                <a class="question" href="[% data.wiki.pex %]" target="blank">
                    [% gettext('Peers exchange') %]
                </a>
                <div class="image question" />
            </th>
            <td>
                [% IF data.info.peer_exchange; gettext('on')  %]
                [% ELSE;                       gettext('off') %]
                [% END %]
            </td>
        </tr>
    </tbody>
</table>

<h4>[% gettext('Peers list') %]</h4>

<table class="peers_list">
    <colgroup>
        <col width="1%" />
        <col/>
        <col width="15%" />
        <col width="10%" />
        <col width="10%" />
        <col width="5%" />
        <col width="5%" />
        <col width="5%" />
        <col width="5%" />
        <col width="5%" />
        <col width="5%" />
    </colgroup>
    <thead>
        <tr>
            <th colspan="2">[% gettext('IP : Port') %]</th>
            <th>[% gettext('Client')                %]</th>
            <th>[% gettext('Flags')                 %]</th>
            <th>[% gettext('Available')             %]</th>
            <th>[% gettext('Down Speed')            %]</th>
            <th>[% gettext('Up Speed')              %]</th>
            <th>[% gettext('Peer Rate')             %]</th>
            <th>[% gettext('Down Total')            %]</th>
            <th>[% gettext('Up Total')              %]</th>
            <th>[% gettext('Peer Total')            %]</th>
        </tr>
    </thead>
    <tbody>
    [% FOR peer = data.list %]
        [% SET class = [] %]
        [% IF loop.index % 2; class.push('odd'); ELSE; class.push('even'); END %]
        <tr class="[% class.join(' ') %]">
            [% IF peer.country_code || peer.country_name %]
                <td class="country">
                    <img
                        alt="[% peer.country_code | lower %]"
                        title="[% gettext(peer.country_name) %]"
                        src="img/flag/[% peer.country_code _ '.png' | lower %]"
                    />
                </td>
            [% ELSE %]
                <td class="country" />
            [% END %]
            <td
                class="address"
                title="[% gettext('Id') _ ': ' _ peer.id %]">
                    [% peer.address _ ' : ' _ peer.port %]
            </td>
            <td class="client">[% peer.client_version %]</td>
            <td class="flag">
                [%
                    IF peer.is_incoming;   ' ' _ gettext('Inc');  END;
                    IF is_encrypted;       ' ' _ gettext('Enc');  END;
                    IF peer.is_obfuscated; ' ' _ gettext('Obf');  END;
                    IF peer.is_snubbed;    ' ' _ gettext('Snub'); END;
                %]
            </td>
            <td class="percent">
                [% peer.completed_percent %]%
                <div class="indicator">
                    <div class="percent"
                        style="width: [% peer.completed_percent %]%;"/>
                </div>
            </td>
            <td class="down_speed">[% peer.down_rate.as_human_speed %]</td>
            <td class="up_speed">[%   peer.up_rate.as_human_speed   %]</td>
            <td class="peer_rate">[%  peer.peer_rate.as_human_speed %]</td>
            <td class="down_total">[% peer.down_total.as_human_size %]</td>
            <td class="up_total">[%   peer.up_total.as_human_size   %]</td>
            <td class="peer_total">[% peer.peer_total.as_human_size %]</td>
        </tr>
    [% END %]
    </tbody>
</table>
