diff --git a/web/monitorUI.d.ts b/web/monitorUI.d.ts index c3486e8..3f0b61a 100644 --- a/web/monitorUI.d.ts +++ b/web/monitorUI.d.ts @@ -10,6 +10,9 @@ export declare class MonitorUI extends ProgressBarUIBase { private currentRate; lastMonitor: number; styleSheet: HTMLStyleElement; + maxVRAMUsed: { + [key: number]: number; + }; constructor(rootElement: HTMLElement, monitorCPUElement: TMonitorSettings, monitorRAMElement: TMonitorSettings, monitorHDDElement: TMonitorSettings, monitorGPUSettings: TMonitorSettings[], monitorVRAMSettings: TMonitorSettings[], monitorTemperatureSettings: TMonitorSettings[], currentRate: number); createDOM: () => void; createDOMGPUMonitor: (monitorSettings?: TMonitorSettings) => void; @@ -21,4 +24,5 @@ export declare class MonitorUI extends ProgressBarUIBase { createMonitor: (monitorSettings?: TMonitorSettings) => HTMLDivElement; updateMonitorSize: (width: number, height: number) => void; showMonitor: (monitorSettings: TMonitorSettings, value: boolean) => void; + resetMaxVRAM: () => void; } diff --git a/web/monitorUI.js b/web/monitorUI.js index ec37f5f..a2247ea 100644 --- a/web/monitorUI.js +++ b/web/monitorUI.js @@ -63,6 +63,12 @@ export class MonitorUI extends ProgressBarUIBase { writable: true, value: void 0 }); + Object.defineProperty(this, "maxVRAMUsed", { + enumerable: true, + configurable: true, + writable: true, + value: {} + }); Object.defineProperty(this, "createDOM", { enumerable: true, configurable: true, @@ -175,7 +181,15 @@ export class MonitorUI extends ProgressBarUIBase { let title = `${Math.floor(percent)}${monitorSettings.symbol}`; let postfix = ''; if (used !== undefined && total !== undefined) { - postfix = ` - ${formatBytes(used)} / ${formatBytes(total)} GB`; + const gpuIndex = parseInt(monitorSettings.monitorTitle?.split(':')[0] || '0'); + if (!this.maxVRAMUsed[gpuIndex] || this.maxVRAMUsed[gpuIndex] > total) { + this.maxVRAMUsed[gpuIndex] = 0; + } + if (used > this.maxVRAMUsed[gpuIndex]) { + this.maxVRAMUsed[gpuIndex] = used; + } + postfix = ` - ${formatBytes(used)} / ${formatBytes(total)}`; + postfix += ` Max: ${formatBytes(this.maxVRAMUsed[gpuIndex])}`; } title = `${prefix}${title}${postfix}`; if (monitorSettings.htmlMonitorRef) { @@ -275,6 +289,14 @@ export class MonitorUI extends ProgressBarUIBase { } } }); + Object.defineProperty(this, "resetMaxVRAM", { + enumerable: true, + configurable: true, + writable: true, + value: () => { + this.maxVRAMUsed = {}; + } + }); this.createDOM(); this.styleSheet = createStyleSheet('crystools-monitors-size'); } diff --git a/web/monitorUI.ts b/web/monitorUI.ts index ecef44f..8208c41 100644 --- a/web/monitorUI.ts +++ b/web/monitorUI.ts @@ -4,6 +4,7 @@ import { createStyleSheet, formatBytes } from './utils.js'; export class MonitorUI extends ProgressBarUIBase { lastMonitor = 1; // just for order on monitors section styleSheet: HTMLStyleElement; + maxVRAMUsed: { [key: number]: number } = {}; // Add this to track max VRAM per GPU constructor( public override rootElement: HTMLElement, @@ -130,15 +131,30 @@ export class MonitorUI extends ProgressBarUIBase { return; } - // console.log('updateMonitor', monitorSettings.id, percent); - const prefix = monitorSettings.monitorTitle ? monitorSettings.monitorTitle + ' - ' : ''; let title = `${Math.floor(percent)}${monitorSettings.symbol}`; let postfix = ''; + // Add max VRAM tracking for VRAM monitors if (used !== undefined && total !== undefined) { - postfix = ` - ${formatBytes(used)} / ${formatBytes(total)} GB`; + // Extract GPU index from monitorTitle (assuming format "X: GPU Name") + const gpuIndex = parseInt(monitorSettings.monitorTitle?.split(':')[0] || '0'); + + // Initialize max VRAM if not set or glitch + if (!this.maxVRAMUsed[gpuIndex] || this.maxVRAMUsed[gpuIndex] > total) { + this.maxVRAMUsed[gpuIndex] = 0; + } + + // Update max VRAM if current usage is higher + if ( used > this.maxVRAMUsed[gpuIndex]) { + this.maxVRAMUsed[gpuIndex] = used; + } + + postfix = ` - ${formatBytes(used)} / ${formatBytes(total)}`; + // Add max VRAM to tooltip + postfix += ` Max: ${formatBytes(this.maxVRAMUsed[gpuIndex])}`; } + title = `${prefix}${title}${postfix}`; if (monitorSettings.htmlMonitorRef) { @@ -226,4 +242,8 @@ export class MonitorUI extends ProgressBarUIBase { monitorSettings.htmlMonitorRef.style.display = value ? 'flex' : 'none'; } }; + + resetMaxVRAM = (): void => { + this.maxVRAMUsed = {}; + }; }