block-explorer/resources/views/main/index.blade.php
Ben van Hartingsveldt 09800ab844
Switch to chainquery
2025-06-27 16:22:05 +02:00

235 lines
11 KiB
PHP

@extends('layout.default')
@section('title','Home')
@section('script')
<script type="text/javascript">
var updateInterval = 120000;
var updateStatus = function() {
$.ajax({
url: '/api/v1/status',
type: 'get',
dataType: 'json',
success: function(response) {
if (response.success) {
var status = response.status;
var stats = $('.stats');
stats.find('.box:eq(0) > .value').text(status.height);
stats.find('.box:eq(1) > .value').text(status.difficulty);
stats.find('.box:eq(2) > .value').text(status.hashrate);
stats.find('.box:eq(3) > .value').text(status.price);
}
}
});
};
var updateRecentBlocks = function() {
var tbody = $('.recent-blocks .table tbody');
$.ajax({
url: '/api/v1/recentblocks',
type: 'get',
dataType: 'json',
success: function(response) {
if (response.success) {
var blocks = response.blocks;
for (var i = blocks.length - 1; i >= 0; i--) {
var block = blocks[i];
var prevRow = tbody.find('tr[data-height="' + block.Height + '"]');
if (prevRow.length > 0) {
continue;
}
var blockTime = moment(block.BlockTime * 1000);
tbody.prepend(
$('<tr></tr>').attr({'data-height': block.Height, 'data-time': block.BlockTime}).append(
$('<td></td>').append(
$('<a></a>').attr({'href': '/blocks/' + block.Height}).text(block.Height)
)
).append(
$('<td></td>').text(blockTime.fromNow())
).append(
$('<td></td>').attr({'class': 'right'}).text((block.BlockSize / 1024).toFixed(2) + 'KB')
).append(
$('<td></td>').attr({'class': 'right'}).text(block.TransactionCount)
).append(
$('<td></td>').attr({'class': 'right'}).text(block.Difficulty)
).append(
$('<td></td>').attr({'class': 'last-cell'}).text(blockTime.utc().format('D MMM YYYY HH:mm:ss') + ' UTC')
)
);
// Remove the last row
tbody.find('tr:last').remove();
}
}
},
complete: function() {
tbody.find('tr').each(function() {
var row = $(this);
var blockTime = moment(row.attr('data-time') * 1000);
row.find('td:eq(1)').text(blockTime.fromNow());
});
}
});
};
$(document).ready(function() {
setInterval(updateStatus, updateInterval);
setInterval(updateRecentBlocks, updateInterval);
$(document).on('click', '.recent-claims .claim-box .tx-link', function(evt) {
evt.stopImmediatePropagation();
});
$(document).on('click', '.recent-claims .claim-box', function() {
var id = $(this).attr('data-id');
window.location.href = '/claims/' + id;
// center the popup
/*var dualScreenLeft = window.screenLeft != undefined ? window.screenLeft : screen.left;
var dualScreenTop = window.screenTop != undefined ? window.screenTop : screen.top;
var width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
var height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;
var left = ((width / 2) - (1366 / 2)) + dualScreenLeft;
var top = ((height / 2) - (768 / 2)) + dualScreenTop;
window.open('/claims/' + id, 'claim_details', 'width=1366,height=768,left=' + left + ',top=' + top);*/
});
$('.claim-box img').on('error', function() {
var img = $(this);
var parent = img.parent();
var text = parent.attr('data-autothumb');
img.remove();
parent.append(
$('<div></div>').attr({'class': 'autothumb' }).text(text)
);
});
});
</script>
@endsection
@section('content')
<div class="home-container">
<div class="home-container-cell">
<div class="main">
<div class="title">LBRY Block Explorer</div><br>
<form method="get" action="/find">
<input class="search-input" name="q" type="text" placeholder="Enter a block height or hash, claim id or name, transaction hash or address" />
<div class="ctls">
<div class="left-links"><a href="https://lbry.io/get">Download the LBRY App</a></div>
<button class="btn btn-search">Search</button>
<div class="right-links">
<a href="/realtime">Realtime</a> &bull; <a href="/stats" class="last">Stats</a>
</div>
</div>
</form>
</div>
<div class="stats">
<div class="box box-20">
<div class="title">Block Height</div>
<div class="value">{{ $recentBlocks[0]->height }}</div>
</div>
<div class="box box-30">
<div class="title">Difficulty</div>
<div class="value" title="{{ $recentBlocks[0]->difficulty }}">{{ number_format($recentBlocks[0]->difficulty, 2, '.', '') }}</div>
</div>
<div class="box box-30">
<div class="title">Network</div>
<div class="value">{{ $hashRate }}</div>
</div>
<div class="box box-20 last">
<div class="title">Price</div>
<div class="value">{{ $lbcUsdPrice }}</div>
</div>
<div class="clear"></div>
</div>
<div class="recent-blocks">
<h3>Recent Blocks</h3>
<a class="all-blocks-link" href="/blocks">LBRY Blocks</a>
<table class="table table-striped">
<thead>
<tr>
<th class="left w125">Height</th>
<th class="left w125">Age</th>
<th class="right w150">Block Size</th>
<th class="right w150">Transactions</th>
<th class="right w150">Difficulty</th>
<th class="left w250 last-cell">Timestamp</th>
</tr>
</thead>
<tbody>
@foreach($recentBlocks as $block)
<tr data-height="{{ $block->height }}" data-time="{{ $block->block_time }}">
<td><a href="/blocks/{{ $block->height }}">{{ $block->height }}</a></td>
<td>{{ \Carbon\Carbon::createFromTimestamp($block->block_time)->diffForHumans() }}</td>
<td class="right">{{ round($block->block_size / 1024, 2) . 'KB' }}</td>
<td class="right">{{ $block->tx_count }}</td>
<td class="right">{{ number_format($block->difficulty, 2, '.', '') }}</td>
<td class="last-cell">{{ DateTime::createFromFormat('U', $block->block_time)->format('d M Y H:i:s') . ' UTC' }}</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<div class="recent-claims">
<h3>Recent Claims</h3>
<a class="claim-explorer-link" href="/claims">Claims Explorer</a>
@php($idx = 0)
@php($a = ['purple', 'orange', 'blue', 'teal', 'green', 'yellow'])
@foreach($recentClaims as $claim)
@php($idx++)
@php($autoThumbText = $claim->getAutoThumbText())
{{--content type--}}
@php($ctTag = $claim->getContentTag())
<div data-id="{{ $claim->claim_id }}" class="{{ 'claim-box' }}@if($idx == 5){{ ' last' }}@endif">
<div class="tags">
@if($ctTag)
<div class="content-type">{{ strtoupper($ctTag) }}</div>
@endif
@if($claim->is_nsfw)
<div class="nsfw">NSFW</div>
@endif
</div>
<div data-autothumb="{{ $autoThumbText }}" class="thumbnail {{ $a[mt_rand(0, count($a) - 1)] }}">
@if(!$claim->is_nsfw && strlen(trim($claim->thumbnail_url)) > 0)
<img src="{{ strip_tags('https://thumbnails.odycdn.com/optimize/s:1280:720/quality:85/plain/'.$claim->thumbnail_url) }}" alt="" />
@else
<div class="autothumb">{{ $autoThumbText }}</div>
@endif
</div>
<div class="metadata">
<div class="title" title="{{ $claim->claim_type == 1 ? $claim->name : ((strlen(trim($claim->title)) > 0) ? $claim->title : '') }}">
@if($claim->claim_type == 1){{ $claim->name }}@else{{ '' }}@if(strlen(trim($claim->title)) > 0){{ $claim->title }}@else<em>No Title</em>@endif{{ '' }}@endif
</div>
<div class="link" title="{{ $claim->getLbryLink() }}"><a href="{{ $claim->getLbryLink() }}">{{ $claim->getLbryLink() }}</a></div>
<div class="clear"></div>
@if($claim->claim_type == 2 && strlen(trim($claim->description)) > 0)
<div class="desc">{{ $claim->description }}</div>
@endif
</div>
<a class="tx-link" href="/tx/{{ $claim->transaction_hash_id }}#output-{{ $claim->vout }}" target="_blank">Transaction</a>
</div>
@endforeach
<div class="clear"></div>
</div>
</div>
</div>
@endsection