
<h2>
    Details for: <%= relay.get('nickname') %>
    <% if (relay.get('running') === false) { %>
    <span class="tip circle circle-offline" title="This bridge is offline."></span>
    <% } else { %>
    <span class="tip circle circle-online" title="This bridge is running."></span>
    <% } %>
</h2>

<div class="row">
    <div class="col-md-6">
    <h3>Configuration</h3>
    <dl>
      <dt><span class="tip" title="This is the nickname that the Tor bridge operator chose.">Nickname</span></dt>
      <dd><%= _.escape(relay.get('nickname')) %></dd>

      <dt><span class="tip" title="Ports (addresses are hidden) where the bridge listens for incoming connections from clients and other relays.">OR Addresses</span></dt>
      <dd><%= relay.get('or_addresses') %></dd>

      <dt>
      <span class="tip" title="The volume of traffic, both incoming and outgoing, that this bridge is willing to sustain, as configured by the operator and claimed to be observed from recent data transfers.">Advertised Bandwidth</span>
      </dt>
      <dd><%= relay.get('bandwidth_hr') ? relay.get('bandwidth_hr') : 'not defined' %></dd>
    </dl>


    </div>
    <div class="col-md-6">
    <% if (relay.get('running') === true) { %>
    <h3>Properties</h3>
    <% } else { %>
    <h3>Last Known Properties</h3>
    <% } %>
    <dl>

    <dt><span class="tip" title="Hash of 20-byte unique identifier of the bridge.">Hashed Fingerprint</span></dt>
    <dd><pre><%= relay.get('fingerprint') %></pre></dd>

    <% if (relay.get('running') === true) { %>
    <dt><span class="tip" title="The time since this bridge is online.">Uptime</span></dt>
    <dd><%= relay.get('uptime_hrfull') %></dd>
    <% } else { %>
    <dt><span class="tip" title="The time since this bridge was last seen online.">Downtime</span></dt>
    <dd><%= relay.get('downtime') %></dd>
    <dt><span class="tip" title="Timestamp when the bridge was last seen in the consensus.">Last Seen</span></dt>
    <dd><%= relay.get('last_seen') %></dd>
    <% } %>

    <dt><span class="tip" title="Flags that the directory authorities assigned to this bridge.">Flags</span></dt>
    <dd><% _.each(relay.get('flags'), function(flag) { %>
    <span class="tip flags" title="<%= flag[2] %>">
        <img class="inline" alt="" src="/images/flags/<%= flag[1] %>.png"/>
        <a href="#search/flag:<%= flag[1] %>"><span class="inline"><%= flag[0] %></span></a>
    </span>
    <% }); %>
    </dd>
    
    <dt><span class="tip" title="Flags that have been generated by Relay Search to provide extra useful information. These flags do not appear in the directory consensus.">Additional Flags</span></dt>
    <dd>
        <% var propertyCount = 0; %>
        <% _.each(relay.get('additional_flags'), function(flag) { propertyCount++; %>
            <span class="tip flags" title="<%= flag[2] %>">
                <img class="inline" alt="" src="/images/flags/<%= flag[1] %>.png"/>
                <span class="inline"><%= flag[0] %></span>
            </span>
        <% }); %>
        <%= propertyCount==0 ? 'none' : '' %>
    </dd>

    <dt><span class="tip" title="The first time that this relay was seen online.">First Seen</span></dt>
    <dd><%= relay.get('first_seen') %></dd>

    <dt><span class="tip" title="Date and time when the bridge was last (re-)started.">Last Restarted</span></dt>
    <dd><%= relay.get('last_restarted') %></dd>

    <dt><span class="tip" title="What OS and Tor version the bridge is using">Platform</span></dt>
    <dd><%= _.escape(relay.get('platform')) %></dd>

    <dt><span class="tip" title="Transport protocols supported by this bridge.">Transport protocols</span></dt>
    <dd><%= relay.get('transports') ? relay.get('transports') : 'none' %></dd>

    <dt><span class="tip" title="BridgeDB distributor that this bridge is currently assigned to.">Bridge distribution mechanism</span></dt>
    <% if (!relay.get('bridgedb_distributor')) { %>
    <dd><a href="https://bridges.torproject.org/info#none">None</a></dd>
    <% } else if (relay.get('bridgedb_distributor') === 'unallocated') { %>
    <dd><a href="https://bridges.torproject.org/info#reserved">Reserved</a></dd>
    <% } else if (relay.get('bridgedb_distributor') === 'https') { %>
    <dd><a href="https://bridges.torproject.org/info#https">HTTPS</a></dd>
    <% } else if (relay.get('bridgedb_distributor') === 'email') { %>
    <dd><a href="https://bridges.torproject.org/info#email">Email</a></dd>
    <% } else if (relay.get('bridgedb_distributor') === 'moat') { %>
    <dd><a href="https://bridges.torproject.org/info#moat">Moat</a></dd>
    <% } else { %>
    <dd><a href="https://bridges.torproject.org/info#<%= relay.get('bridgedb_distributor') %>"><%= relay.get('bridgedb_distributor') %></a></dd>
    <% } %>

    </dl>
    </div>
