@gohelpfund/insight-ui/public/views/block_list.html

An open-source frontend for the Insight API. The Insight API provides you with a convenient, powerful and simple way to query and broadcast data on the Help network and build your own services with it.

<div data-ng-include src="'views/includes/connection.html'"></div>
<section data-ng-controller="BlocksController" data-ng-init="list()">
  <div class="row">
    <div class="col-xs-12 col-gray col-gray-fixed">
      <div class="block-id">
        <div class="icon-block text-center">
          <span class="glyphicon glyphicon-list"></span>
          <h3><span translate>Blocks</span> <br> 
            <span translate>mined on:</span></h3>
        </div>
      </div>
      <p class="lead text-center m20v">
      {{pagination.current}} UTC
      <div class="lead text-center m20v"><a href="#" class="btn btn-primary btn-xs" uib-datepicker-popup show-button-bar="false" data-ng-click="openCalendar($event)" data-ng-model="dt" is-open="opened" data-ng-model-options="{timezone: 'utc'}" data-ng-required="true" popup-placement="bottom"><span class="glyphicon glyphicon-calendar"></span></a></div>
      </p>
      <div class="m20v text-center text-muted" data-ng-if="!pagination.current">
        <span translate>Loading Selected Date...</span>
      </div>
      <div data-ng-if="pagination.current">
        <p class="lead text-center m20v"  data-ng-show="loading">&nbsp;</p>
        <p class="text-center m20v"  data-ng-show="pagination.isToday && !loading" translate>Today</p>
        <p class="text-center m20v"  data-ng-show="!pagination.isToday && !loading">{{humanSince(pagination.currentTs)}}
        <p class="text-center m20v"  data-ng-show="loading">&nbsp;</p>
        <div class="m50v text-center">
          <a class="btn btn-primary" href="blocks-date/{{pagination.prev}}"><small>&larr; {{pagination.prev}}</small></a>
          <a class="btn btn-primary" href="blocks-date/{{pagination.next}}" data-ng-show="!pagination.isToday"><small>{{pagination.next}} &rarr;</small></a>
        </div>
      </div>
    </div>
    <div class="col-xs-12 col-md-9 col-md-offset-3">
      <div class="page-header">
        <h1>
          <span translate>Blocks</span>
          <small><span translate>by date.</span> {{detail}} {{before}}</small>
        </h1>
      </div>
      <table class="table table-hover table-striped">
        <thead>
          <tr>
            <th translate>Height</th>
            <th translate>Timestamp</th>
            <th class="text-right" translate>Transactions</th>
            <th class="text-right hidden-xs" translate>Mined by</th>
            <th class="text-right" translate>Size</th>
          </tr>
        </thead>
        <tbody>
        <tr data-ng-show="loading">
          <td colspan="5"><span translate>Waiting for blocks...</span> <span class="loader-gif"></span></td>
        </tr>
        <tr class="fader" data-ng-repeat='b in blocks'>
          <td><a href="block/{{b.hash}}">{{b.height}}</a></td>
          <td>{{millisToUTCDate(b.time) | date:'medium'}} UTC</td>
          <td class="text-right">{{b.txlength}}</td>
          <td class="text-right hidden-xs"><a href="{{b.poolInfo.url}}" title="{{b.poolInfo.poolName}}" target="_blank" data-ng-show="b.poolInfo">{{b.poolInfo.poolName}}</a></td>
          <td class="text-right">{{b.size}}</td>
        </tr>
        </tbody>
      </table>
      <div data-ng-if="pagination.more">
        <a class="btn btn-primary" href="blocks-date/{{pagination.current}}" data-ng-show="before">Lastest block from date</a>
        <a class="btn btn-primary" href="blocks-date/{{pagination.current}}/{{pagination.olderBlocks}}">Older blocks from this date</a>
      </div>
    </div>
  </div>
  <h2 class="text-center text-muted" data-ng-show="!blocks.length && !loading"
    translate>No blocks yet.</h2>
</section>