
<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 that the relay is willing to sustain. The rate and burst limits apply separately to inbound and outbound traffic. The observed bandwidth is the minimum of recent inbound and outbound traffic, as reported by the relay.">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="/rs/img/flags/<%= flag[1] %>.png"/>
        <span class="inline"><%= flag[0] %></span>
    </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="/rs/img/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>

    </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-3m-tab" class="history-tabs"><a onclick="$('.history').hide();$('#history-3m').fadeIn();$('.history-tabs').removeClass('active');$('#history-3m-tab').addClass('active');">3 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="/rs/img/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="/rs/img/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-3m" class="history tab-pane">
    <div class="row">
        <div class="col-md-6">
          <div class="thumbnail">

            <div id="bw_months" class="graph">
            <img src="/rs/img/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>3 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="/rs/img/no-data-available.png" alt="">
            </div>
            <div class="caption">
              <h5>3 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="/rs/img/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="/rs/img/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="/rs/img/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="/rs/img/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>

