support trees of RBF replacements
This commit is contained in:
@@ -1,31 +1,54 @@
|
||||
<div class="rbf-timeline box" [class.mined]="mined">
|
||||
<div class="timeline">
|
||||
<div class="intervals">
|
||||
<ng-container *ngFor="let replacement of replacements; let i = index;">
|
||||
<div class="interval" *ngIf="i > 0">
|
||||
<div class="interval-time">
|
||||
<app-time [time]="replacement.time - replacements[i-1].time" [relative]="false"></app-time>
|
||||
</div>
|
||||
</div>
|
||||
<div class="node-spacer"></div>
|
||||
</ng-container>
|
||||
</div>
|
||||
<div class="nodes">
|
||||
<ng-container *ngFor="let replacement of replacements; let i = index;">
|
||||
<div class="interval-spacer" *ngIf="i > 0">
|
||||
<div class="track"></div>
|
||||
</div>
|
||||
<div class="node" [class.selected]="txid === replacement.tx.txid" [class.mined]="replacement.mined">
|
||||
<div class="track"></div>
|
||||
<a class="shape-border" [class.rbf]="replacement.tx.rbf" [routerLink]="['/tx/' | relativeUrl, replacement.tx.txid]" [title]="replacement.tx.txid">
|
||||
<div class="shape"></div>
|
||||
</a>
|
||||
<span class="fee-rate">{{ replacement.tx.fee / (replacement.tx.vsize) | feeRounding }} <span class="symbol" i18n="shared.sat-vbyte|sat/vB">sat/vB</span></span>
|
||||
</div>
|
||||
</ng-container>
|
||||
<div class="rbf-timeline box" [class.mined]="replacements.mined">
|
||||
<div class="timeline-wrapper">
|
||||
<div class="timeline" *ngFor="let timeline of rows">
|
||||
<div class="intervals">
|
||||
<ng-container *ngFor="let cell of timeline; let i = index;">
|
||||
<div class="node-spacer"></div>
|
||||
<ng-container *ngIf="i < timeline.length - 1">
|
||||
<div class="interval" *ngIf="cell.replacement?.interval != null; else intervalSpacer">
|
||||
<div class="interval-time">
|
||||
<app-time [time]="cell.replacement.interval" [relative]="false"></app-time>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</div>
|
||||
<div class="nodes">
|
||||
<ng-container *ngFor="let cell of timeline; let i = index;">
|
||||
<ng-container *ngIf="cell.replacement; else nonNode">
|
||||
<div class="node" [class.selected]="txid === cell.replacement.tx.txid" [class.mined]="cell.replacement.tx.mined" [class.first-node]="cell.first">
|
||||
<div class="track"></div>
|
||||
<a class="shape-border" [class.rbf]="cell.replacement.tx.rbf" [routerLink]="['/tx/' | relativeUrl, cell.replacement.tx.txid]" [title]="cell.replacement.tx.txid">
|
||||
<div class="shape"></div>
|
||||
</a>
|
||||
<span class="fee-rate">{{ cell.replacement.tx.fee / (cell.replacement.tx.vsize) | feeRounding }} <span class="symbol" i18n="shared.sat-vbyte|sat/vB">sat/vB</span></span>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-template #nonNode>
|
||||
<ng-container [ngSwitch]="cell.connector">
|
||||
<div class="connector" *ngSwitchCase="'pipe'"><div class="pipe"></div></div>
|
||||
<div class="connector" *ngSwitchCase="'corner'"><div class="corner"></div></div>
|
||||
<div class="node-spacer" *ngSwitchDefault></div>
|
||||
</ng-container>
|
||||
</ng-template>
|
||||
<ng-container *ngIf="i < timeline.length - 1">
|
||||
<div class="interval-spacer" *ngIf="cell.replacement?.interval != null; else intervalSpacer">
|
||||
<div class="track"></div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-template #nodeSpacer>
|
||||
<div class="node-spacer"></div>
|
||||
</ng-template>
|
||||
|
||||
<ng-template #intervalSpacer>
|
||||
<div class="interval-spacer"></div>
|
||||
</ng-template>
|
||||
|
||||
<!-- <app-rbf-timeline-tooltip
|
||||
*ngIf=[tooltip]
|
||||
[line]="hoverLine"
|
||||
|
||||
Reference in New Issue
Block a user