mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2025-01-18 21:32:55 +01:00
Code Issues Projects Releases Wiki Activity

Search box for explorer.

Browse Source
This commit is contained in:
Simon Lindh 2019-11-14 15:03:01 +08:00
parent 480016ef07
commit 9e212ab176
8 changed files with 89 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
backend/src/routes.ts
View File

@ -96,7 +96,11 @@ class Routes {
const result = await bitcoinApi.getRawTransaction(req.params.id);
res.send(result);
} catch (e) {
res.status(500).send(e.message);
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
e.status(500, e.message);
}
}
}
@ -105,7 +109,11 @@ class Routes {
const result = await bitcoinApi.getBlock(req.params.hash);
res.send(result);
} catch (e) {
res.status(500).send(e.message);
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
e.status(500, e.message);
}
}
}
@ -114,7 +122,15 @@ class Routes {
const result = await bitcoinApi.getBlockTransactions(req.params.hash);
res.send(result);
} catch (e) {
res.status(500).send(e.message);
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
e.status(500, e.message);
}
}
}
}
@ -123,7 +139,15 @@ class Routes {
const result = await bitcoinApi.getBlockTransactionsFromIndex(req.params.hash, req.params.index);
res.send(result);
} catch (e) {
res.status(500).send(e.message);
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
e.status(500, e.message);
}
}
}
}
@ -132,7 +156,15 @@ class Routes {
const result = await bitcoinApi.getAddress(req.params.address);
res.send(result);
} catch (e) {
res.status(500).send(e.message);
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
e.status(500, e.message);
}
}
}
}
@ -141,7 +173,11 @@ class Routes {
const result = await bitcoinApi.getAddressTransactions(req.params.address);
res.send(result);
} catch (e) {
res.status(500).send(e.message);
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
e.status(500, e.message);
}
}
}
@ -150,7 +186,11 @@ class Routes {
const result = await bitcoinApi.getAddressTransactionsFromLastSeenTxid(req.params.address, req.params.txid);
res.send(result);
} catch (e) {
res.status(500).send(e.message);
if (e.response) {
res.status(e.response.status).send(e.response.data);
} else {
e.status(500, e.message);
}
}
}
}

4
frontend/src/app/explorer/address/address.component.html
View File

@ -36,7 +36,7 @@
</tbody>
</table>
</div>
<div class="col text-center">
<div class="col text-right">
<div class="qr-wrapper">
<qrcode id="qrCode" [qrdata]="address.address" [size]="128" [level]="'M'"></qrcode>
</div>
@ -72,7 +72,7 @@
<div class="text-center">
Error loading address data.
<br>
<i>{{ error.message }}</i>
<i>{{ error.error }}</i>
</div>
</ng-template>

1
frontend/src/app/explorer/address/address.component.scss
View File

@ -11,4 +11,5 @@
background-color: #FFF;
padding: 10px;
display: inline-block;
margin-right: 25px;
}

1
frontend/src/app/explorer/address/address.component.ts
View File

@ -38,6 +38,7 @@ export class AddressComponent implements OnInit {
this.ref.markForCheck();
},
(error) => {
console.log(error);
this.error = error;
this.isLoadingAddress = false;
});

2
frontend/src/app/explorer/block/block.component.html
View File

@ -77,7 +77,7 @@
<div class="text-center">
Error loading block data.
<br>
<i>{{ error.message }}</i>
<i>{{ error.error }}</i>
</div>
</ng-template>

2
frontend/src/app/explorer/transaction/transaction.component.html
View File

@ -61,7 +61,7 @@
<div class="text-center">
Error loading transaction data.
<br>
<i>{{ error.message }}</i>
<i>{{ error.error }}</i>
</div>
</ng-template>
</div>

12
frontend/src/app/master-page/master-page.component.html
View File

@ -26,8 +26,16 @@
</li>
</ul>
<form [formGroup]="searchForm" class="form-inline mt-2 mt-md-0 mr-4" (submit)="searchForm.valid && search()" novalidate>
<input formControlName="txId" required style="width: 300px;" class="form-control mr-sm-2" type="text" placeholder="Search transaction ID" aria-label="Search">
<button class="btn btn-primary my-2 my-sm-0" type="submit">Track</button>
<ng-template [ngIf]="currentBaseRoot === 'explorer'" [ngIfElse]="defaultSearchBar">
<input formControlName="txId" required style="width: 310px;" class="form-control mr-sm-2" type="text" placeholder="Search transaction id or address..." aria-label="Search">
<button class="btn btn-primary my-2 my-sm-0" type="submit" style="width: 78px;">Search</button>
</ng-template>
<ng-template #defaultSearchBar>
<input formControlName="txId" required style="width: 310px;" class="form-control mr-sm-2" type="text" placeholder="Track transaction (txid)" aria-label="Search">
<button class="btn btn-primary my-2 my-sm-0" type="submit" style="width: 78px;">Track</button>
</ng-template>
</form>
</div>
</nav>

35
frontend/src/app/master-page/master-page.component.ts
View File

@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { MemPoolService } from '../services/mem-pool.service';
import { Router } from '@angular/router';
import { Router, NavigationEnd } from '@angular/router';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { environment } from '../../environments/environment';
@ -10,11 +10,13 @@ import { environment } from '../../environments/environment';
styleUrls: ['./master-page.component.scss']
})
export class MasterPageComponent implements OnInit {
navCollapsed = false;
isOffline = false;
searchForm: FormGroup;
isEsploraEnabled = !!environment.esplora;
currentBaseRoot = '';
regexAddr = /^([a-km-zA-HJ-NP-Z1-9]{26,35}|[a-km-zA-HJ-NP-Z1-9]{80}|[a-z]{2,5}1[ac-hj-np-z02-9]{8,87})$/;
constructor(
private memPoolService: MemPoolService,
@ -24,13 +26,20 @@ export class MasterPageComponent implements OnInit {
ngOnInit() {
this.searchForm = this.formBuilder.group({
txId: ['', Validators.pattern('^[a-fA-F0-9]{64}$')],
txId: [''],
});
this.memPoolService.isOffline$
.subscribe((state) => {
this.isOffline = state;
});
this.currentBaseRoot = this.router.url.split('/')[1];
this.router.events.subscribe((event) => {
if (event instanceof NavigationEnd ) {
this.currentBaseRoot = event.url.split('/')[1];
}
});
}
collapse(): void {
@ -38,14 +47,22 @@ export class MasterPageComponent implements OnInit {
}
search() {
const txId = this.searchForm.value.txId;
if (txId) {
if (window.location.pathname === '/' || window.location.pathname.substr(0, 4) === '/tx/') {
window.history.pushState({}, '', `/tx/${txId}`);
const searchText = this.searchForm.value.txId;
if (searchText) {
if (this.currentBaseRoot === 'explorer') {
if (this.regexAddr.test(searchText)) {
this.router.navigate(['/explorer/address/', searchText]);
} else {
this.router.navigate(['/explorer/tx/', searchText]);
}
} else {
this.router.navigate(['/tx/', txId]);
if (window.location.pathname === '/' || window.location.pathname.substr(0, 4) === '/tx/') {
window.history.pushState({}, '', `/tx/${searchText}`);
} else {
this.router.navigate(['/tx/', searchText]);
}
this.memPoolService.txIdSearch$.next(searchText);
}
this.memPoolService.txIdSearch$.next(txId);
this.searchForm.setValue({
txId: '',
});