This is an automated email from the ASF dual-hosted git repository.
davin pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/daffodil-vscode.git
The following commit(s) were added to refs/heads/main by this push:
new 845cbf9 profile graph can be in linear or log scale
845cbf9 is described below
commit 845cbf980839e3b5a85d227ad186332e27feb032
Author: Davin Shearer <[email protected]>
AuthorDate: Thu Aug 10 12:56:39 2023 -0400
profile graph can be in linear or log scale
---
src/dataEditor/dataEditorClient.ts | 5 +-
.../DataMetrics/ByteFrequencyGraph.svelte | 84 ++++++++++++++++------
src/svelte/src/utilities/display.ts | 7 +-
3 files changed, 68 insertions(+), 28 deletions(-)
diff --git a/src/dataEditor/dataEditorClient.ts
b/src/dataEditor/dataEditorClient.ts
index 1ca350d..9121ca1 100644
--- a/src/dataEditor/dataEditorClient.ts
+++ b/src/dataEditor/dataEditorClient.ts
@@ -121,7 +121,7 @@ class HeartbeatInfo implements IHeartbeatInfo {
let activeSessions: string[] = []
let checkpointPath: string = ''
let client: EditorClient
-let getHeartbeatIntervalId: NodeJS.Timeout | undefined = undefined
+let getHeartbeatIntervalId: NodeJS.Timeout | number | undefined = undefined
let heartbeatInfo: IHeartbeatInfo = new HeartbeatInfo()
let omegaEditPort: number = 0
@@ -153,7 +153,8 @@ export class DataEditorClient implements vscode.Disposable {
private omegaSessionId = ''
private contentType = ''
private fileSize = 0
- private sendHeartbeatIntervalId: NodeJS.Timeout | undefined = undefined
+ private sendHeartbeatIntervalId: NodeJS.Timeout | number | undefined =
+ undefined
constructor(
protected context: vscode.ExtensionContext,
diff --git a/src/svelte/src/components/DataMetrics/ByteFrequencyGraph.svelte
b/src/svelte/src/components/DataMetrics/ByteFrequencyGraph.svelte
index cbbaa92..da7046a 100644
--- a/src/svelte/src/components/DataMetrics/ByteFrequencyGraph.svelte
+++ b/src/svelte/src/components/DataMetrics/ByteFrequencyGraph.svelte
@@ -46,14 +46,16 @@ limitations under the License.
let variance: number = 0
let stdDev: number = 0
let numAscii: number = 0
- let isEditing = ''
- let statusMessage = ''
- let warningMessage = ''
- let errorMessage = ''
+ let numDistinct: number = 0
+ let fieldBeingEdited: string = ''
+ let statusMessage: string = ''
+ let warningMessage: string = ''
+ let errorMessage: string = ''
let statusMessageTimeout: NodeJS.Timeout | null = null
let warningMessageTimeout: NodeJS.Timeout | null = null
let errorMessageTimeout: NodeJS.Timeout | null = null
- let asciiOverlay = true
+ let asciiOverlay: boolean = true
+ let logScale: boolean = false
$: {
sum = byteProfile.reduce((a, b) => a + b, 0)
@@ -64,6 +66,7 @@ limitations under the License.
let squareDiffs = byteProfile.map((value) => Math.pow(value - mean, 2))
variance = squareDiffs.reduce((a, b) => a + b, 0) / squareDiffs.length
stdDev = Math.sqrt(variance)
+ numDistinct = byteProfile.filter((value) => value > 0).length
colorScaleData = byteProfile.map((value) => {
if (value < mean - stdDev) return 'low'
@@ -71,7 +74,12 @@ limitations under the License.
return 'average'
})
- scaledData = byteProfile.map((d) => Math.round((d / maxFrequency) * 300))
// 300 is the max height of the chart
+ scaledData = byteProfile.map((d) => {
+ // Note: 300 is the max height of the chart. byteFrequency values are >=
0.
+ return logScale
+ ? Math.round((Math.log2(d + 1) / Math.log2(maxFrequency + 1)) * 300)
// adding 1 to prevent log(0)
+ : Math.round((d / maxFrequency) * 300)
+ })
}
function setStatusMessage(msg: string, timeout: number = 5000) {
@@ -233,11 +241,11 @@ limitations under the License.
default:
break
}
- isEditing = ''
+ fieldBeingEdited = ''
requestSessionProfile(startOffset, length)
}
function handleBlur() {
- isEditing = ''
+ fieldBeingEdited = ''
}
onMount(() => {
@@ -297,6 +305,18 @@ limitations under the License.
</div>
<hr />
<div>
+ <div class="input-container">
+ <label for="scale"
+ > Scale:
+ <span
+ id="scale"
+ class="editable"
+ on:click={() => {
+ logScale = !logScale
+ }}>{logScale ? 'Logarithmic' : 'Linear'}</span
+ >
+ </label>
+ </div>
<div class="input-container">
<label for="ascii-overlay-toggle"
> Overlay:
@@ -310,13 +330,15 @@ limitations under the License.
>
</label>
</div>
- {#if isEditing === 'startOffset'}
+ {#if fieldBeingEdited === 'startOffset'}
<div class="input-container">
<label for="start-offset-input" class="label"
>Start Offset:
<Input
id="start-offset-input"
- placeholder={startOffset.toString($addressRadix)}
+ placeholder="{startOffset.toString($addressRadix)} ({radixToString(
+ $addressRadix
+ )})"
value={startOffset.toString($addressRadix)}
on:inputEnter={handleInputEnter}
on:inputFocusOut={handleBlur}
@@ -329,23 +351,27 @@ limitations under the License.
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div
on:click={() => {
- isEditing = 'startOffset'
+ fieldBeingEdited = 'startOffset'
}}
>
<label for="start-offset"
>Start Offset: <span id="start-offset" class="editable"
- >{startOffset.toString($addressRadix)}</span
+ >{startOffset.toString($addressRadix)} ({radixToString(
+ $addressRadix
+ )})</span
></label
>
</div>
{/if}
- {#if isEditing === 'endOffset'}
+ {#if fieldBeingEdited === 'endOffset'}
<div class="input-container">
<label for="end-offset-input" class="label"
> End Offset:
<Input
id="end-offset-input"
- placeholder={endOffset.toString($addressRadix)}
+ placeholder="{endOffset.toString($addressRadix)} ({radixToString(
+ $addressRadix
+ )})"
value={endOffset.toString($addressRadix)}
on:inputEnter={handleInputEnter}
on:inputFocusOut={handleBlur}
@@ -358,23 +384,27 @@ limitations under the License.
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div
on:click={() => {
- isEditing = 'endOffset'
+ fieldBeingEdited = 'endOffset'
}}
>
<label for="end-offset"
> End Offset: <span id="end-offset" class="editable"
- >{endOffset.toString($addressRadix)}</span
+ >{endOffset.toString($addressRadix)} ({radixToString(
+ $addressRadix
+ )})</span
></label
>
</div>
{/if}
- {#if isEditing === 'length'}
+ {#if fieldBeingEdited === 'length'}
<div class="input-container">
<label for="length-input" class="label"
> Length:
<Input
id="length-input"
- placeholder={length.toString($addressRadix)}
+ placeholder="{length.toString($addressRadix)} ({radixToString(
+ $addressRadix
+ )})"
value={length.toString($addressRadix)}
on:inputEnter={handleInputEnter}
on:inputFocusOut={handleBlur}
@@ -387,13 +417,16 @@ limitations under the License.
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div
on:click={() => {
- isEditing = 'length'
+ fieldBeingEdited = 'length'
}}
>
<label for="length"
> Length: <span
id="length"
- class="editable">{length.toString($addressRadix)}</span
+ class="editable"
+ >{length.toString($addressRadix)} ({radixToString(
+ $addressRadix
+ )})</span
></label
>
</div>
@@ -403,7 +436,9 @@ limitations under the License.
<div class="stats">
<label for="computed-size"
> Max Offset: <span id="computed-size" class="nowrap"
- >{viewport.offsetMax}</span
+ >{viewport.offsetMax.toString($addressRadix)} ({radixToString(
+ $addressRadix
+ )})</span
></label
>
<label for="min-frequency"
@@ -435,6 +470,11 @@ limitations under the License.
> Byte Count: <span id="byte-count" class="nowrap">{sum}</span
></label
>
+ <label for="distinct-count"
+ > Distinct: <span id="distinct-count" class="nowrap"
+ >{numDistinct}</span
+ ></label
+ >
<label for="ascii-count"
>ASCII Count: <span id="ascii-count" class="nowrap">{numAscii}</span
></label
@@ -555,7 +595,7 @@ limitations under the License.
color: black;
border: 1px solid blue;
pointer-events: none;
- opacity: 0.75;
+ opacity: 0.95;
font-size: smaller;
}
diff --git a/src/svelte/src/utilities/display.ts
b/src/svelte/src/utilities/display.ts
index 0e2c14f..939b447 100644
--- a/src/svelte/src/utilities/display.ts
+++ b/src/svelte/src/utilities/display.ts
@@ -58,15 +58,14 @@ export function radixBytePad(radix: RadixValues): number {
export function radixToString(radix: RadixValues): string {
switch (radix) {
case 2:
- return 'binary'
+ return 'bin'
case 8:
- return 'octal'
+ return 'oct'
case 10:
- return 'decimal'
+ return 'dec'
case 16:
return 'hex'
}
- return 'binary'
}
export function byteDivWidthFromRadix(radix: RadixValues): ByteDivWidth {
