machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Address tracking and notification sounds.

Browse Source
This commit is contained in:
softsimon
2020-02-26 04:29:57 +07:00
parent b45f5c31cd
commit 12c9b80a64
13 changed files with 110 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/app/components/address/address.component.html
View File

@@ -13,17 +13,17 @@
<div class="col">
<table class="table table-borderless table-striped">
<tbody>
<tr>
<td>Number of transactions</td>
<td>{{ address.chain_stats.tx_count + address.mempool_stats.tx_count }}</td>
</tr>
<tr>
<td>Total received</td>
<td>{{ (address.chain_stats.funded_txo_sum + address.mempool_stats.funded_txo_sum) / 100000000 | number: '1.2-2' }} BTC</td>
<td>{{ receieved / 100000000 | number: '1.2-8' }} BTC</td>
</tr>
<tr>
<td>Total sent</td>
<td>{{ (address.chain_stats.spent_txo_sum + address.mempool_stats.spent_txo_sum) / 100000000 | number: '1.2-2' }} BTC</td>
<td>{{ sent / 100000000 | number: '1.2-8' }} BTC</td>
</tr>
<tr>
<td>Balance</td>
<td>{{ (receieved - sent) / 100000000 | number: '1.2-8' }} BTC</td>
</tr>
</tbody>
</table>
@@ -40,7 +40,7 @@
<br>
<h2><ng-template [ngIf]="transactions?.length">{{ transactions?.length || '?' }} of </ng-template>{{ address.chain_stats.tx_count + address.mempool_stats.tx_count + addedTransactions }} transactions</h2>
<h2><ng-template [ngIf]="transactions?.length">{{ transactions?.length || '?' }} of </ng-template>{{ txCount }} transactions</h2>
<app-transactions-list [transactions]="transactions" [showConfirmations]="true"></app-transactions-list>
@@ -49,7 +49,7 @@
<div class="spinner-border"></div>
<br><br>
</ng-template>
<button *ngIf="transactions?.length && transactions?.length !== (address.chain_stats.tx_count + address.mempool_stats.tx_count)" type="button" class="btn btn-primary" (click)="loadMore()">Load more</button>
<button *ngIf="transactions?.length && transactions?.length !== txCount" type="button" class="btn btn-primary" (click)="loadMore()">Load more</button>
</div>
</ng-template>

45
frontend/src/app/components/address/address.component.ts
View File

@@ -5,6 +5,7 @@ import { switchMap } from 'rxjs/operators';
import { Address, Transaction } from '../../interfaces/electrs.interface';
import { WebsocketService } from 'src/app/services/websocket.service';
import { StateService } from 'src/app/services/state.service';
import { AudioService } from 'src/app/services/audio.service';
@Component({
selector: 'app-address',
@@ -18,13 +19,17 @@ export class AddressComponent implements OnInit, OnDestroy {
transactions: Transaction[];
isLoadingTransactions = true;
error: any;
addedTransactions = 0;
txCount = 0;
receieved = 0;
sent = 0;
constructor(
private route: ActivatedRoute,
private electrsApiService: ElectrsApiService,
private websocketService: WebsocketService,
private stateService: StateService,
private audioService: AudioService,
) { }
ngOnInit() {
@@ -43,9 +48,10 @@ export class AddressComponent implements OnInit, OnDestroy {
)
.subscribe((address) => {
this.address = address;
this.updateChainStats();
this.websocketService.startTrackAddress(address.address);
this.isLoadingAddress = false;
this.getAddressTransactions(address.address);
this.reloadAddressTransactions(address.address);
},
(error) => {
console.log(error);
@@ -56,7 +62,25 @@ export class AddressComponent implements OnInit, OnDestroy {
this.stateService.mempoolTransactions$
.subscribe((transaction) => {
this.transactions.unshift(transaction);
this.addedTransactions++;
this.transactions = this.transactions.slice();
this.txCount++;
if (transaction.vout.some((vout) => vout.scriptpubkey_address === this.address.address)) {
this.audioService.playSound('cha-ching');
} else {
this.audioService.playSound('chime');
}
transaction.vin.forEach((vin) => {
if (vin.prevout.scriptpubkey_address === this.address.address) {
this.sent += vin.prevout.value;
}
});
transaction.vout.forEach((vout) => {
if (vout.scriptpubkey_address === this.address.address) {
this.receieved += vout.value;
}
});
});
this.stateService.blockTransactions$
@@ -64,6 +88,8 @@ export class AddressComponent implements OnInit, OnDestroy {
const tx = this.transactions.find((t) => t.txid === transaction.txid);
if (tx) {
tx.status = transaction.status;
this.transactions = this.transactions.slice();
this.audioService.playSound('magic');
}
});
@@ -71,15 +97,24 @@ export class AddressComponent implements OnInit, OnDestroy {
.subscribe((state) => {
if (!state && this.transactions && this.transactions.length) {
this.isLoadingTransactions = true;
this.getAddressTransactions(this.address.address);
this.reloadAddressTransactions(this.address.address);
}
});
}
getAddressTransactions(address: string) {
updateChainStats() {
this.receieved = this.address.chain_stats.funded_txo_sum + this.address.mempool_stats.funded_txo_sum;
this.sent = this.address.chain_stats.spent_txo_sum + this.address.mempool_stats.spent_txo_sum;
this.txCount = this.address.chain_stats.tx_count + this.address.mempool_stats.tx_count;
}
reloadAddressTransactions(address: string) {
this.isLoadingTransactions = true;
this.electrsApiService.getAddressTransactions$(address)
.subscribe((transactions: any) => {
this.transactions = transactions;
this.updateChainStats();
this.isLoadingTransactions = false;
});
}