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

Adding a third connection state and preventing offline indicator from pushing the menu.

Browse Source
This commit is contained in:
softsimon 2020-03-09 17:53:54 +07:00
parent 994c42440d
commit 2296ad69b9
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
7 changed files with 40 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
backend/src/api/websocket-handler.ts
View File

@ -136,7 +136,7 @@ class WebsocketHandler {
const foundTransactions: TransactionExtended[] = [];
newTransactions.forEach((tx) => {
const someVin = tx.vin.some((vin) => vin.prevout && vin.prevout.scriptpubkey_address === client['track-address']);
const someVin = tx.vin.some((vin) => !!vin.prevout && vin.prevout.scriptpubkey_address === client['track-address']);
if (someVin) {
foundTransactions.push(tx);
return;
@ -185,7 +185,7 @@ class WebsocketHandler {
const foundTransactions: TransactionExtended[] = [];
transactions.forEach((tx) => {
if (tx.vin && tx.vin.some((vin) => vin.prevout && vin.prevout.scriptpubkey_address === client['track-address'])) {
if (tx.vin && tx.vin.some((vin) => !!vin.prevout && vin.prevout.scriptpubkey_address === client['track-address'])) {
foundTransactions.push(tx);
return;
}

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

@ -97,9 +97,9 @@ export class AddressComponent implements OnInit, OnDestroy {
this.loadedConfirmedTxCount++;
});
this.stateService.isOffline$
this.stateService.connectionState$
.subscribe((state) => {
if (!state && this.transactions && this.transactions.length) {
if (state === 2 && this.transactions && this.transactions.length) {
this.loadAddress(this.addressString);
}
});

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

@ -1,6 +1,10 @@
<header>
<nav class="navbar navbar-expand-md navbar-dark bg-dark">
<a class="navbar-brand" routerLink="/"><img src="./assets/mempool-space-logo.png" width="180" class="logo"> <span class="badge badge-warning" style="margin-left: 10px;" *ngIf="isOffline">Offline</span></a>
<a class="navbar-brand" routerLink="/" style="position: relative;">
<img src="./assets/mempool-space-logo.png" width="180" class="logo" [ngStyle]="{'opacity': connectionState === 2 ? 1 : 0.5 }">
<div class="badge badge-warning connection-badge" *ngIf="connectionState === 0">Offline</div>
<div class="badge badge-warning connection-badge" style="left: 60px;" *ngIf="connectionState === 1">Reconnecting...</div>
</a>
<button class="navbar-toggler" type="button" (click)="collapse()" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>

7
frontend/src/app/components/master-page/master-page.component.scss
View File

@ -27,4 +27,11 @@ li.nav-item a {
nav {
box-shadow: 0px 0px 15px 0px #000;
}
.connection-badge {
margin-left: 10px;
position: absolute;
top: 10px;
left: 100px;
}

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

@ -8,16 +8,16 @@ import { StateService } from '../../services/state.service';
})
export class MasterPageComponent implements OnInit {
navCollapsed = false;
isOffline = false;
connectionState = 2;
constructor(
private stateService: StateService,
) { }
ngOnInit() {
this.stateService.isOffline$
this.stateService.connectionState$
.subscribe((state) => {
this.isOffline = state;
this.connectionState = state;
});
}

2
frontend/src/app/services/state.service.ts
View File

@ -20,5 +20,5 @@ export class StateService {
live2Chart$ = new Subject<OptimizedMempoolStats>();
viewFiat$ = new BehaviorSubject<boolean>(false);
isOffline$ = new BehaviorSubject<boolean>(false);
connectionState$ = new BehaviorSubject<0 | 1 | 2>(2);
}

28
frontend/src/app/services/websocket.service.ts
View File

@ -29,13 +29,19 @@ export class WebsocketService {
this.startSubscription();
}
startSubscription() {
startSubscription(retrying = false) {
this.connectionCheckTimeout = window.setTimeout(() => {
console.log('WebSocket failed to connect, force closing, trying to reconnect in 10 seconds');
console.log('WebSocket failed to connect, force closing, trying to reconnect');
this.websocketSubject.complete();
this.subscription.unsubscribe();
this.goOffline();
}, 5000);
this.goOffline(true);
}, 10000);
if (retrying) {
if (this.stateService.connectionState$.value === 2) {
return;
}
this.stateService.connectionState$.next(1);
}
this.websocketSubject.next({'action': 'init'});
this.subscription = this.websocketSubject
.subscribe((response: WebsocketResponse) => {
@ -115,7 +121,11 @@ export class WebsocketService {
if (this.trackingAddress) {
this.startTrackTransaction(this.trackingAddress);
}
this.stateService.isOffline$.next(false);
this.stateService.connectionState$.next(2);
}
if (this.stateService.connectionState$.value === 1) {
this.stateService.connectionState$.next(2);
}
clearTimeout(this.connectionCheckTimeout);
@ -147,10 +157,12 @@ export class WebsocketService {
this.lastWant = data;
}
goOffline() {
goOffline(instant = false) {
this.goneOffline = true;
this.stateService.isOffline$.next(true);
window.setTimeout(() => this.startSubscription(), 10000);
this.stateService.connectionState$.next(0);
window.setTimeout(() => {
this.startSubscription(true);
}, instant ? 10 : 10000);
}
startOnlineCheck() {