GlcoinCore/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2026-08-13 12:33:11 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Merge 056e358584 into 29afce710d

Browse source
This commit is contained in:
Oscar Guevara 2026-08-11 20:15:33 -07:00 • committed by GitHub
commit 39a1f3fdde
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 49 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

66
frontend/src/app/components/block-overview-tooltip/block-overview-tooltip.component.ts
View file

@ -1,4 +1,4 @@
import { Component, ElementRef, ViewChild, Input, OnChanges, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
import { Component, ElementRef, ViewChild, Input, OnChanges, AfterViewChecked, ChangeDetectorRef, ApplicationRef } from '@angular/core';
import { Position } from '@components/block-overview-graph/sprite-types.js';
import { Price } from '@app/services/price.service';
import { TransactionStripped } from '@interfaces/node-api.interface.js';
@ -40,23 +40,12 @@ export class BlockOverviewTooltipComponent implements OnChanges {
constructor(
private cd: ChangeDetectorRef,
) {}
private appRef: ApplicationRef,
) { }
ngOnChanges(changes): void {
if (changes.cursorPosition && changes.cursorPosition.currentValue) {
let x = changes.cursorPosition.currentValue.x + 10;
let y = changes.cursorPosition.currentValue.y + 10;
if (this.tooltipElement) {
const elementBounds = this.tooltipElement.nativeElement.getBoundingClientRect();
const parentBounds = this.tooltipElement.nativeElement.offsetParent.getBoundingClientRect();
if ((parentBounds.left + x + elementBounds.width) > parentBounds.right) {
x = Math.max(0, parentBounds.width - elementBounds.width - 10);
}
if (y + elementBounds.height > parentBounds.height) {
y = y - elementBounds.height - 20;
}
}
this.tooltipPosition = { x, y };
this.updateTooltipPosition(changes.cursorPosition.currentValue, false);
}
if (this.tx && (changes.tx || changes.filterFlags || changes.filterMode)) {
@ -78,7 +67,6 @@ export class BlockOverviewTooltipComponent implements OnChanges {
this.activeFilters[filter.key] = true;
}
}
if (!this.relativeTime) {
this.timeMode = 'mempool';
} else {
@ -93,11 +81,55 @@ export class BlockOverviewTooltipComponent implements OnChanges {
}
}
}
this.cd.markForCheck();
if (this.cursorPosition) {
this.schedulePositionRecalc();
}
}
}
private schedulePositionRecalc(): void {
requestAnimationFrame(() => {
this.updateTooltipPosition(this.cursorPosition, true);
this.appRef.tick();
});
}
private updateTooltipPosition(cursor: Position, yOnly: boolean = false): void {
const baseX = cursor.x;
const baseY = cursor.y;
let x = baseX + 10;
let y = baseY + 10;
if (this.tooltipElement?.nativeElement?.offsetParent) {
const elementBounds = this.tooltipElement.nativeElement.getBoundingClientRect();
const parentBounds = this.tooltipElement.nativeElement.offsetParent.getBoundingClientRect();
const belowY = baseY + 10;
const aboveY = baseY - elementBounds.height - 20;
const maxYInParent = parentBounds.height - elementBounds.height;
if (!yOnly) {
if ((parentBounds.left + x + elementBounds.width) > parentBounds.right) {
x = Math.max(0, parentBounds.width - elementBounds.width - 10);
}
}
if (belowY <= maxYInParent) {
y = belowY;
} else if (aboveY <= maxYInParent) {
y = aboveY;
} else {
y = maxYInParent;
}
}
if (yOnly) {
this.tooltipPosition = { ...this.tooltipPosition, y };
} else {
this.tooltipPosition = { x, y };
}
this.cd.markForCheck();
}
getTooltipLeftPosition(): string {
return window.innerWidth < 392 ? '-50px' : this.tooltipPosition.x + 'px';
}