Allow CTRL F an address on the transaction list component

This commit is contained in:
nymkappa 2022-05-16 16:50:42 +02:00
parent e63aaedbc0
commit 9be6f80cb9
No known key found for this signature in database
GPG Key ID: E155910B16E8BD04
5 changed files with 36 additions and 2 deletions

View File

@ -68,6 +68,7 @@ import { HashrateChartPoolsComponent } from './components/hashrates-chart-pools/
import { MiningStartComponent } from './components/mining-start/mining-start.component';
import { AmountShortenerPipe } from './shared/pipes/amount-shortener.pipe';
import { ShortenStringPipe } from './shared/pipes/shorten-string-pipe/shorten-string.pipe';
import { CapAddressPipe } from './shared/pipes/cap-address-pipe/cap-address-pipe';
import { GraphsComponent } from './components/graphs/graphs.component';
import { DifficultyAdjustmentsTable } from './components/difficulty-adjustments-table/difficulty-adjustments-table.components';
import { BlocksList } from './components/blocks-list/blocks-list.component';
@ -163,6 +164,7 @@ import { BlockSizesWeightsGraphComponent } from './components/block-sizes-weight
StorageService,
LanguageService,
ShortenStringPipe,
CapAddressPipe,
{ provide: HTTP_INTERCEPTORS, useClass: HttpCacheInterceptor, multi: true }
],
bootstrap: [AppComponent]

View File

@ -65,7 +65,10 @@
<ng-template #defaultAddress>
<a [routerLink]="['/address/' | relativeUrl, vin.prevout.scriptpubkey_address]" title="{{ vin.prevout.scriptpubkey_address }}">
<span class="d-block d-lg-none">{{ vin.prevout.scriptpubkey_address | shortenString : 16 }}</span>
<span class="d-none d-lg-block">{{ vin.prevout.scriptpubkey_address | shortenString : 35 }}</span>
<span class="d-none d-lg-flex justify-content-start">
<span class="addr-left flex-grow-1" [style]="vin.prevout.scriptpubkey_address.length > 40 ? 'max-width: 235px' : ''">{{ vin.prevout.scriptpubkey_address }}</span>
<span *ngIf="vin.prevout.scriptpubkey_address.length > 40" class="addr-right">{{ vin.prevout.scriptpubkey_address | capAddress: 40: 10 }}</span>
</span>
</a>
<div>
<app-address-labels [vin]="vin"></app-address-labels>
@ -156,7 +159,10 @@
<td>
<a *ngIf="vout.scriptpubkey_address; else scriptpubkey_type" [routerLink]="['/address/' | relativeUrl, vout.scriptpubkey_address]" title="{{ vout.scriptpubkey_address }}">
<span class="d-block d-lg-none">{{ vout.scriptpubkey_address | shortenString : 16 }}</span>
<span class="d-none d-lg-block">{{ vout.scriptpubkey_address | shortenString : 35 }}</span>
<span class="d-none d-lg-flex justify-content-start">
<span class="addr-left flex-grow-1" [style]="vout.scriptpubkey_address.length > 40 ? 'max-width: 235px' : ''">{{ vout.scriptpubkey_address }}</span>
<span *ngIf="vout.scriptpubkey_address.length > 40" class="addr-right">{{ vout.scriptpubkey_address | capAddress: 40: 10 }}</span>
</span>
</a>
<div>
<app-address-labels [vout]="vout"></app-address-labels>

View File

@ -129,3 +129,14 @@ h2 {
.summary {
margin-top: 10px;
}
.addr-left {
font-family: monospace;
overflow: hidden;
text-overflow: ellipsis;
margin-right: -7px
}
.addr-right {
font-family: monospace;
}

View File

@ -0,0 +1,12 @@
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({ name: 'capAddress' })
export class CapAddressPipe implements PipeTransform {
transform(str: string, cap: number, leftover: number) {
if (!str) { return; }
if (str.length <= cap) {
return str;
}
return str.slice(-Math.max(cap - str.length, leftover));
}
}

View File

@ -29,6 +29,7 @@ import { MempoolBlocksComponent } from '../components/mempool-blocks/mempool-blo
import { BlockchainBlocksComponent } from '../components/blockchain-blocks/blockchain-blocks.component';
import { AmountComponent } from '../components/amount/amount.component';
import { RouterModule } from '@angular/router';
import { CapAddressPipe } from './pipes/cap-address-pipe/cap-address-pipe';
@NgModule({
declarations: [
@ -51,6 +52,7 @@ import { RouterModule } from '@angular/router';
WuBytesPipe,
CeilPipe,
ShortenStringPipe,
CapAddressPipe,
Decimal2HexPipe,
FeeRoundingPipe,
ColoredPriceDirective,
@ -103,6 +105,7 @@ import { RouterModule } from '@angular/router';
WuBytesPipe,
CeilPipe,
ShortenStringPipe,
CapAddressPipe,
Decimal2HexPipe,
FeeRoundingPipe,
ColoredPriceDirective,