arnaucube
arnaucube/goBlockchainDataAnalysisPublic Self-hosted repository
goBlockchainDataAnalysis/web/views/main/main.html
web/views/main/main.htmlRaw
  1<div class="row">
  2  <div class="col-sm-4">
  3    <div class="panel">
  4      <div class="panel-body">
  5        <h4>{{stats.realblockcount}}/{{stats.blockcount}} Blocks with content</h4>
  6        <div class="progress" style="margin:0;">
  7          <div class="progress-bar c_blueGrey500" ng-style="blockProgress"></div>
  8        </div>
  9      </div>
 10    </div>
 11  </div>
 12  <div class="col-sm-2">
 13    <div class="panel">
 14      <div class="panel-body">
 15        <h4>{{stats.txcount}} Txs</h4>
 16        <div class="progress" style="margin:0;">
 17          <div class="progress-bar c_blueGrey500" ng-style="txProgress"></div>
 18        </div>
 19      </div>
 20    </div>
 21  </div>
 22  <div class="col-sm-2">
 23    <div class="panel">
 24      <div class="panel-body">
 25        <h4>{{stats.addrcount}} Addr</h4>
 26        <div class="progress" style="margin:0;">
 27          <div class="progress-bar c_blueGrey500" ng-style="txProgress"></div>
 28        </div>
 29      </div>
 30    </div>
 31  </div>
 32  <div class="col-sm-2">
 33    <div class="panel">
 34      <div class="panel-body">
 35        <round-progress
 36        max="max"
 37        current="current"
 38        color="#45CCCE"
 39        bgcolor="#eaeaea"
 40        radius="100"
 41        stroke="20"
 42        semi="true"
 43        rounded="false"
 44        clockwise="true"
 45        responsive="true"
 46        duration="800"
 47        animation="easeInOutQuart"
 48        animation-delay="0">{{current}}/{{max}}</round-progress>
 49      </div>
 50    </div>
 51  </div>
 52  <div class="col-sm-2">
 53    <div class="panel">
 54      <div class="panel-body">
 55        <round-progress
 56        max="max"
 57        current="current"
 58        color="#607D8B"
 59        bgcolor="#eaeaea"
 60        radius="100"
 61        stroke="20"
 62        semi="true"
 63        rounded="false"
 64        clockwise="true"
 65        responsive="true"
 66        duration="800"
 67        animation="easeInOutQuart"
 68        animation-delay="0">{{current}}/{{max}}</round-progress>
 69      </div>
 70    </div>
 71  </div>
 72</div>
 73<div class="row">
 74  <div class="col-sm-4">
 75    <div class="panel">
 76      <div class="panel-heading c_blueGrey300">
 77        <h3 class="panel-title">Last 24 hours Tx/Hour
 78                <a ng-href="#!/dateAnalysis" class="pull-right c_blueGrey300">View more</a></h3>
 79      </div>
 80      <div class="panel-body">
 81        <canvas id="line" class="chart chart-line" chart-data="last24hour.data" chart-labels="last24hour.labels">
 82                </canvas>
 83      </div>
 84    </div>
 85
 86    <div class="panel">
 87      <div class="panel-heading c_blueGrey300">
 88        <h3 class="panel-title">Tx/Day Last 7 Days</h3>
 89      </div>
 90      <div class="panel-body">
 91        <canvas id="horizontal-bar" class="chart chart-horizontal-bar" chart-data="last7day.data" chart-labels="last7day.labels" chart-series="last7day.series">
 92                </canvas>
 93      </div>
 94    </div>
 95  </div>
 96  <div class="col-sm-8">
 97    <div class="panel">
 98      <div class="panel-heading c_blueGrey300">
 99        <h3 class="panel-title">Last 7 days Tx/Hour
100                  <a ng-href="#!/dateAnalysis" class="pull-right c_blueGrey300">View more</a></h3>
101      </div>
102      <div class="panel-body">
103        <canvas id="line" class="chart chart-line" chart-data="last7dayhour.data" chart-labels="last7dayhour.labels" chart-series="last7dayhour.series">
104              </canvas>
105      </div>
106    </div>
107  </div>
108</div>
109<div class="row">
110  <div class="col-sm-4">
111    <div class="panel">
112      <div class="panel-heading c_blueGrey300">
113        <h3 class="panel-title">Last addresses used</h3>
114      </div>
115      <div class="panel-body" style="max-height: 250px;overflow-y: scroll;">
116        <div class="list-group-item" ng-repeat="address in addresses">
117          <div class="row-content">
118            <p class="list-group-item-text">{{address.hash}}</p>
119          </div>
120        </div>
121      </div>
122    </div>
123
124  </div>
125  <div class="col-md-8">
126    <div class="panel">
127      <div class="panel-heading c_blueGrey300">
128        <h3 class="panel-title">Last Tx with amount</h3>
129      </div>
130      <div class="panel-body" style="max-height: 250px;overflow-y: scroll;">
131        <table class="table table-striped table-hover">
132          <!--<colgroup>
133                        <col class="col-md-2">
134                        <col class="col-md-2">
135                        <col class="col-md-2">
136                        <col class="col-md-2">
137                        <col class="col-md-2">
138                        <col class="col-md-2">
139                    </colgroup>-->
140          <thead>
141            <tr>
142              <th>BlockHeight</th>
143              <th>From</th>
144              <th>To</th>
145              <th>Amount</th>
146              <th></th>
147            </tr>
148          </thead>
149          <tbody>
150            <tr ng-repeat="tx in txs">
151              <td style="max-width:20px; overflow:hidden;">{{tx.blockheight}}</td>
152              <td style="max-width:20px; overflow:hidden;">{{tx.from}}</td>
153              <td style="max-width:20px; overflow:hidden;">{{tx.to}}</td>
154              <td>{{tx.amount}}</td>
155              <td><a ng-href="#!/tx/{{tx.id}}">View</a></td>
156            </tr>
157          </tbody>
158        </table>
159      </div>
160    </div>
161  </div>
162</div>