Search box for explorer.
This commit is contained in:
Simon Lindh
parent
480016ef07
commit
9e212ab176
@ -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);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -11,4 +11,5 @@
|
||||
background-color: #FFF;
|
||||
padding: 10px;
|
||||
display: inline-block;
|
||||
margin-right: 25px;
|
||||
}
|
||||
@ -38,6 +38,7 @@ export class AddressComponent implements OnInit {
|
||||
this.ref.markForCheck();
|
||||
},
|
||||
(error) => {
|
||||
console.log(error);
|
||||
this.error = error;
|
||||
this.isLoadingAddress = false;
|
||||
});
|
||||
|
||||
@ -77,7 +77,7 @@
|
||||
<div class="text-center">
|
||||
Error loading block data.
|
||||
<br>
|
||||
<i>{{ error.message }}</i>
|
||||
<i>{{ error.error }}</i>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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: '',
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user