diff --git a/website/src/repl/idbutils.mjs b/website/src/repl/idbutils.mjs index 40219c9a..959dc7d1 100644 --- a/website/src/repl/idbutils.mjs +++ b/website/src/repl/idbutils.mjs @@ -40,8 +40,10 @@ export const registerSamplesFromDB = (config = userSamplesDBConfig, onComplete = if (!isAudioFile(title)) { return; } - const splitRelativePath = soundFile.id?.split('/'); - const parentDirectory = splitRelativePath[splitRelativePath.length - 2]; + const splitRelativePath = soundFile.id.split('/'); + const parentDirectory = + //fallback to file name before period and seperator if no parent directory + splitRelativePath[splitRelativePath.length - 2] ?? soundFile.id.split(/\W+/)[0] ?? 'user'; const soundPath = soundFile.blob; const soundPaths = sounds.get(parentDirectory) ?? new Set(); soundPaths.add(soundPath); @@ -114,6 +116,7 @@ const processFilesForIDB = async (files) => { Array.from(files) .map(async (s) => { const title = s.name; + if (!isAudioFile(title)) { return; } @@ -121,12 +124,14 @@ const processFilesForIDB = async (files) => { const sUrl = URL.createObjectURL(s); //fetch the sound and turn it into a buffer array const buf = await fetch(sUrl).then((res) => res.arrayBuffer()); - //create a url blob containing all of the buffer data + //create a url base64 containing all of the buffer data const base64 = await bufferToDataUrl(buf); + const path = s.webkitRelativePath; + const id = path?.length ? path : title; return { title, blob: base64, - id: s.webkitRelativePath, + id, }; }) .filter(Boolean), diff --git a/website/src/repl/panel/ImportSoundsButton.jsx b/website/src/repl/panel/ImportSoundsButton.jsx index 20a1d5e3..7a97b9e0 100644 --- a/website/src/repl/panel/ImportSoundsButton.jsx +++ b/website/src/repl/panel/ImportSoundsButton.jsx @@ -10,6 +10,7 @@ export default function ImportSoundsButton({ onComplete }) { return; } setIsUploading(true); + await uploadSamplesToDB(userSamplesDBConfig, fileUploadRef.current.files).then(() => { registerSamplesFromDB(userSamplesDBConfig, () => { onComplete(); @@ -32,7 +33,7 @@ export default function ImportSoundsButton({ onComplete }) { directory="" webkitdirectory="" multiple - accept="audio/*" + accept="audio/*, .wav, .mp3, .m4a, .flac" onChange={() => { onChange(); }}