From 2814f15d48b5e21b20cfd15628d75d8ba65b9d08 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Loi=CC=88c=20Correnson?= <loic.correnson@cea.fr> Date: Wed, 16 Dec 2020 20:03:20 +0100 Subject: [PATCH] [ivette/values] selection feedback --- ivette/src/frama-c/eva/Values.tsx | 24 ++++++++++++++++-------- ivette/src/frama-c/eva/model.ts | 9 +++++++-- ivette/src/frama-c/eva/style.css | 14 +++++++++++++- 3 files changed, 36 insertions(+), 11 deletions(-) diff --git a/ivette/src/frama-c/eva/Values.tsx b/ivette/src/frama-c/eva/Values.tsx index c67600aaf12..fcf47d19b24 100644 --- a/ivette/src/frama-c/eva/Values.tsx +++ b/ivette/src/frama-c/eva/Values.tsx @@ -81,26 +81,28 @@ const forceUpdate = () => setImmediate(ChangeEvent.emit); interface TableCellProps { kind: RowKind; probe: Probe; + model: Model; } function TableCell(props: TableCellProps) { Dome.useUpdate(ChangeEvent); - const { probe, kind } = props; + const { probe, kind, model } = props; const minWidth = WSIZER.dimension(probe.minCols); const maxWidth = WSIZER.dimension(probe.maxCols); const style = { minWidth, maxWidth }; let styling = 'dome-text-code'; let contents: React.ReactNode = props.probe.marker; + const { transient, label, code } = probe; switch (kind) { case 'probes': - if (probe.transient) { - styling = 'eva-transient dome-text-label'; + if (transient) { + styling = 'dome-text-label'; contents = '« Current »'; - } else if (probe.label) { + } else if (label) { styling = 'dome-text-label'; - contents = probe.label; + contents = label; } else { - contents = <>{probe.code}</>; + contents = <>{code}</>; } break; case 'values': @@ -109,6 +111,8 @@ function TableCell(props: TableCellProps) { const className = classes( 'eva-cell', styling, + transient && 'eva-transient', + !transient && model.isFocused(probe) && 'eva-focused', ); return ( <div className={className} style={style}> @@ -134,8 +138,12 @@ function TableRow(props: TableRowProps) { if (!row) return null; const { kind, probes } = row; const className = `eva-${kind}`; - const contents = probes.map((p) => ( - <TableCell kind={kind} key={p.marker} probe={p} /> + const contents = probes.map((probe) => ( + <TableCell + key={probe.marker} + kind={kind} + probe={probe} + model={model} /> )); return ( <Hpack className={className} style={props.style}> diff --git a/ivette/src/frama-c/eva/model.ts b/ivette/src/frama-c/eva/model.ts index 908c5315c48..22218fb0e6b 100644 --- a/ivette/src/frama-c/eva/model.ts +++ b/ivette/src/frama-c/eva/model.ts @@ -36,6 +36,8 @@ export class Model implements StateCallbacks { private remanent?: Probe; // last transient private probes = new Map<string, Probe>(); + isFocused(p: Probe | undefined) { return p === this.focused; } + getProbe(m: marker): Probe { let p = this.probes.get(m); if (!p) { @@ -55,6 +57,8 @@ export class Model implements StateCallbacks { if (p.transient && p !== r) { this.remanent = p; this.forceLayout(); + } else { + this.forceUpdate(); } } else { this.focused = undefined; @@ -67,7 +71,7 @@ export class Model implements StateCallbacks { // --- Values - private readonly cache = new ValueCache(this); + readonly cache = new ValueCache(this); // --- Rows @@ -132,7 +136,8 @@ export class Model implements StateCallbacks { p.requestProbeInfo(); } }); - + this.cache.clear(); + this.forceLayout(); } // --- Force Updating (re-render) diff --git a/ivette/src/frama-c/eva/style.css b/ivette/src/frama-c/eva/style.css index 7debdda86c7..558c00240ad 100644 --- a/ivette/src/frama-c/eva/style.css +++ b/ivette/src/frama-c/eva/style.css @@ -100,8 +100,20 @@ background: #fff; } -.eva-transient { +.eva-probes .eva-transient { background: orange; } +.eva-values .eva-transient { + background: #fff0d5; +} + +.eva-probes .eva-focused { + background: lightblue; +} + +.eva-values .eva-focused { + background: #def6ff; +} + /* -------------------------------------------------------------------------- */ -- GitLab