diff --git a/webui/src/App.svelte b/webui/src/App.svelte
index 52ce456..8b40db2 100644
--- a/webui/src/App.svelte
+++ b/webui/src/App.svelte
@@ -102,5 +102,10 @@
input {
display: none;
}
+
+ &.disabled {
+ pointer-events: none;
+ opacity: 0.7;
+ }
}
diff --git a/webui/src/components/display/BlobPreview.svelte b/webui/src/components/display/BlobPreview.svelte
index 45e437f..021b75f 100644
--- a/webui/src/components/display/BlobPreview.svelte
+++ b/webui/src/components/display/BlobPreview.svelte
@@ -44,7 +44,7 @@
{/if}
{#if audio}
-
+
{/if}
{#if video}
{#if imageLoaded != address}
diff --git a/webui/src/components/display/blobs/AudioViewer.svelte b/webui/src/components/display/blobs/AudioViewer.svelte
index de0b0e5..bff095d 100644
--- a/webui/src/components/display/blobs/AudioViewer.svelte
+++ b/webui/src/components/display/blobs/AudioViewer.svelte
@@ -16,6 +16,7 @@
export let address: string;
export let detail: boolean;
+ export let editable: boolean;
let containerEl: HTMLDivElement;
let timelineEl: HTMLDivElement;
@@ -95,7 +96,7 @@
}
$: if (wavesurfer) {
- if (detail) {
+ if (editable) {
wavesurfer.enableDragSelection({ color: DEFAULT_ANNOTATION_COLOR });
} else {
wavesurfer.disableDragSelection();
@@ -232,6 +233,7 @@
Start: {
currentAnnotation.update({
start: parseInt(ev.currentTarget.value),
@@ -244,6 +246,7 @@
End: {
currentAnnotation.update({
end: parseInt(ev.currentTarget.value),
@@ -256,6 +259,7 @@
Color: {
currentAnnotation.update({ color: ev.currentTarget.value });
updateAnnotation(currentAnnotation);
@@ -263,14 +267,16 @@
/>
-
-
currentAnnotation.remove()}>
-
-
-
-
+
+ {/if}
{#key currentAnnotation}
@@ -278,6 +284,7 @@
type="value"
valueTypes={["String"]}
value={currentAnnotation.data}
+ disabled={!editable}
on:input={(ev) => {
currentAnnotation.update({ data: ev.detail });
updateAnnotation(currentAnnotation);
diff --git a/webui/src/components/utils/Input.svelte b/webui/src/components/utils/Input.svelte
index 45044b8..d206ca9 100644
--- a/webui/src/components/utils/Input.svelte
+++ b/webui/src/components/utils/Input.svelte
@@ -5,6 +5,7 @@
export let placeholder = "";
export let value = "";
+ export let disabled = false;
let focused = false;
$: dispatch("focusChange", focused);
@@ -22,6 +23,7 @@
on:input={onInput}
on:focus={() => (focused = true)}
on:blur={() => (focused = false)}
+ {disabled}
/>
diff --git a/webui/src/components/utils/Selector.svelte b/webui/src/components/utils/Selector.svelte
index f7cbfba..b0db64a 100644
--- a/webui/src/components/utils/Selector.svelte
+++ b/webui/src/components/utils/Selector.svelte
@@ -18,6 +18,7 @@
export let type: "attribute" | "value";
export let valueTypes: VALUE_TYPE[] | undefined = undefined;
export let placeholder = "";
+ export let disabled = false;
let inputValue = "";
if (type == "attribute") {
@@ -194,6 +195,7 @@
bind:value={inputValue}
on:input={onInput}
on:focusChange={(ev) => (inputFocused = ev.detail)}
+ {disabled}
{placeholder}
/>
{/if}