mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-06 02:00:46 +00:00
Merge pull request #478 from storytold/fixes/mvp1_improvements
Fixes/mvp1 improvements
This commit is contained in:
43 files changed
+432
-106
No files matched your search
Regular → Executable
File mode changed.
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "ফেস অ্যানিমেটর",
|
||||
"videoMotionCapture": "ভিডিও মোশন ক্যাপচার",
|
||||
"videoTitle": "ভিডিও জেনারেশন",
|
||||
"videoW2l": "ভিডিও লিপ সিঙ্ক"
|
||||
"videoW2l": "ভিডিও লিপ সিঙ্ক",
|
||||
"videoWorkflow": "ভিডিও ওয়ার্কফ্লো"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "ওয়ার্কফ্লো কন্ট্রোলে এগিয়ে যান",
|
||||
"process": "কর্মপ্রবাহের প্রক্রিয়া",
|
||||
"select": "নির্বাচন করুন",
|
||||
"upload": "ভিডিও আপলোড কর"
|
||||
},
|
||||
"headings": {
|
||||
"title": "ভিডিও ওয়ার্কফ্লো"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "মিডিয়া থেকে বেছে নিন",
|
||||
"original": "আসল",
|
||||
"preview": "পূর্বরূপ",
|
||||
"upload": "আপলোড করুন"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Gesichtsanimator",
|
||||
"videoMotionCapture": "Video-Bewegungserfassung",
|
||||
"videoTitle": "Videogenerierung",
|
||||
"videoW2l": "Video-Lippensynchronisation"
|
||||
"videoW2l": "Video-Lippensynchronisation",
|
||||
"videoWorkflow": "Video-Workflow"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Fahren Sie mit den Workflow-Kontrollen fort",
|
||||
"process": "Vom Prozess zum Workflow",
|
||||
"select": "Wählen",
|
||||
"upload": "Video hochladen"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Video-Workflow"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Wählen Sie aus Medien",
|
||||
"original": "Original",
|
||||
"preview": "Vorschau",
|
||||
"upload": "Hochladen"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Face Animator",
|
||||
"videoMotionCapture": "Video Motion Capture",
|
||||
"videoTitle": "Video Generation",
|
||||
"videoW2l": "Video Lip Sync"
|
||||
"videoW2l": "Video Lip Sync",
|
||||
"videoWorkflow": "Video Workflow"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Proceed to Workflow Controls",
|
||||
"process": "Process to Workflow",
|
||||
"select": "Select",
|
||||
"upload": "Upload Video"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Video Workflow"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Choose from media",
|
||||
"original": "Original",
|
||||
"preview": "Preview",
|
||||
"upload": "Upload"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Animador de rostros",
|
||||
"videoMotionCapture": "Captura de movimiento de vídeo",
|
||||
"videoTitle": "Generación de vídeo",
|
||||
"videoW2l": "Sincronización de labios de vídeo"
|
||||
"videoW2l": "Sincronización de labios de vídeo",
|
||||
"videoWorkflow": "Flujo de trabajo de vídeo"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Continúe con los controles del flujo de trabajo",
|
||||
"process": "Proceso al flujo de trabajo",
|
||||
"select": "Seleccionar",
|
||||
"upload": "Subir vídeo"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Flujo de trabajo de vídeo"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Elige entre los medios",
|
||||
"original": "Original",
|
||||
"preview": "Avance",
|
||||
"upload": "Subir"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Animateur de visage",
|
||||
"videoMotionCapture": "Capture de mouvement vidéo",
|
||||
"videoTitle": "Génération vidéo",
|
||||
"videoW2l": "Synchronisation labiale vidéo"
|
||||
"videoW2l": "Synchronisation labiale vidéo",
|
||||
"videoWorkflow": "Flux de travail vidéo"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Passer aux contrôles de flux de travail",
|
||||
"process": "Du processus au flux de travail",
|
||||
"select": "Sélectionner",
|
||||
"upload": "Télécharger une video"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Flux de travail vidéo"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Choisissez parmi les médias",
|
||||
"original": "Original",
|
||||
"preview": "Aperçu",
|
||||
"upload": "Télécharger"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "फेस एनिमेटर",
|
||||
"videoMotionCapture": "वीडियो मोशन कैप्चर",
|
||||
"videoTitle": "वीडियो जनरेशन",
|
||||
"videoW2l": "वीडियो लिप सिंक"
|
||||
"videoW2l": "वीडियो लिप सिंक",
|
||||
"videoWorkflow": "वीडियो वर्कफ़्लो"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "वर्कफ़्लो नियंत्रण के लिए आगे बढ़ें",
|
||||
"process": "वर्कफ़्लो की प्रक्रिया",
|
||||
"select": "चुनना",
|
||||
"upload": "विडियो को अॅॅपलोड करें"
|
||||
},
|
||||
"headings": {
|
||||
"title": "वीडियो वर्कफ़्लो"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "मीडिया से चुनें",
|
||||
"original": "मूल",
|
||||
"preview": "पूर्व दर्शन",
|
||||
"upload": "डालना"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Animator Wajah",
|
||||
"videoMotionCapture": "Pengambilan Gerakan Video",
|
||||
"videoTitle": "Pembuatan Video",
|
||||
"videoW2l": "Sinkronisasi Bibir Video"
|
||||
"videoW2l": "Sinkronisasi Bibir Video",
|
||||
"videoWorkflow": "Alur Kerja Video"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Lanjutkan ke Kontrol Alur Kerja",
|
||||
"process": "Proses ke Alur Kerja",
|
||||
"select": "Pilih",
|
||||
"upload": "Mengunggah video"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Alur Kerja Video"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Pilih dari media",
|
||||
"original": "Asli",
|
||||
"preview": "Pratinjau",
|
||||
"upload": "Mengunggah"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Animatore di volti",
|
||||
"videoMotionCapture": "Acquisizione del movimento video",
|
||||
"videoTitle": "Generazione video",
|
||||
"videoW2l": "Sincronizzazione labiale video"
|
||||
"videoW2l": "Sincronizzazione labiale video",
|
||||
"videoWorkflow": "Flusso di lavoro video"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Procedi ai controlli del flusso di lavoro",
|
||||
"process": "Dal processo al flusso di lavoro",
|
||||
"select": "Selezionare",
|
||||
"upload": "Carica video"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Flusso di lavoro video"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Scegli tra i media",
|
||||
"original": "Originale",
|
||||
"preview": "Anteprima",
|
||||
"upload": "Caricamento"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "フェイスアニメーター",
|
||||
"videoMotionCapture": "ビデオモーションキャプチャ",
|
||||
"videoTitle": "ビデオ生成",
|
||||
"videoW2l": "ビデオリップシンク"
|
||||
"videoW2l": "ビデオリップシンク",
|
||||
"videoWorkflow": "ビデオワークフロー"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "ワークフロー制御に進む",
|
||||
"process": "プロセスからワークフローへ",
|
||||
"select": "選択する",
|
||||
"upload": "ビデオをアップロードする"
|
||||
},
|
||||
"headings": {
|
||||
"title": "ビデオワークフロー"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "メディアから選ぶ",
|
||||
"original": "オリジナル",
|
||||
"preview": "プレビュー",
|
||||
"upload": "アップロード"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "얼굴 애니메이터",
|
||||
"videoMotionCapture": "비디오 모션 캡처",
|
||||
"videoTitle": "비디오 생성",
|
||||
"videoW2l": "비디오 립싱크"
|
||||
"videoW2l": "비디오 립싱크",
|
||||
"videoWorkflow": "비디오 워크플로우"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "워크플로 제어로 진행",
|
||||
"process": "워크플로 프로세스",
|
||||
"select": "선택하다",
|
||||
"upload": "비디오 업로드"
|
||||
},
|
||||
"headings": {
|
||||
"title": "비디오 워크플로우"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "미디어에서 선택",
|
||||
"original": "원래의",
|
||||
"preview": "시사",
|
||||
"upload": "업로드"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Animador facial",
|
||||
"videoMotionCapture": "Captura de movimento de vídeo",
|
||||
"videoTitle": "Geração de Vídeo",
|
||||
"videoW2l": "Sincronização labial de vídeo"
|
||||
"videoW2l": "Sincronização labial de vídeo",
|
||||
"videoWorkflow": "Fluxo de trabalho de vídeo"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Prossiga para os controles de fluxo de trabalho",
|
||||
"process": "Processo para fluxo de trabalho",
|
||||
"select": "Selecione",
|
||||
"upload": "Envio vídeo"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Fluxo de trabalho de vídeo"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Escolha entre mídias",
|
||||
"original": "Original",
|
||||
"preview": "Visualização",
|
||||
"upload": "Carregar"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Лицевой Аниматор",
|
||||
"videoMotionCapture": "Захват видео движения",
|
||||
"videoTitle": "Создание видео",
|
||||
"videoW2l": "Видео синхронизация губ"
|
||||
"videoW2l": "Видео синхронизация губ",
|
||||
"videoWorkflow": "Видео рабочий процесс"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Перейдите к элементам управления рабочим процессом",
|
||||
"process": "От процесса к рабочему процессу",
|
||||
"select": "Выбирать",
|
||||
"upload": "Загрузить видео"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Видео рабочий процесс"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Выбирайте из медиа",
|
||||
"original": "Оригинал",
|
||||
"preview": "Предварительный просмотр",
|
||||
"upload": "Загрузить"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "แอนิเมชั่นใบหน้า",
|
||||
"videoMotionCapture": "จับภาพวิดีโอเคลื่อนไหว",
|
||||
"videoTitle": "การสร้างวิดีโอ",
|
||||
"videoW2l": "ลิปซิงค์วิดีโอ"
|
||||
"videoW2l": "ลิปซิงค์วิดีโอ",
|
||||
"videoWorkflow": "เวิร์กโฟลว์วิดีโอ"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "ดำเนินการควบคุมเวิร์กโฟลว์",
|
||||
"process": "กระบวนการสู่เวิร์กโฟลว์",
|
||||
"select": "เลือก",
|
||||
"upload": "อัปโหลดวิดีโอ"
|
||||
},
|
||||
"headings": {
|
||||
"title": "เวิร์กโฟลว์วิดีโอ"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "เลือกจากสื่อ",
|
||||
"original": "ต้นฉบับ",
|
||||
"preview": "ดูตัวอย่าง",
|
||||
"upload": "ที่อัพโหลด"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "Yüz Animatörü",
|
||||
"videoMotionCapture": "Video Hareket Yakalama",
|
||||
"videoTitle": "Video Oluşturma",
|
||||
"videoW2l": "Video Dudak Senkronizasyonu"
|
||||
"videoW2l": "Video Dudak Senkronizasyonu",
|
||||
"videoWorkflow": "Video İş Akışı"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "İş Akışı Kontrollerine Devam Edin",
|
||||
"process": "İş Akışına Geçiş Süreci",
|
||||
"select": "Seçme",
|
||||
"upload": "Video yükle"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Video İş Akışı"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Medya arasından seçim yapın",
|
||||
"original": "Orijinal",
|
||||
"preview": "Ön izleme",
|
||||
"upload": "Yüklemek"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "khuôn mặt hoạt hình",
|
||||
"videoMotionCapture": "Quay video chuyển động",
|
||||
"videoTitle": "Tạo video",
|
||||
"videoW2l": "Hát nhép video"
|
||||
"videoW2l": "Hát nhép video",
|
||||
"videoWorkflow": "Quy trình làm việc video"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "Tiến tới Kiểm soát quy trình công việc",
|
||||
"process": "Quy trình đến quy trình làm việc",
|
||||
"select": "Lựa chọn",
|
||||
"upload": "Tải video lên"
|
||||
},
|
||||
"headings": {
|
||||
"title": "Quy trình làm việc video"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "Chọn từ phương tiện truyền thông",
|
||||
"original": "Nguyên bản",
|
||||
"preview": "Xem trước",
|
||||
"upload": "Tải lên"
|
||||
}
|
||||
}
|
||||
@@ -20,5 +20,6 @@
|
||||
"videoFaceAnimator": "脸部动画师",
|
||||
"videoMotionCapture": "视频动作捕捉",
|
||||
"videoTitle": "视频生成",
|
||||
"videoW2l": "视频唇形同步"
|
||||
"videoW2l": "视频唇形同步",
|
||||
"videoWorkflow": "视频工作流程"
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"button": {
|
||||
"proceed": "继续工作流程控制",
|
||||
"process": "流程到工作流程",
|
||||
"select": "选择",
|
||||
"upload": "上传视频"
|
||||
},
|
||||
"headings": {
|
||||
"title": "视频工作流程"
|
||||
},
|
||||
"tabTitle": {
|
||||
"library": "从媒体中选择",
|
||||
"original": "原来的",
|
||||
"preview": "预览",
|
||||
"upload": "上传"
|
||||
}
|
||||
}
|
||||
@@ -8,22 +8,23 @@ import { faTrash } from "@fortawesome/free-solid-svg-icons";
|
||||
import SelectMediaList from "./SelectMediaList";
|
||||
import SelectWeightsList from "./SelectWeightsList";
|
||||
|
||||
export type SelectModalData = {
|
||||
token: string;
|
||||
title: string;
|
||||
}
|
||||
interface TabConfig {
|
||||
label: string;
|
||||
tabKey: string;
|
||||
type: "media" | "weights";
|
||||
weightTypeFilter?: string;
|
||||
mediaTypeFilter?: string;
|
||||
typeFilter?: string;
|
||||
searcher?: boolean;
|
||||
}
|
||||
interface SelectModalProps {
|
||||
label?: string;
|
||||
tabs: TabConfig[];
|
||||
modalTitle?: string;
|
||||
onSelect?: (data:{
|
||||
token: string,
|
||||
title: string,
|
||||
}) => void;
|
||||
value?: SelectModalData;
|
||||
onSelect?: (data: SelectModalData) => void;
|
||||
required?: boolean;
|
||||
}
|
||||
|
||||
@@ -33,42 +34,44 @@ const SelectModal = memo(
|
||||
tabs,
|
||||
modalTitle = "Select",
|
||||
onSelect,
|
||||
value,
|
||||
required,
|
||||
}: SelectModalProps) => {
|
||||
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||
const initialValue = {token:"", title:""};
|
||||
const [selectedValue, setSelectedValue] = useState(initialValue);
|
||||
const [activeTab, setActiveTab] = useState(tabs[0].tabKey);
|
||||
const [mediaType, setMediaType] = useState(
|
||||
tabs[0].mediaTypeFilter || "all"
|
||||
);
|
||||
const [weightType, setWeightType] = useState(
|
||||
tabs[0].weightTypeFilter || "all"
|
||||
);
|
||||
console.log("🔫", tabs, activeTab, weightType);
|
||||
const emptyValue = {token:"", title:""};
|
||||
const [{isModalOpen, selectedValue, valueType, activeTab}, setState] = useState({
|
||||
isModalOpen:false,
|
||||
selectedValue: value ? value : emptyValue,
|
||||
activeTab: tabs[0].tabKey,
|
||||
valueType: tabs[0].typeFilter || "all"
|
||||
})
|
||||
console.log("🔫", tabs, activeTab, valueType);
|
||||
|
||||
// Update mediaType when activeTab changes
|
||||
useEffect(() => {
|
||||
const currentTab = tabs.find(tab => tab.tabKey === activeTab);
|
||||
setMediaType(currentTab?.mediaTypeFilter || "all");
|
||||
setWeightType(currentTab?.weightTypeFilter || "all");
|
||||
setState((curr)=>({...curr, valueType: currentTab?.typeFilter || "all"}))
|
||||
}, [activeTab, tabs]);
|
||||
|
||||
const openModal = () => {
|
||||
setIsModalOpen(true);
|
||||
setState((curr)=>({...curr, isModalOpen: true}));
|
||||
};
|
||||
|
||||
const closeModal = () => {
|
||||
setIsModalOpen(false);
|
||||
setState((curr)=>({...curr, isModalOpen: false}));
|
||||
};
|
||||
|
||||
const handleRemove = () => {
|
||||
setSelectedValue(initialValue);
|
||||
setState((curr)=>({...curr, selectedValue: emptyValue}));
|
||||
if (onSelect) onSelect(emptyValue);
|
||||
};
|
||||
|
||||
const handleOnSelect = (data:{token:string, title:string}) => {
|
||||
setSelectedValue({token: data.token, title: data.title || ""});
|
||||
setState((curr)=>({
|
||||
...curr,
|
||||
selectedValue: {token: data.token, title: data.title || ""},
|
||||
isModalOpen: false
|
||||
}));
|
||||
if (onSelect) onSelect(data);
|
||||
closeModal();
|
||||
}
|
||||
|
||||
const searchTabs = tabs.map(tab => ({
|
||||
@@ -78,20 +81,20 @@ console.log("🔫", tabs, activeTab, weightType);
|
||||
type="modal"
|
||||
onResultSelect={handleOnSelect}
|
||||
searcherKey={tab.tabKey}
|
||||
weightType={tab.weightTypeFilter}
|
||||
weightType={tab.typeFilter}
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
{tab.type === "media" && (
|
||||
<SelectMediaList
|
||||
mediaType={mediaType}
|
||||
mediaType={valueType}
|
||||
listKey={tab.tabKey}
|
||||
onResultSelect={handleOnSelect}
|
||||
/>
|
||||
)}
|
||||
{tab.type === "weights" && (
|
||||
<SelectWeightsList
|
||||
weightType={weightType}
|
||||
weightType={valueType}
|
||||
listKey={tab.tabKey}
|
||||
onResultSelect={handleOnSelect}
|
||||
/>
|
||||
@@ -99,7 +102,7 @@ console.log("🔫", tabs, activeTab, weightType);
|
||||
</>
|
||||
),
|
||||
padding: true,
|
||||
onClick: () => setActiveTab(tab.tabKey),
|
||||
onClick: () => setState((curr)=>({...curr, activeTab: tab.tabKey})),
|
||||
}));
|
||||
|
||||
return (
|
||||
@@ -111,15 +114,22 @@ console.log("🔫", tabs, activeTab, weightType);
|
||||
</label>
|
||||
)}
|
||||
|
||||
<div className="d-flex gap-2">
|
||||
<div className="d-flex gap-2 position-relative">
|
||||
<div
|
||||
className="position-absolute w-100 h-100"
|
||||
style={{"cursor": "pointer"}}
|
||||
onClick={openModal}
|
||||
/>
|
||||
<Input
|
||||
disabled={true}
|
||||
className="w-100"
|
||||
placeholder="None selected"
|
||||
onClick={openModal}
|
||||
value={selectedValue.title !==""
|
||||
? selectedValue.title
|
||||
: selectedValue.token || ""}
|
||||
/>
|
||||
|
||||
<Button label={selectedValue.token !== "" ? "Change" : "Select"} onClick={openModal} />
|
||||
{selectedValue.token && (
|
||||
<Button
|
||||
|
||||
+2
-2
@@ -21,7 +21,7 @@ export default function PageVideoMocapProgress({
|
||||
pageState: State;
|
||||
dispatchPageState: (action: Action) => void;
|
||||
}) {
|
||||
const { FILE_UPLOADING, FILE_UPLOADED, FILE_SELECTED, MOCAPNET_ENQUEUEING } = states;
|
||||
const { FILE_UPLOADING, FILE_UPLOADED, FILE_SELECTED_PROCEED, MOCAPNET_ENQUEUEING } = states;
|
||||
|
||||
const handleEnqueueMocapNet = () => {
|
||||
if (pageState.mediaFileToken) {
|
||||
@@ -43,7 +43,7 @@ export default function PageVideoMocapProgress({
|
||||
}
|
||||
};
|
||||
|
||||
if (pageState.status === FILE_SELECTED){
|
||||
if (pageState.status === FILE_SELECTED_PROCEED){
|
||||
handleEnqueueMocapNet();
|
||||
}
|
||||
|
||||
|
||||
+35
-24
@@ -1,5 +1,6 @@
|
||||
import SelectModal from "components/common/SelectModal/SelectModal";
|
||||
import React, { useState } from "react";
|
||||
import React from "react";
|
||||
|
||||
import SelectModal, {SelectModalData} from "components/common/SelectModal/SelectModal";
|
||||
import { Action, State } from "../videoMocapReducer";
|
||||
import { Button } from "components/common";
|
||||
|
||||
@@ -12,35 +13,45 @@ export default function TabContentLibrary({
|
||||
pageState: State;
|
||||
dispatchPageState: (action: Action) => void;
|
||||
}) {
|
||||
const [token, setToken] = useState<string | undefined>();
|
||||
|
||||
const handleProceed = () => {
|
||||
if (token)
|
||||
dispatchPageState({ type: "proceedSelectedFile" });
|
||||
};
|
||||
const handleOnSelect = (data:SelectModalData) => {
|
||||
if (data.token !==""){
|
||||
dispatchPageState({
|
||||
type: "selectedFile",
|
||||
payload: { mediaFileToken: token },
|
||||
payload: { mediaFileToken: data.token },
|
||||
});
|
||||
};
|
||||
const handleOnSelect = (data:{token:string,title:string}) => {
|
||||
setToken(data.token);
|
||||
}else{
|
||||
dispatchPageState({type: "clearedFile"});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<SelectModal
|
||||
modalTitle="Select a Video"
|
||||
label="Select a Video"
|
||||
onSelect={handleOnSelect}
|
||||
tabs={[
|
||||
{
|
||||
label: "All Videos",
|
||||
tabKey: "allVideos",
|
||||
mediaTypeFilter: "video",
|
||||
searcher: false,
|
||||
type: "media",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
{token && <Button label={t("button.proceed")} onClick={handleProceed} />}
|
||||
<div className="row g-3">
|
||||
<div className="col-12">
|
||||
<SelectModal
|
||||
modalTitle="Select a Video"
|
||||
label="Select a Video"
|
||||
onSelect={handleOnSelect}
|
||||
value={{token: pageState.mediaFileToken || "", title: ""}}
|
||||
tabs={[
|
||||
{
|
||||
label: "All Videos",
|
||||
tabKey: "allVideos",
|
||||
typeFilter: "video",
|
||||
searcher: false,
|
||||
type: "media",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
{pageState.mediaFileToken &&
|
||||
<div className="col-12 d-flex justify-content-center mt-5">
|
||||
<Button label={t("button.proceed")} onClick={handleProceed} />
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -13,7 +13,7 @@ export default function TabContentUpload({t, pageState, dispatchPageState}: {
|
||||
dispatchPageState: (action: Action) => void;
|
||||
}) {
|
||||
const videoProps = useFile({});
|
||||
const {NO_FILE, FILE_STAGED} = states;
|
||||
const {NO_FILE, FILE_STAGED, FILE_UPLOADING} = states;
|
||||
|
||||
|
||||
const makeVideoUploadRequest = () => ({
|
||||
@@ -38,7 +38,7 @@ export default function TabContentUpload({t, pageState, dispatchPageState}: {
|
||||
};
|
||||
|
||||
// contains upload inout state and controls, see docs
|
||||
if (pageState.status === NO_FILE || pageState.status === FILE_STAGED) {
|
||||
if (pageState.status < FILE_UPLOADING) {
|
||||
return (
|
||||
<>
|
||||
<div className="row">
|
||||
|
||||
@@ -1,10 +1,11 @@
|
||||
|
||||
export enum states{
|
||||
NO_FILE,
|
||||
FILE_SELECTED,
|
||||
FILE_SELECTED_PROCEED,
|
||||
FILE_STAGED,
|
||||
FILE_UPLOADING,
|
||||
FILE_UPLOADED,
|
||||
FILE_SELECTED,
|
||||
MOCAPNET_ENQUEUEING,
|
||||
MOCAPNET_ENQUEUED,
|
||||
}
|
||||
@@ -20,6 +21,7 @@ export type Action =
|
||||
| {type: 'stagedFile'}
|
||||
| {type: 'clearedFile'}
|
||||
| {type: 'selectedFile', payload:{ mediaFileToken: string}}
|
||||
| {type: 'proceedSelectedFile'}
|
||||
| {type: 'uploadFile'}
|
||||
| {type: 'uploadFileSuccess', payload:{ mediaFileToken: string}}
|
||||
| {type: 'enqueueMocapNet'}
|
||||
@@ -32,13 +34,19 @@ export function reducer (state: State, action: Action): State {
|
||||
case 'stagedFile':
|
||||
return {...state, status: states.FILE_STAGED}
|
||||
case 'clearedFile':
|
||||
return {...state, status: states.NO_FILE}
|
||||
return {
|
||||
...state,
|
||||
status: states.NO_FILE,
|
||||
mediaFileToken: undefined
|
||||
}
|
||||
case 'selectedFile':
|
||||
return {
|
||||
...state,
|
||||
status: states.FILE_SELECTED,
|
||||
mediaFileToken: action.payload.mediaFileToken
|
||||
}
|
||||
case 'proceedSelectedFile':
|
||||
return {...state, status: states.FILE_SELECTED_PROCEED }
|
||||
case 'uploadFile':
|
||||
return {...state,status: states.FILE_UPLOADING};
|
||||
case 'uploadFileSuccess':
|
||||
|
||||
@@ -18,7 +18,7 @@ export default function StorytellerFilter(props:{
|
||||
inferenceJobsByCategory: Map<FrontendInferenceJobType, Array<InferenceJob>>;
|
||||
}){
|
||||
const debug=true;
|
||||
const {t} = useLocalize("StorytellerFilter");
|
||||
const {t} = useLocalize("VideoWorkflow");
|
||||
const { NO_FILE } = states;
|
||||
const [pageState, dispatchPageState] = useReducer(reducer, {
|
||||
status: NO_FILE,
|
||||
|
||||
+4
-4
@@ -163,14 +163,14 @@ export default function PageFilterControls({
|
||||
{
|
||||
label: "All Weights",
|
||||
tabKey: "allWeights",
|
||||
weightTypeFilter: "sd_1.5",
|
||||
typeFilter: "sd_1.5",
|
||||
searcher: true,
|
||||
type: "weights",
|
||||
},
|
||||
{
|
||||
label: "Bookmarked",
|
||||
tabKey: "bookmarkedWeights",
|
||||
weightTypeFilter: "sd_1.5",
|
||||
typeFilter: "sd_1.5",
|
||||
searcher: false,
|
||||
type: "weights",
|
||||
},
|
||||
@@ -189,14 +189,14 @@ export default function PageFilterControls({
|
||||
{
|
||||
label: "All LoRA Weights",
|
||||
tabKey: "allLoraWeights",
|
||||
weightTypeFilter: "rvc_v2",
|
||||
typeFilter: "rvc_v2",
|
||||
searcher: true,
|
||||
type: "weights",
|
||||
},
|
||||
{
|
||||
label: "Bookmarked",
|
||||
tabKey: "bookmarkedLoraWeights",
|
||||
weightTypeFilter: "rvc_v2",
|
||||
typeFilter: "rvc_v2",
|
||||
searcher: false,
|
||||
type: "weights",
|
||||
},
|
||||
|
||||
+26
-20
@@ -2,7 +2,7 @@ import React from "react";
|
||||
import { NavLink } from "react-router-dom";
|
||||
import { states, Action, State } from "../videoWorkflowReducer";
|
||||
import { Button } from "components/common";
|
||||
import SelectModal from "components/common/SelectModal/SelectModal";
|
||||
import SelectModal, { SelectModalData } from "components/common/SelectModal/SelectModal";
|
||||
|
||||
export default function TabContentLibrary({
|
||||
t, pageState, dispatchPageState
|
||||
@@ -14,29 +14,35 @@ export default function TabContentLibrary({
|
||||
const handleProceed = ()=>{
|
||||
dispatchPageState({type: "loadFile"})
|
||||
}
|
||||
const handleOnSelect = (data:{token:string, title:string})=>{
|
||||
dispatchPageState({
|
||||
type: "selectedFile",
|
||||
payload: {mediaFileToken: data.token}
|
||||
});
|
||||
const handleOnSelect = (data:SelectModalData)=>{
|
||||
if (data.token !== ""){
|
||||
dispatchPageState({
|
||||
type: "selectedFile",
|
||||
payload: {mediaFileToken: data.token}
|
||||
});
|
||||
}else{
|
||||
dispatchPageState({type: "clearedFile"});
|
||||
};
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="row g-3">
|
||||
<div className="col-12">
|
||||
<SelectModal
|
||||
modalTitle="Select a Video"
|
||||
label="Select a Video"
|
||||
onSelect={handleOnSelect}
|
||||
tabs={[
|
||||
{
|
||||
label: "All Videos",
|
||||
tabKey: "allVideos",
|
||||
mediaTypeFilter: "video",
|
||||
searcher: false,
|
||||
type: "media",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<SelectModal
|
||||
modalTitle="Select a Video"
|
||||
label="Select a Video"
|
||||
onSelect={handleOnSelect}
|
||||
value={{token: pageState.mediaFileToken || "", title: ""}}
|
||||
tabs={[
|
||||
{
|
||||
label: "All Videos",
|
||||
tabKey: "allVideos",
|
||||
typeFilter: "video",
|
||||
searcher: false,
|
||||
type: "media",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
{pageState.status === states.FILE_SELECTED &&
|
||||
<div className="col-12 d-flex justify-content-center mt-5">
|
||||
|
||||
+5
-2
@@ -16,7 +16,7 @@ export default function TabContentUpload({
|
||||
dispatchPageState: (action: Action) => void;
|
||||
}) {
|
||||
const videoProps = useFile({});
|
||||
const {NO_FILE, FILE_STAGED, FILE_UPLOADING, FILE_UPLOADED} = states;
|
||||
const {NO_FILE, FILE_STAGED, FILE_SELECTED, FILE_UPLOADING, FILE_UPLOADED} = states;
|
||||
|
||||
const makeVideoUploadRequest = () => ({
|
||||
uuid_idempotency_token: uuidv4(),
|
||||
@@ -40,7 +40,10 @@ export default function TabContentUpload({
|
||||
};
|
||||
|
||||
// contains upload inout state and controls, see docs
|
||||
if (pageState.status === NO_FILE || pageState.status === FILE_STAGED) {
|
||||
if (pageState.status === NO_FILE
|
||||
|| pageState.status === FILE_STAGED
|
||||
|| pageState.status === FILE_SELECTED
|
||||
) {
|
||||
return (
|
||||
<>
|
||||
<div className="row">
|
||||
|
||||
@@ -299,14 +299,14 @@ function SdInferencePanel({
|
||||
{
|
||||
label: "All Weights",
|
||||
tabKey: "allWeights",
|
||||
weightTypeFilter: "sd_1.5",
|
||||
typeFilter: "sd_1.5",
|
||||
searcher: true,
|
||||
type: "weights",
|
||||
},
|
||||
{
|
||||
label: "Bookmarked",
|
||||
tabKey: "bookmarkedWeights",
|
||||
weightTypeFilter: "sd_1.5",
|
||||
typeFilter: "sd_1.5",
|
||||
searcher: false,
|
||||
type: "weights",
|
||||
},
|
||||
@@ -409,14 +409,14 @@ function SdInferencePanel({
|
||||
{
|
||||
label: "All LoRA Weights",
|
||||
tabKey: "allLoraWeights",
|
||||
weightTypeFilter: "rvc_v2",
|
||||
typeFilter: "rvc_v2",
|
||||
searcher: true,
|
||||
type: "weights",
|
||||
},
|
||||
{
|
||||
label: "Bookmarked",
|
||||
tabKey: "bookmarkedLoraWeights",
|
||||
weightTypeFilter: "rvc_v2",
|
||||
typeFilter: "rvc_v2",
|
||||
searcher: false,
|
||||
type: "weights",
|
||||
},
|
||||
|
||||
Reference in new issue
Block a user