feat(logger): enhance logging configuration with minLevel and silent option
- Added a new LogLevel "silent" to suppress logging output. - Replaced the debug boolean flag in LoggerConfig with a minLevel property to specify the minimum log level. - Updated shouldLog function to respect the new minLevel configuration. - Modified parseDebugFlag to return appropriate LogLevel based on truthy values. - Updated main.tsx to accommodate changes in logging configuration, including parsing minLevel from attributes and options. - Deprecated the debug flag in favor of minLevel for better clarity and control over logging behavior.
This commit is contained in:
@@ -5,17 +5,36 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Fluoro Multiframe Test</title>
|
||||
<style>
|
||||
html,body{height:100%;margin:0}
|
||||
.dicom-viewer-root{width:100%;height:100vh;background:#222;color:#fff}
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.dicom-viewer-root {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background: #222;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="main_viewer" class="dicom-viewer-root" data-auto-cache-stack="false"></div>
|
||||
<div
|
||||
id="main_viewer"
|
||||
class="dicom-viewer-root"
|
||||
data-auto-cache-stack="false"
|
||||
></div>
|
||||
|
||||
<!-- Provide noop React Refresh preamble to avoid plugin-react runtime errors -->
|
||||
<script>
|
||||
window.$RefreshReg$ = window.$RefreshReg$ || function () {};
|
||||
window.$RefreshSig$ = window.$RefreshSig$ || function() { return function(type) { return type; }; };
|
||||
window.$RefreshSig$ =
|
||||
window.$RefreshSig$ ||
|
||||
function () {
|
||||
return function (type) {
|
||||
return type;
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
@@ -23,49 +42,86 @@
|
||||
<script>
|
||||
// Viewer state for fluoro multiframe images (using relative paths from public/test_images/)
|
||||
const state = {
|
||||
"grid": {"rows": 1, "cols": 2},
|
||||
"modes": ["stack", "stack"],
|
||||
"stacks": [
|
||||
{"i": ["wadouri:test_images/fluro/series_2369/1.3.12.2.1107.5.4.5.180506.30000026031914043350300000126.4.dcm"]},
|
||||
{"i": ["wadouri:test_images/multibvalues/IMG_792_og2P5S6.dcm", "wadouri:test_images/multibvalues/IMG_793_3tKkg87.dcm"]}
|
||||
grid: { rows: 1, cols: 2 },
|
||||
modes: ["stack", "stack"],
|
||||
stacks: [
|
||||
{
|
||||
i: [
|
||||
"wadouri:https://www.penracourses.org.uk/media/atlas/dicom/1.3.12.2.1107.5.4.5.180506.30000026031914043350300000126.4.dcm",
|
||||
],
|
||||
"stackIdx": [0, 1],
|
||||
"stackPos": [0, 1],
|
||||
"props": [
|
||||
{"voiRange": {"lower": 0, "upper": 500}, "invert": false, "interpolationType": 1, "VOILUTFunction": "LINEAR", "colormap": {"name": "Grayscale", "opacity": []}},
|
||||
{"voiRange": {"lower": 0, "upper": 500}, "invert": false, "interpolationType": 1, "VOILUTFunction": "LINEAR", "colormap": {"name": "Grayscale", "opacity": []}}
|
||||
},
|
||||
],
|
||||
"cam": [
|
||||
{"viewUp": [0, 0, 1], "viewPlaneNormal": [1, 0, 0], "position": [150, 0, 0], "focalPoint": [0, 0, 0], "parallelProjection": true, "parallelScale": 100, "viewAngle": 90, "flipHorizontal": false, "flipVertical": false, "rotation": 0},
|
||||
{"viewUp": [0, 0, 1], "viewPlaneNormal": [1, 0, 0], "position": [150, 0, 0], "focalPoint": [0, 0, 0], "parallelProjection": true, "parallelScale": 100, "viewAngle": 90, "flipHorizontal": false, "flipVertical": false, "rotation": 0}
|
||||
stackIdx: [0, 1],
|
||||
stackPos: [0, 1],
|
||||
props: [
|
||||
{
|
||||
voiRange: { lower: 0, upper: 500 },
|
||||
invert: false,
|
||||
interpolationType: 1,
|
||||
VOILUTFunction: "LINEAR",
|
||||
colormap: { name: "Grayscale", opacity: [] },
|
||||
},
|
||||
{
|
||||
voiRange: { lower: 0, upper: 500 },
|
||||
invert: false,
|
||||
interpolationType: 1,
|
||||
VOILUTFunction: "LINEAR",
|
||||
colormap: { name: "Grayscale", opacity: [] },
|
||||
},
|
||||
],
|
||||
"orientations": [null, null],
|
||||
"volumeSliceIndices": [null, null]
|
||||
cam: [
|
||||
{
|
||||
viewUp: [0, 0, 1],
|
||||
viewPlaneNormal: [1, 0, 0],
|
||||
position: [150, 0, 0],
|
||||
focalPoint: [0, 0, 0],
|
||||
parallelProjection: true,
|
||||
parallelScale: 100,
|
||||
viewAngle: 90,
|
||||
flipHorizontal: false,
|
||||
flipVertical: false,
|
||||
rotation: 0,
|
||||
},
|
||||
{
|
||||
viewUp: [0, 0, 1],
|
||||
viewPlaneNormal: [1, 0, 0],
|
||||
position: [150, 0, 0],
|
||||
focalPoint: [0, 0, 0],
|
||||
parallelProjection: true,
|
||||
parallelScale: 100,
|
||||
viewAngle: 90,
|
||||
flipHorizontal: false,
|
||||
flipVertical: false,
|
||||
rotation: 0,
|
||||
},
|
||||
],
|
||||
orientations: [null, null],
|
||||
volumeSliceIndices: [null, null],
|
||||
};
|
||||
|
||||
function callWhenReady(fnName, payload) {
|
||||
const maxWait = 5000;
|
||||
const start = Date.now();
|
||||
(function check() {
|
||||
if (window[fnName] && typeof window[fnName] === 'function') {
|
||||
if (window[fnName] && typeof window[fnName] === "function") {
|
||||
try {
|
||||
window[fnName](payload);
|
||||
console.log('imported viewer state via', fnName);
|
||||
console.log("imported viewer state via", fnName);
|
||||
} catch (e) {
|
||||
console.error('importViewerState call failed', e);
|
||||
console.error("importViewerState call failed", e);
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (Date.now() - start > maxWait) {
|
||||
console.warn('Timed out waiting for', fnName);
|
||||
console.warn("Timed out waiting for", fnName);
|
||||
return;
|
||||
}
|
||||
setTimeout(check, 2000);
|
||||
})();
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
callWhenReady('importViewerState', state);
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
callWhenReady("importViewerState", state);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
File diff suppressed because one or more lines are too long
+604
-153
File diff suppressed because it is too large
Load Diff
@@ -1,15 +1,23 @@
|
||||
export type LogLevel = "debug" | "info" | "warn" | "error";
|
||||
export type LogLevel = "debug" | "info" | "warn" | "error" | "silent";
|
||||
export type LogFormat = "compact" | "verbose" | "json";
|
||||
|
||||
export type LoggerConfig = {
|
||||
debug: boolean;
|
||||
minLevel: LogLevel;
|
||||
format: LogFormat;
|
||||
namespace: string;
|
||||
dedupeWindowMs: number;
|
||||
};
|
||||
|
||||
const LEVEL_ORDER: Record<LogLevel, number> = {
|
||||
debug: 0,
|
||||
info: 1,
|
||||
warn: 2,
|
||||
error: 3,
|
||||
silent: 4,
|
||||
};
|
||||
|
||||
const DEFAULT_CONFIG: LoggerConfig = {
|
||||
debug: false,
|
||||
minLevel: "warn",
|
||||
format: "compact",
|
||||
namespace: "dv3d",
|
||||
dedupeWindowMs: 1200,
|
||||
@@ -46,14 +54,11 @@ function serializeArg(arg: unknown): unknown {
|
||||
}
|
||||
|
||||
function shouldLog(level: LogLevel) {
|
||||
if (level === "debug") {
|
||||
return loggerConfig.debug;
|
||||
}
|
||||
return true;
|
||||
return LEVEL_ORDER[level] >= LEVEL_ORDER[loggerConfig.minLevel];
|
||||
}
|
||||
|
||||
function shouldDedupe(level: LogLevel) {
|
||||
return level === "debug";
|
||||
return level === "debug" || level === "info";
|
||||
}
|
||||
|
||||
function buildFingerprint(level: LogLevel, args: unknown[], ctx?: LogContext): string {
|
||||
@@ -138,18 +143,28 @@ export function parseLogFormat(value: unknown): LogFormat {
|
||||
return DEFAULT_CONFIG.format;
|
||||
}
|
||||
|
||||
export function parseDebugFlag(value: unknown): boolean {
|
||||
if (typeof value === "boolean") {
|
||||
/** Parse a log level string. Falls back to the default ("warn") for unknown values. */
|
||||
export function parseLogLevel(value: unknown): LogLevel {
|
||||
if (value === "debug" || value === "info" || value === "warn" || value === "error" || value === "silent") {
|
||||
return value;
|
||||
}
|
||||
return DEFAULT_CONFIG.minLevel;
|
||||
}
|
||||
|
||||
/** Backward-compat helper: maps a truthy debug flag to minLevel "debug" or "warn". */
|
||||
export function parseDebugFlag(value: unknown): LogLevel {
|
||||
if (typeof value === "boolean") {
|
||||
return value ? "debug" : "warn";
|
||||
}
|
||||
if (typeof value === "string") {
|
||||
const normalized = value.trim().toLowerCase();
|
||||
return normalized === "1" || normalized === "true" || normalized === "yes" || normalized === "on";
|
||||
const truthy = normalized === "1" || normalized === "true" || normalized === "yes" || normalized === "on";
|
||||
return truthy ? "debug" : "warn";
|
||||
}
|
||||
if (typeof value === "number") {
|
||||
return value !== 0;
|
||||
return value !== 0 ? "debug" : "warn";
|
||||
}
|
||||
return false;
|
||||
return "warn";
|
||||
}
|
||||
|
||||
export const logger = {
|
||||
|
||||
@@ -8,14 +8,19 @@ import {
|
||||
logger,
|
||||
parseDebugFlag,
|
||||
parseLogFormat,
|
||||
parseLogLevel,
|
||||
setLoggerConfig,
|
||||
type LogFormat,
|
||||
type LogLevel,
|
||||
} from "./lib/logger";
|
||||
|
||||
type MountOptions = {
|
||||
force?: boolean;
|
||||
containerIds?: string[];
|
||||
logging?: {
|
||||
/** Minimum log level to emit. Takes precedence over `debug`. */
|
||||
minLevel?: LogLevel;
|
||||
/** @deprecated Use minLevel instead. true maps to "debug", false maps to "warn". */
|
||||
debug?: boolean;
|
||||
format?: LogFormat;
|
||||
};
|
||||
@@ -40,8 +45,8 @@ declare global {
|
||||
interface Window {
|
||||
mountDicomViewers?: (options?: MountOptions) => void;
|
||||
remountDicomViewer?: (containerId: string) => void;
|
||||
setDicomViewerLogging?: (config: { debug?: boolean; format?: LogFormat }) => void;
|
||||
getDicomViewerLogging?: () => { debug: boolean; format: LogFormat; namespace: string; dedupeWindowMs: number };
|
||||
setDicomViewerLogging?: (config: { minLevel?: LogLevel; debug?: boolean; format?: LogFormat }) => void;
|
||||
getDicomViewerLogging?: () => { minLevel: LogLevel; format: LogFormat; namespace: string; dedupeWindowMs: number };
|
||||
}
|
||||
}
|
||||
|
||||
@@ -158,13 +163,26 @@ const shouldMountContainer = (container: HTMLElement, options?: MountOptions): b
|
||||
};
|
||||
|
||||
const getContainerLogConfig = (container: HTMLElement, options?: MountOptions) => {
|
||||
const attrLevel = container.getAttribute("data-log-level");
|
||||
const attrDebug = container.getAttribute("data-log-debug");
|
||||
const attrFormat = container.getAttribute("data-log-format");
|
||||
|
||||
const debug = attrDebug !== null ? parseDebugFlag(attrDebug) : !!options?.logging?.debug;
|
||||
const format = parseLogFormat(attrFormat ?? options?.logging?.format);
|
||||
// Resolve minLevel: data-log-level > options.minLevel > data-log-debug (legacy) > options.debug (legacy)
|
||||
let minLevel: LogLevel;
|
||||
if (attrLevel !== null) {
|
||||
minLevel = parseLogLevel(attrLevel);
|
||||
} else if (options?.logging?.minLevel) {
|
||||
minLevel = options.logging.minLevel;
|
||||
} else if (attrDebug !== null) {
|
||||
minLevel = parseDebugFlag(attrDebug);
|
||||
} else if (options?.logging?.debug !== undefined) {
|
||||
minLevel = parseDebugFlag(options.logging.debug);
|
||||
} else {
|
||||
minLevel = "warn";
|
||||
}
|
||||
|
||||
return { debug, format };
|
||||
const format = parseLogFormat(attrFormat ?? options?.logging?.format);
|
||||
return { minLevel, format };
|
||||
};
|
||||
|
||||
const mountContainer = (container: HTMLElement, imageStacks: () => Promise<any[]>, options?: MountOptions) => {
|
||||
@@ -261,8 +279,13 @@ window.remountDicomViewer = (containerId: string) => {
|
||||
mountDicomViewers({ force: true, containerIds: [containerId] });
|
||||
};
|
||||
window.setDicomViewerLogging = (config) => {
|
||||
const minLevel = config.minLevel
|
||||
? parseLogLevel(config.minLevel)
|
||||
: config.debug !== undefined
|
||||
? parseDebugFlag(config.debug)
|
||||
: undefined;
|
||||
setLoggerConfig({
|
||||
debug: config.debug,
|
||||
minLevel,
|
||||
format: config.format ? parseLogFormat(config.format) : undefined,
|
||||
});
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user