</div>

<h3>History</h3>

<ul class="nav nav-tabs">
  <li id="history-1m-tab" class="history-tabs active"><a onclick="$('.history').hide();$('#history-1m').fadeIn();$('.history-tabs').removeClass('active');$('#history-1m-tab').addClass('active');">1 Month</a></li>
  <li id="history-6m-tab" class="history-tabs"><a onclick="$('.history').hide();$('#history-6m').fadeIn();$('.history-tabs').removeClass('active');$('#history-6m-tab').addClass('active');">6 Months</a></li>
  <li id="history-1y-tab" class="history-tabs"><a onclick="$('.history').hide();$('#history-1y').fadeIn();$('.history-tabs').removeClass('active');$('#history-1y-tab').addClass('active');">1 Year</a></li>
  <li id="history-5y-tab" class="history-tabs"><a onclick="$('.history').hide();$('#history-5y').fadeIn();$('.history-tabs').removeClass('active');$('#history-5y-tab').addClass('active');">5 Years</a></li>
</ul>

<div class="tab-content" id="history-tab-content">
  <div id="history-1m" class="history tab-pane active">
    <div class="row">
        <div class="col-md-6">
          <div class="thumbnail">
            <div id="bw_month" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>1 Month graph</h5>
              <a id="save_bw_month" href="">Save Graph</a>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="thumbnail">
            <div id="clients_month" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>1 Month graph</h5>
              <a id="save_clients_month" href="">Save Graph</a>
            </div>
          </div>
        </div>
     </div>
  </div>
  <div id="history-6m" class="history tab-pane">
    <div class="row">
        <div class="col-md-6">
          <div class="thumbnail">

            <div id="bw_months" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>6 Months graph</h5>
              <a id="save_bw_months" href="">Save Graph</a>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="thumbnail">
            <div id="clients_months" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>6 Months graph</h5>
              <a id="save_clients_months" href="">Save Graph</a>
            </div>
          </div>
        </div>
    </div>
  </div>
  <div id="history-1y" class="history tab-pane">
    <div class="row">
        <div class="col-md-6">
          <div class="thumbnail">
            <div id="bw_year" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>1 Year graph</h5>
              <a id="save_bw_year" href="">Save Graph</a>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="thumbnail">
            <div id="clients_year" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>1 Year graph</h5>
              <a id="save_clients_year" href="">Save Graph</a>
            </div>
          </div>
        </div>
    </div>
  </div>
  <div id="history-5y" class="history tab-pane">
    <div class="row">
        <div class="col-md-6">
          <div class="thumbnail">
            <div id="bw_years" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>5 Years graph</h5>
              <a id="save_bw_years" href="">Save Graph</a>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="thumbnail">
            <div id="clients_years" class="graph">
            <img src="/images/no-data-available.png" alt="">
            </div>

           <div class="caption">
              <h5>5 Years graph</h5>
              <a id="save_clients_years" href="">Save Graph</a>
            </div>
          </div>
        </div>
    </div>
  </div>
<p>Information for bridges was published: <%= relay.get('bridgesPublished') %> UTC.</p>
<p><small>Onionoo version: <%= relay.get('onionooVersion') %>/<%= relay.get('buildRevision') %></small></p>

