Ecosystem/monerod-gui
1
0
Fork 0
mirror of https://github.com/everoddandeven/monerod-gui.git synced 2025-01-05 10:29:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix window tab scroll

Browse source
This commit is contained in:
everoddandeven 2024-12-28 21:42:24 +01:00
parent a09c5b46bd
commit bc882b0210
15 changed files with 79 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/app/pages/about/about.component.html
View file

@ -11,7 +11,7 @@
</div>
</div>
<div class="tab-content" id="pills-tabContent">
<div class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-overview" role="tabpanel" aria-labelledby="pills-overview-tab" tabindex="0">
<div class="container mt-5">
<div class="card shadow-lg border-0">

2
src/app/pages/bans/bans.component.html
View file

@ -11,7 +11,7 @@
</div>
</div>
<div [hidden]="!daemonRunning || daemonStopping" class="tab-content" id="pills-tabContent">
<div [hidden]="!daemonRunning || daemonStopping" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-overview" role="tabpanel" aria-labelledby="pills-overview-tab" tabindex="0">
<h4 class="mb-3">List of banned IPs</h4>
<table

58
src/app/pages/base-page/base-page.component.ts
View file

@ -16,7 +16,15 @@ export abstract class BasePageComponent implements AfterContentInit, OnDestroy {
protected subscriptions: Subscription[] = [];
constructor(private navbarService: NavbarService) { }
private readonly mResizeHandler: (event: Event) => void = (event: Event) => setTimeout(() => this.updateTableContentHeight(), 100);
constructor(private navbarService: NavbarService) {
this.subscriptions.push(this.navbarService.onDaemonStatusChanged.subscribe((running) => {
if (running) setTimeout(() => this.updateTableContentHeight(), 100);
}));
window.addEventListener('resize', this.mResizeHandler);
}
protected setLinks(links: NavbarLink[] = []): void {
this._links = links;
@ -169,6 +177,8 @@ export abstract class BasePageComponent implements AfterContentInit, OnDestroy {
public ngAfterContentInit(): void {
this.navbarService.setLinks(this._links);
setTimeout(() => this.updateTableContentHeight(), 100);
}
public ngOnDestroy(): void {
@ -176,7 +186,53 @@ export abstract class BasePageComponent implements AfterContentInit, OnDestroy {
this.subscriptions.forEach((sub: Subscription) => sub.unsubscribe());
this.subscriptions = [];
window.removeEventListener('resize', this.mResizeHandler);
this.destroyTables();
}
public updateTableContentHeight(): void {
if (!visualViewport) {
return;
}
const viewHeight = visualViewport?.height;
if (!viewHeight) {
return;
}
console.log(`view height: ${viewHeight}`);
const elements = document.getElementsByClassName('tab-content tab-grow');
if (!elements || elements.length === 0) {
return;
}
const offset = 35;
const tab = elements[0] as HTMLElement;
const rect = tab.getBoundingClientRect();
const left = viewHeight - rect.bottom;
const currentHeight = tab.clientHeight;
let newHeight: number;
if (left > 0) {
if (left < offset) {
newHeight = parseInt(`${currentHeight}`);
}
else {
const offsetLeft = left - offset;
newHeight = parseInt(`${ currentHeight + offsetLeft }`);
}
}
else {
newHeight = currentHeight + left - offset;
}
tab.style.height = `${newHeight}px`;
console.log(`old height: ${currentHeight}, left: ${left} new height: ${newHeight}`);
}
}

2
src/app/pages/blockchain/blockchain.component.html
View file

@ -11,7 +11,7 @@
</ul>
</div>
</div>
<div *ngIf="daemonRunning && !daemonStopping && !daemonStarting" class="tab-content" id="pills-tabContent">
<div *ngIf="daemonRunning && !daemonStopping && !daemonStarting" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-block-queue" role="tabpanel" aria-labelledby="pills-block-queue-tab" tabindex="0">
<h4 class="mb-3">Overview of current block set queue</h4>

2
src/app/pages/detail/detail.component.html
View file

@ -33,7 +33,7 @@
</div>
</div>
<div *ngIf="daemonRunning && !stoppingDaemon" class="tab-content" id="pills-tabContent">
<div *ngIf="daemonRunning && !stoppingDaemon" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab" tabindex="0">
<div class="row d-flex justify-content-center">

2
src/app/pages/logs/logs.component.html
View file

@ -10,7 +10,7 @@
</ul>
</div>
</div>
<div class="tab-content" id="pills-tabContent">
<div class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-overview" role="tabpanel" aria-labelledby="pills-overview-tab" tabindex="0">
<div *ngIf="lines.length === 0" class="h-100 p-5 text-bg-dark rounded-3 m-4 text-center">

2
src/app/pages/mining/mining.component.html
View file

@ -11,7 +11,7 @@
</div>
</div>
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content" id="pills-tabContent">
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-mining-status" role="tabpanel" aria-labelledby="pills-mining-status-tab" tabindex="0">
<div *ngIf="coreBusy" class="alert alert-danger d-flex align-items-center justify-content-center text-center" role="alert">
<h4><i class="bi bi-exclamation-triangle m-2"></i></h4>&nbsp;&nbsp;

2
src/app/pages/network/network.component.html
View file

@ -11,7 +11,7 @@
</div>
</div>
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content" id="pills-tabContent">
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-net-stats" role="tabpanel" aria-labelledby="pills-net-stats-tab" tabindex="0">
<h2><i class="bi bi-cloud-arrow-down m-4"></i> Download ({{ currentNetStats.totalGigaBytesIn.toFixed(2) }} GB)</h2>

2
src/app/pages/outputs/outputs.component.html
View file

@ -10,7 +10,7 @@
</ul>
</div>
</div>
<div *ngIf="daemonRunning && !daemonStopping && !daemonRestarting" class="tab-content" id="pills-tabContent">
<div *ngIf="daemonRunning && !daemonStopping && !daemonRestarting" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-outputs-get-outs" role="tabpanel" aria-labelledby="pills-outputs-get-outs-tab" tabindex="0">
<h4 class="mb-3">Get outputs</h4>

2
src/app/pages/peers/peers.component.html
View file

@ -11,7 +11,7 @@
</div>
</div>
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content" id="pills-tabContent">
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-peer-list" role="tabpanel" aria-labelledby="pills-peer-list-tab" tabindex="0">
<h4 class="mb-3">List of known peers</h4>
<div class="m-3">

2
src/app/pages/settings/settings.component.html
View file

@ -13,7 +13,7 @@
</div>
</div>
<div *ngIf="!loading" class="tab-content" id="pills-settings-tabContent">
<div *ngIf="!loading" class="tab-content tab-grow" id="pills-settings-tabContent">
<div *ngIf="savingChangesError !== ''" class="alert alert-danger d-flex align-items-center justify-content-center text-center" role="alert">
<h4><i class="bi bi-exclamation-triangle m-2"></i></h4>&nbsp;&nbsp;
<div>

2
src/app/pages/transactions/transactions.component.html
View file

@ -11,7 +11,7 @@
</div>
</div>
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content" id="pills-tabContent">
<div *ngIf="daemonRunning && !daemonStopping" class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-tx-pool" role="tabpanel" aria-labelledby="pills-tx-pool-tab" tabindex="0">
<h4 class="mb-3">Information about valid transactions seen by the node but not yet mined into a block, as well as spent key image information for the txpool in the node's memory</h4>

2
src/app/pages/version/version.component.html
View file

@ -11,7 +11,7 @@
</div>
</div>
<div class="tab-content" id="pills-tabContent">
<div class="tab-content tab-grow" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-monero" role="tabpanel" aria-labelledby="pills-monero-tab" tabindex="0">
<div *ngIf="upgradeError !== ''" class="alert alert-danger d-flex align-items-center justify-content-center text-center" role="alert">
<h4><i class="bi bi-exclamation-triangle m-2"></i></h4>&nbsp;&nbsp;

6
src/app/shared/components/navbar/navbar.service.ts
View file

@ -1,4 +1,4 @@
import { Injectable, NgZone } from '@angular/core';
import { EventEmitter, Injectable, NgZone } from '@angular/core';
import { NavbarLink } from './navbar.model';
import { DaemonService } from '../../../core/services';
@ -13,6 +13,10 @@ export class NavbarService {
return this._navbarLinks;
}
public get onDaemonStatusChanged(): EventEmitter<boolean> {
return this.daemonService.onDaemonStatusChanged;
}
constructor(private daemonService: DaemonService, private zone: NgZone) {
this.daemonService.onDaemonStatusChanged.subscribe((running: boolean) => {
this.daemonRunning = running;

5
src/styles.scss
View file

@ -9,6 +9,11 @@ $primary: #ff5733;
height: 1rem;
}
.tab-grow {
overflow: hidden;
overflow-y: auto;
}
/*
* Sidebar
*/