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

Change filters to dropdown selection menu.

Browse Source
This commit is contained in:
Miguel Medeiros
2021-10-06 01:08:13 -03:00
parent c2f288a861
commit a2e866d15a
5 changed files with 103 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/src/app/components/statistics/statistics.component.html
View File

@@ -36,6 +36,38 @@
<input ngbButton type="radio" [value]="'1y'" [routerLink]="['/graphs' | relativeUrl]" fragment="1y"> 1Y
</label>
</div>
<div class="d-inline-block" ngbDropdown #myDrop="ngbDropdown">
<button class="btn btn-primary btn-sm ml-2" id="dropdownFees" ngbDropdownAnchor (focus)="myDrop.open()">Fee Ranges</button>
<div class="dropdown-fees" ngbDropdownMenu aria-labelledby="dropdownFees">
<ng-template ngFor let-fee let-i="index" [ngForOf]="feeLevels">
<ng-template [ngIf]="fee === 1">
<li (click)="filterFees(fee)" [class]="filterFeeIndex < fee ? 'inactive' : ''">
<ng-template [ngIf]="inverted">
<span class="square" [ngStyle]="{'backgroundColor': chartColors[i]}"></span>
</ng-template>
<ng-template [ngIf]="!inverted">
<span class="square" [ngStyle]="{'backgroundColor': chartColors[i - 1]}"></span>
</ng-template>
<span class="fee-text" >0 - {{ fee }}</span>
</li>
</ng-template>
<ng-template [ngIf]="fee <= 200 && fee !== 1">
<li (click)="filterFees(fee)" [class]="filterFeeIndex < fee ? 'inactive' : ''">
<ng-template [ngIf]="inverted">
<span class="square" [ngStyle]="{'backgroundColor': chartColors[i]}"></span>
<span class="fee-text" >{{feeLevels[i - 1]}} - {{ fee }}</span>
</ng-template>
<ng-template [ngIf]="!inverted">
<span class="square" [ngStyle]="{'backgroundColor': chartColors[i - 1]}"></span>
<span class="fee-text" >{{feeLevels[i + 1]}} - {{ fee }}</span>
</ng-template>
</li>
</ng-template>
</ng-template>
</div>
</div>
<button (click)="invertGraph()" class="btn btn-primary btn-sm ml-2 d-none d-md-inline"><fa-icon [icon]="['fas', 'exchange-alt']" [rotate]="90" [fixedWidth]="true" i18n-title="statistics.component-invert.title" title="Invert"></fa-icon></button>
</form>
</div>
@@ -44,9 +76,9 @@
<app-mempool-graph
dir="ltr"
[template]="'advanced'"
[limitFee]="500"
[limitFee]="filterFeeIndex"
[height]="500"
[left]="155"
[left]="65"
[right]="10"
[data]="mempoolStats"
></app-mempool-graph>