chore: add audio example, update ATTRIBUTION

example_vault/.gitattributes

@@ -2,3 +2,4 @@ video/** filter=lfs diff=lfs merge=lfs -text
 images/** filter=lfs diff=lfs merge=lfs -text
 3d/David_(Michelangelo).stl filter=lfs diff=lfs merge=lfs -text
 3d/Scan_the_World_-_Venus_de_Milo.stl filter=lfs diff=lfs merge=lfs -text
+audio/** filter=lfs diff=lfs merge=lfs -text

example_vault/ATTRIBUTION.md

@@ -1,10 +1,11 @@
 - `video/video_wide.webm` is [**Sirui 35mm Anamorphic Lens TEST FOOTAGE (pure cinematography)** by _DreamDuo Films_][video_wide]
 - `video/video_vertical.webm` is [**free footage video background | portrait background** by _CahRusli_][video_vertical]
+- `audio/drjohndee...mp3` from https://archive.org/details/dr_john_dee_2301_librivox
 - `images` - `church.jpg`, `landscape.jpg`, `vertical_rocks.jpg` by _Tomáš Mládek_
-- `images/The_Blue_Marble.jpg` - https://commons.wikimedia.org/wiki/File:The_Blue_Marble.jpg
-- `images/The Great Wave off Kanagawa.jpg` - https://en.wikipedia.org/wiki/File:Tsunami_by_hokusai_19th_century.jpg
-- `models/David_(Michelangelo).stl` - https://commons.wikimedia.org/wiki/File:David_(Michelangelo).stl
-- `models/Scan_the_World_-_Venus_de_Milo.stl` - https://commons.wikimedia.org/wiki/File:Scan_the_World_-_Venus_de_Milo.stl
+- `images/The_Blue_Marble.jpg` from https://commons.wikimedia.org/wiki/File:The_Blue_Marble.jpg
+- `images/The Great Wave off Kanagawa.jpg` from https://en.wikipedia.org/wiki/File:Tsunami_by_hokusai_19th_century.jpg
+- `models/David_(Michelangelo).stl` from https://commons.wikimedia.org/wiki/File:David_(Michelangelo).stl
+- `models/Scan_the_World_-_Venus_de_Milo.stl` from https://commons.wikimedia.org/wiki/File:Scan_the_World_-_Venus_de_Milo.stl
 
 [video_wide]: https://www.youtube.com/watch?v=rGVeryrPMEA
 [video_vertical]: https://www.youtube.com/shorts/QbhDvqZ50Lw

webui/src/stories/BlobPreview.stories.ts

@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/svelte";
 import BlobPreview from "../components/display/BlobPreview.svelte";
 import {
+  audioAddress,
   imageAddress,
   imageVerticalAddress,
   stlAddress,
@@ -30,6 +31,10 @@ export const ImageVertical: Story = {
   args: { address: imageVerticalAddress },
 };
 
+export const Audio: Story = {
+  args: {address: audioAddress}
+}
+
 export const Video: Story = {
   args: { address: videoAddress },
 };

webui/src/stories/BlobViewer.stories.ts

@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/svelte";
 import BlobViewer from "../components/display/BlobViewer.svelte";
 import {
+  audioAddress,
   imageAddress,
   imageVerticalAddress,
   stlAddress,
@@ -12,12 +13,21 @@ const meta: Meta<BlobViewer> = {
   title: "Blobs/BlobViewer",
   component: BlobViewer,
   tags: ["autodocs"],
+  args: {
+    editable: false,
+  },
   argTypes: {
     detail: {
       control: {
         type: "boolean",
       },
     },
+    editable: {
+      control: {
+        type: "boolean",
+        default: false,
+      },
+    },
   },
 };
 
@@ -32,6 +42,10 @@ export const ImageVertical: Story = {
   args: { address: imageVerticalAddress },
 };
 
+export const Audio: Story = {
+  args: { address: audioAddress },
+};
+
 export const Video: Story = {
   args: { address: videoAddress },
 };

webui/src/stories/common.ts

@@ -2,6 +2,8 @@ export const imageAddress = "zQmQ91HTsWMpuoHPJXf1B95Jp9QU2R2WSzZYLL1vNNivmkE";
 export const imageVerticalAddress =
   "zQmd9ZbZKMm92oVgCdf7DpHCxJE9Vkb1JXNxXfgVcxLXnwc";
 
+export const audioAddress = "zQmajiLgFz3VZ6L4RhTXyvLDE1aXV1hDMdLBVqibuUUdaYv";
+
 export const videoAddress = "zQmeQHYJRniFnkFhG8fDNKQmwqHJW9rLyhX5WCnoDtg7wWa";
 export const videoVerticalAddress =
   "zQmfJtFbrckn8ZXFuEpL2tbaQGSjv7smTamd2TSTYQGidwt";