Retropex/mempool
1
0
Fork 0
mirror of https://github.com/Retropex/mempool.git synced 2025-05-12 18:20:41 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

misc changes

Browse Source
This commit is contained in:
Mononaut 2025-04-01 06:23:36 +00:00
parent 4d8a68156d
commit 3500a657a9
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
3 changed files with 24 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/app/components/blockchain/blockchain.component.html
View File

@ -1,4 +1,4 @@
<div class="text-center" class="blockchain-wrapper" [class.time-ltr]="timeLtr" [class.ltr-transition]="ltrTransitionEnabled" #container>
<div class="text-center" class="blockchain-wrapper" [class.time-ltr]="timeLtr" [class.ltr-transition]="ltrTransitionEnabled" [class.flipped]="flipped && isA1()" #container>
<div #positionContainer class="position-container" [ngClass]="network ? network : ''" [style]="positionStyle">
<span>
<div class="blocks-wrapper">
@ -10,7 +10,7 @@
</ng-container>
</div>
<div id="divider" [hidden]="pageIndex > 0">
<button class="block-display-toggle" (click)="toggleBlockDisplayMode()"><fa-icon [icon]="['fas', 'exchange-alt']" [fixedWidth]="true"></fa-icon></button>
<button class="block-display-toggle" (click)="toggleBlockDisplayMode()"><fa-icon [icon]="['fas', isA1() ? 'arrows-rotate' : 'exchange-alt']" [fixedWidth]="true"></fa-icon></button>
<button class="time-toggle" (click)="toggleTimeDirection()"><fa-icon [icon]="['fas', 'exchange-alt']" [fixedWidth]="true"></fa-icon></button>
</div>
</span>

7
frontend/src/app/components/blockchain/blockchain.component.scss
View File

@ -19,6 +19,13 @@
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
transition: transform 2s;
&.flipped {
transform: rotate(180deg);
}
}
.position-container {

19
frontend/src/app/components/blockchain/blockchain.component.ts
View File

@ -29,6 +29,8 @@ export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
connected: boolean = true;
blockDisplayMode: 'size' | 'fees';
flipped: boolean = false;
dividerOffset: number | null = null;
mempoolOffset: number | null = null;
positionStyle = {
@ -90,10 +92,14 @@ export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
}
toggleBlockDisplayMode(): void {
if (this.blockDisplayMode === 'size') this.blockDisplayMode = 'fees';
else this.blockDisplayMode = 'size';
this.StorageService.setValue('block-display-mode-preference', this.blockDisplayMode);
this.stateService.blockDisplayMode$.next(this.blockDisplayMode);
if (this.isA1()) {
this.flipped = !this.flipped;
} else {
if (this.blockDisplayMode === 'size') this.blockDisplayMode = 'fees';
else this.blockDisplayMode = 'size';
this.StorageService.setValue('block-display-mode-preference', this.blockDisplayMode);
this.stateService.blockDisplayMode$.next(this.blockDisplayMode);
}
}
onMempoolWidthChange(width): void {
@ -126,6 +132,11 @@ export class BlockchainComponent implements OnInit, OnDestroy, OnChanges {
}
}
isA1(): boolean {
const now = new Date();
return now.getMonth() === 3 && now.getDate() === 1;
}
onResize(): void {
const width = this.containerWidth || window.innerWidth;
if (width >= 768) {