From 15785fea6835ba8569031c3240b7a70c2fd918e0 Mon Sep 17 00:00:00 2001 From: bymyself Date: Mon, 24 Feb 2025 12:05:44 -0700 Subject: [PATCH] Add drag and drop audio files onto LoadAudio nodes (#2710) Co-authored-by: Chenlei Hu --- src/extensions/core/uploadAudio.ts | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/src/extensions/core/uploadAudio.ts b/src/extensions/core/uploadAudio.ts index 404d6c0eb9..0fb2af25b4 100644 --- a/src/extensions/core/uploadAudio.ts +++ b/src/extensions/core/uploadAudio.ts @@ -2,6 +2,7 @@ import type { IWidget } from '@comfyorg/litegraph' import type { IStringWidget } from '@comfyorg/litegraph/dist/types/widgets' +import { useNodeDragAndDrop } from '@/composables/useNodeDragAndDrop' import { useNodeFileInput } from '@/composables/node/useNodeFileInput' import type { DOMWidget } from '@/scripts/domWidget' import { useToastStore } from '@/stores/toastStore' @@ -180,13 +181,16 @@ app.registerExtension({ } } + const handleUpload = async (files: File[]) => { + if (files?.length) { + uploadFile(audioWidget, audioUIWidget, files[0], true) + } + return files + } + const { openFileSelection } = useNodeFileInput(node, { accept: 'audio/*', - onSelect: (files) => { - if (files?.length) { - uploadFile(audioWidget, audioUIWidget, files[0], true) - } - } + onSelect: handleUpload }) // The widget to pop up the upload dialog. @@ -199,6 +203,11 @@ app.registerExtension({ ) uploadWidget.label = 'choose file to upload' + useNodeDragAndDrop(node, { + fileFilter: (file) => file.type.startsWith('audio/'), + onDrop: handleUpload + }) + node.previewMediaType = 'audio' return { widget: uploadWidget }