diff --git a/packages/fakeyou.com/public/images/landing/onboarding/room-scene-thumbnail.webp b/packages/fakeyou.com/public/images/landing/onboarding/room-scene-thumbnail.webp new file mode 100644 index 0000000000..7c2f9f44b5 Binary files /dev/null and b/packages/fakeyou.com/public/images/landing/onboarding/room-scene-thumbnail.webp differ diff --git a/packages/fakeyou.com/public/images/landing/onboarding/styles/style-2d-anime.webp b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-2d-anime.webp new file mode 100644 index 0000000000..ee7117b0fc Binary files /dev/null and b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-2d-anime.webp differ diff --git a/packages/fakeyou.com/public/images/landing/onboarding/styles/style-3d-cartoon.webp b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-3d-cartoon.webp new file mode 100644 index 0000000000..823a8dc322 Binary files /dev/null and b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-3d-cartoon.webp differ diff --git a/packages/fakeyou.com/public/images/landing/onboarding/styles/style-ink-bw.webp b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-ink-bw.webp new file mode 100644 index 0000000000..1ddc373609 Binary files /dev/null and b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-ink-bw.webp differ diff --git a/packages/fakeyou.com/public/images/landing/onboarding/styles/style-origami.webp b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-origami.webp new file mode 100644 index 0000000000..edc2050967 Binary files /dev/null and b/packages/fakeyou.com/public/images/landing/onboarding/styles/style-origami.webp differ diff --git a/packages/fakeyou.com/public/videos/landing/vst/1-original.jpg b/packages/fakeyou.com/public/videos/landing/vst/1-original.jpg new file mode 100644 index 0000000000..30486e43b9 Binary files /dev/null and b/packages/fakeyou.com/public/videos/landing/vst/1-original.jpg differ diff --git a/packages/fakeyou.com/public/videos/landing/vst/2-original.jpg b/packages/fakeyou.com/public/videos/landing/vst/2-original.jpg new file mode 100644 index 0000000000..354b0b04d1 Binary files /dev/null and b/packages/fakeyou.com/public/videos/landing/vst/2-original.jpg differ diff --git a/packages/fakeyou.com/src/components/common/Scene3D/Scene3D.tsx b/packages/fakeyou.com/src/components/common/Scene3D/Scene3D.tsx index 1cc71914df..520f518c40 100644 --- a/packages/fakeyou.com/src/components/common/Scene3D/Scene3D.tsx +++ b/packages/fakeyou.com/src/components/common/Scene3D/Scene3D.tsx @@ -26,6 +26,12 @@ interface Scene3DProps { // CSS classes to apply to the engine className?: string; + // Callback when the scene is first loaded + // Not always 100% true. Sometimes it prematurely fires. + onSceneReadyCallback?: () => void; + + // Callback called when the scene is saved. + // It will receive the argument of the new scene media token. onSceneSavedCallback?: (mediaToken: string) => void; } @@ -35,6 +41,7 @@ export default function Scene3D({ skybox, fullScreen = false, className, + onSceneReadyCallback, onSceneSavedCallback, }: Scene3DProps) { @@ -54,6 +61,10 @@ export default function Scene3D({ console.log("studio-ready message (2)"); + if (onSceneReadyCallback !== undefined) { + onSceneReadyCallback(); + } + // NB: Example of how to call the API in the other direction: // studio.postMessage("save-scene", engineBaseUrl); } else if ( @@ -70,7 +81,7 @@ export default function Scene3D({ } else if (event.data === "scene-save-failed") { console.error("Failed to save the scene!"); } - }, [onSceneSavedCallback]); + }, [onSceneReadyCallback, onSceneSavedCallback]); useEffect(() => { diff --git a/packages/fakeyou.com/src/components/common/SelectionBubblesV2/SelectionBubblesV2.scss b/packages/fakeyou.com/src/components/common/SelectionBubblesV2/SelectionBubblesV2.scss index f5c1fbdeeb..aa3af4de85 100644 --- a/packages/fakeyou.com/src/components/common/SelectionBubblesV2/SelectionBubblesV2.scss +++ b/packages/fakeyou.com/src/components/common/SelectionBubblesV2/SelectionBubblesV2.scss @@ -129,6 +129,7 @@ bottom: 0; left: 0; font-size: 14px; + text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5); } &::after { @@ -140,14 +141,12 @@ height: 50%; background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent); z-index: 2; + height: 35%; } &.selected::after { - background: linear-gradient( - to top, - rgba(desaturate(darken($primary, 20%), 30%), 70%), - transparent - ); + background: linear-gradient(to top, rgba(#632323, 90%), transparent); + height: 35%; } } diff --git a/packages/fakeyou.com/src/components/common/VideoQuickTrim/VideoQuickTrim.tsx b/packages/fakeyou.com/src/components/common/VideoQuickTrim/VideoQuickTrim.tsx index d87185d6d0..84a796e2ad 100644 --- a/packages/fakeyou.com/src/components/common/VideoQuickTrim/VideoQuickTrim.tsx +++ b/packages/fakeyou.com/src/components/common/VideoQuickTrim/VideoQuickTrim.tsx @@ -118,18 +118,19 @@ export const VideoQuickTrim = memo(({ ]); //END videoRefCallback\ useEffect(()=>{ - if( compState.trimStartSeconds - && compState.trimEndSeconds + if( compState.trimStartSeconds !== undefined + && compState.trimEndSeconds !== undefined && ( compState.trimStartSeconds !== propsTrimStartSeconds || compState.trimEndSeconds !== propsTrimEndSeconds ) ){ - onSelect({ - trimStartSeconds: compState.trimStartSeconds, - trimEndSeconds: compState.trimEndSeconds, - }); - } + console.log(`TRIM on useEFFECT: calling onSELECT`); + onSelect({ + trimStartSeconds: compState.trimStartSeconds, + trimEndSeconds: compState.trimEndSeconds, + }); + } }, [onSelect, compState.trimStartSeconds, compState.trimEndSeconds, propsTrimStartSeconds, propsTrimEndSeconds]) function videoCanPlay(){ diff --git a/packages/fakeyou.com/src/v2/view/pages/landing/LandingPage.tsx b/packages/fakeyou.com/src/v2/view/pages/landing/LandingPage.tsx index eafc84f8f3..037f31a146 100644 --- a/packages/fakeyou.com/src/v2/view/pages/landing/LandingPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/landing/LandingPage.tsx @@ -43,6 +43,8 @@ function LandingPage(props: Props) { const isLoggedIn = props.sessionWrapper.isLoggedIn(); + const canAccessStudio = props.sessionWrapper.canAccessStudio(); + return ( <> {domain.website === Website.StorytellerAi && !isLoggedIn && ( @@ -79,7 +81,7 @@ function LandingPage(props: Props) { {/* STORYTELLER,AI */} {!isLoggedIn ? ( <> - + {!canAccessStudio && } (null); const [activeIndex, setActiveIndex] = useState(0); - const [isPlaying, setIsPlaying] = useState(true); + // const [isPlaying, setIsPlaying] = useState(true); // const togglePlayback = () => { // setIsPlaying(!isPlaying); // }; - const handleVideoPlay = () => { - if (!isPlaying) { - setIsPlaying(true); - } - }; + // const handleVideoPlay = () => { + // if (!isPlaying) { + // setIsPlaying(true); + // } + // }; - const handleVideoPause = () => { - if (isPlaying) { - setIsPlaying(false); - } - }; + // const handleVideoPause = () => { + // if (isPlaying) { + // setIsPlaying(false); + // } + // }; - const videoRef = useRef(null); + // const videoRef = useRef(null); - useEffect(() => { - if (videoRef.current) { - if (isPlaying) { - videoRef.current.play(); - } else { - videoRef.current.pause(); - } - } - }, [isPlaying]); + // useEffect(() => { + // if (videoRef.current) { + // if (isPlaying) { + // videoRef.current.play(); + // } else { + // videoRef.current.pause(); + // } + // } + // }, [isPlaying]); const videoSet = [ { src: "/videos/landing/vst/1-original.mp4", + thumbnail: "/videos/landing/vst/1-original.jpg", styledVideos: [ { src: "/videos/landing/vst/1-2d_flat_anime.mp4", @@ -80,6 +81,7 @@ export default function VstSectionV2(props: VstSectionV2Props) { }, { src: "/videos/landing/vst/2-original.mp4", + thumbnail: "/videos/landing/vst/2-original.jpg", styledVideos: [ { src: "/videos/landing/vst/2-2d_flat_anime.mp4", @@ -157,16 +159,17 @@ export default function VstSectionV2(props: VstSectionV2Props) { muted playsInline controls={false} + preload="auto" key={`${index}-${activeIndex}`} - onPlay={handleVideoPlay} - onPause={handleVideoPause} - ref={videoRef => { - if (videoRef && isPlaying) { - videoRef.play(); - } else if (videoRef) { - videoRef.pause(); - } - }} + // onPlay={handleVideoPlay} + // onPause={handleVideoPause} + // ref={videoRef => { + // if (videoRef && isPlaying) { + // videoRef.play(); + // } else if (videoRef) { + // videoRef.pause(); + // } + // }} > Your browser does not support the video tag. @@ -186,10 +189,10 @@ export default function VstSectionV2(props: VstSectionV2Props) { {videoSet.map((video, index) => ( - - - Your browser does not support the video tag. - + ))} @@ -218,16 +221,17 @@ export default function VstSectionV2(props: VstSectionV2Props) { muted playsInline controls={false} + preload="auto" key={styledVideo.src} - onPlay={handleVideoPlay} - onPause={handleVideoPause} - ref={videoRef => { - if (videoRef && isPlaying) { - videoRef.play(); - } else if (videoRef) { - videoRef.pause(); - } - }} + // onPlay={handleVideoPlay} + // onPause={handleVideoPause} + // ref={videoRef => { + // if (videoRef && isPlaying) { + // videoRef.play(); + // } else if (videoRef) { + // videoRef.pause(); + // } + // }} > Your browser does not support the video tag. diff --git a/packages/fakeyou.com/src/v2/view/pages/landing/storyteller/OnboardingSelection/OnboardingSelection.tsx b/packages/fakeyou.com/src/v2/view/pages/landing/storyteller/OnboardingSelection/OnboardingSelection.tsx index 7620cc1ded..dfa84bb460 100644 --- a/packages/fakeyou.com/src/v2/view/pages/landing/storyteller/OnboardingSelection/OnboardingSelection.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/landing/storyteller/OnboardingSelection/OnboardingSelection.tsx @@ -10,31 +10,31 @@ export default function OnboardingSelection(props: OnboardingSelectionProps) { const cards = [ { - text: "Scene 1", - backgroundImage: "", + text: "Room Scene", + backgroundImage: "/images/landing/onboarding/room-scene-thumbnail.webp", onClick: () => { - history.push("/studio-intro/"); + history.push("/studio-intro/m_ejhs95fc5aybp36h4a79k7523ds6an"); }, }, { text: "Scene 2", backgroundImage: "", onClick: () => { - history.push("/studio-intro/"); + history.push("/studio-intro"); }, }, { text: "Scene 3", backgroundImage: "", onClick: () => { - history.push("/studio-intro/"); + history.push("/studio-intro"); }, }, { text: "Scene 4", backgroundImage: "", onClick: () => { - history.push("/studio-intro/"); + history.push("/studio-intro"); }, }, ]; diff --git a/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioIntroPage.tsx b/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioIntroPage.tsx index 360a8360c9..de7662cf56 100644 --- a/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioIntroPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioIntroPage.tsx @@ -19,7 +19,6 @@ interface Props { } function StudioIntroPage(props: Props) { - const [camera,cameraSet] = useState("rotation"); const { mediaToken } = useParams<{ mediaToken: string }>(); const history = useHistory(); @@ -32,11 +31,28 @@ function StudioIntroPage(props: Props) { // for subsequent steps of this flow. const [savedMediaToken, setSavedMediaToken] = useState(mediaToken); + // We don't show the "next step" buttons until the engine loads. + // Unfortunately the engine sometimes fires this twice, with one instance + // being called before the scene loads. Until this is fixed, we'll count the + // number of event fires and assume we must have two calls. + const [sceneIsLoadedCount, sceneIsLoadedCountSet] = useState(0); + + // If the scene is saved, we know the user must have interacted. + // This can serve as a second optional gate for enabling the next steps. + const [sceneIsSaved, sceneIsSavedSet] = useState(false); + + const [camera, cameraSet] = useState("rotation"); + usePrefixedDocumentTitle("Storyteller Studio"); const onSaveCallback = useCallback((sceneMediaToken: string) => { setSavedMediaToken(sceneMediaToken); - }, [setSavedMediaToken]); + sceneIsSavedSet(true); // Just in case we missed the "scene loaded" event. + }, [setSavedMediaToken, sceneIsSavedSet]); + + const onSceneReadyCallback = useCallback(() => { + sceneIsLoadedCountSet(sceneIsLoadedCount + 1); + }, [sceneIsLoadedCount, sceneIsLoadedCountSet]) if (!props.sessionWrapper.canAccessStudio()) { return ; @@ -84,6 +100,30 @@ function StudioIntroPage(props: Props) { value: "static" }]; + const sceneIsLoaded = sceneIsLoadedCount > 1 || sceneIsSaved; + + let progressButtons = <>>; + + if (sceneIsLoaded) { + progressButtons = ( + <> + + + + Add camera motion to render + + + + { + cameraSet(target.value) + }, options: cameraOpts, value: camera }}/> + + + + > + ) + } + return ( - - - - Add camera motion to render - - - - { - cameraSet(target.value) - }, options: cameraOpts, value: camera }}/> - - - + + {progressButtons} ); } diff --git a/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioVST/StudioVSTPage.tsx b/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioVST/StudioVSTPage.tsx index 88f65b8da2..7a87fb65b2 100644 --- a/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioVST/StudioVSTPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/storyteller_studio_intro/StudioVST/StudioVSTPage.tsx @@ -75,23 +75,23 @@ export default function PageVSTApp() { const styleOptions = [ { - label: "Anime", - imageUrl: "/images/dummy-image.jpg", + label: "2D Anime", + imageUrl: "/images/landing/onboarding/styles/style-2d-anime.webp", token: "weight_yqexh77ntqyawzgh9fzash798", }, { - label: "Pixel", - imageUrl: "/images/dummy-image-2.jpg", + label: "3D Cartoon", + imageUrl: "/images/landing/onboarding/styles/style-3d-cartoon.webp", token: "weight_yqexh77ntqyawzgh9fzash798", }, { - label: "Painting", - imageUrl: "/images/dummy-image-3.jpg", + label: "Ink B&W", + imageUrl: "/images/landing/onboarding/styles/style-ink-bw.webp", token: "weight_yqexh77ntqyawzgh9fzash798", }, { - label: "Ink", - imageUrl: "/images/dummy-image-4.jpg", + label: "Origami", + imageUrl: "/images/landing/onboarding/styles/style-origami.webp", token: "weight_yqexh77ntqyawzgh9fzash798", }, ]; diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/commons.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/commons.tsx index 9871ebb1b1..9ba40a317e 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/commons.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/commons.tsx @@ -18,6 +18,7 @@ export function TableOfKeyValues( title: string; keyValues:{ [key:string]:number|string|boolean|undefined + |{ [key:string]:number|string} }; height?: number | string }){ @@ -33,7 +34,9 @@ export function TableOfKeyValues( {title} { Object.entries(keyValues).map(([key, val], index: number)=>{ - return {`${key}`}{`${val}`} + if(key!=="defaultCN" && key!=="defaultPrompts") + return {`${key}`}{`${val}`} + else return null }) } ); diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compAdvanceOptions.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compAdvanceOptions.tsx index 3948bb95ac..ae03d04b94 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compAdvanceOptions.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compAdvanceOptions.tsx @@ -25,18 +25,20 @@ import { fullbodyPreset, landscapePreset, typogPreset, - defaultPreset, + // defaultPreset, } from "./dataCnPresets"; export default function CompAdvanceOptions({ - debug, + debug: propsDebug = false, t, vstValues: vstVal, onChange: handleOnChange, + currDefaultCN: defaultPreset }: { debug?: boolean; t: Function; vstValues: VSTType; + currDefaultCN: {[key: string]: number}; onChange: (val: { [key: string]: number | string | boolean | undefined; }) => void; diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compStyleModal.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compStyleModal.tsx index 9524a8273b..f7870a308b 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compStyleModal.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/compStyleModal.tsx @@ -8,6 +8,7 @@ import { SelectModalV2 } from "components/common/SelectModal"; import { WeightCategory } from "@storyteller/components/src/api/_common/enums/WeightCategory"; import styleModels from './dataStyleModels'; +import { defaultPreset as noStyleCNPreset } from './dataCnPresets'; export default function CompStyleModal({ debug, @@ -19,7 +20,8 @@ export default function CompStyleModal({ t: Function; value: string; onChange: (val: { - [key: string]: number | string | boolean | undefined; + [key: string]: number | string | boolean | undefined + | {[key: string]: number | string }; }) => void; }){ const gridContainerRef = useRef(null); @@ -34,6 +36,18 @@ export default function CompStyleModal({ onClear={()=>onChange({ sdModelToken: "", sdModelTitle: "", + defaultCN: noStyleCNPreset, + defaultPrompts:{ + positivePrompt:"", + negativePrompt:"", + positivePromptHidden:"", + negativePromptHidden:"", + }, + ...noStyleCNPreset, + positivePrompt:"", + negativePrompt:"", + positivePromptHidden:"", + negativePromptHidden:"", })} > { - onChange({ - sdModelToken:data.token, - sdModelTitle: data.title, - }) - setOnSelectTimeStamp(new Date()); + const selectedStyle = styleModels.find( + (styleItem)=>styleItem.weight_token = data.token + ); + if(selectedStyle!==undefined){ + onChange({ + sdModelToken:data.token, + sdModelTitle: data.title, + defaultCN: selectedStyle.defaultCN, + defaultPrompts: selectedStyle.defaultPrompts, + ...selectedStyle.defaultCN, + ...selectedStyle.defaultPrompts + }); + setOnSelectTimeStamp(new Date()); + } } }; //console.log(data); diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataCnPresets.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataCnPresets.tsx index 5e6a3dcb15..2482908761 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataCnPresets.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataCnPresets.tsx @@ -10,13 +10,13 @@ type CNPreset = const defaultPreset = { cnCanny: 0, cnDepth: 0, - cnLineArtAnime: 0.7, + cnLineArtAnime: 0, cnLineArtRealistic: 0, cnLipsStrength: 0, - cnOpenPose: 1, + cnOpenPose: 0, cnPipeFace: 0, cnSparseScribble: 0, - cnSoftEdge: 1, + cnSoftEdge: 0, cnRegularSteps: 20, } diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataDefaultValues.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataDefaultValues.tsx index 7273dc7976..cfa41317ce 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataDefaultValues.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataDefaultValues.tsx @@ -1,7 +1,9 @@ -import { defaultPreset as defaultCN } from "./dataCnPresets"; +// import { defaultPreset as defaultCN } from "./dataCnPresets"; import styleModels from "./dataStyleModels"; +import { VSTType } from "./helpers"; export {initialValues, hiddenValues}; -const initialValues = { + +const initialValues: VSTType = { //files Settings fileToken: "", outputPath: "vid2vid/SparseUpscaleInterp_00001.mp4", @@ -17,17 +19,33 @@ const initialValues = { workflowConfig: "weight_0a04e66y14t4e2bwxjfyg1mb2", sdModelToken: styleModels[0].weight_token, sdModelTitle: styleModels[0].title, - loraModelToken: "", - loraModelStrength: 0, + // loraModelToken: "", + // loraModelStrength: 0, //basics inputFps: 24, - posPrompt: "perfect anime illustration,(best-quality:0.8),", - negPrompt: "", + ...styleModels[0].defaultPrompts, + // positivePrompt:"", + // negativePrompt:"", + // positivePromptHidden:"", + // negativePromptHidden:"", visibility: "private", //Control Net - ...defaultCN + ...styleModels[0].defaultCN, + // cnCanny: 0, + // cnDepth: 0, + // cnLineArtAnime: 0, + // cnLineArtRealistic: 0, + // cnLipsStrength: 0, + // cnOpenPose: 0, + // cnPipeFace: 0, + // cnSparseScribble: 0, + // cnSoftEdge: 0, + // cnRegularSteps: 0, + + defaultCN:styleModels[0].defaultCN, + defaultPrompts:styleModels[0].defaultPrompts, }; const hiddenValues = { diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataStyleModels.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataStyleModels.tsx index 74915b39bd..31446ab284 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataStyleModels.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/dataStyleModels.tsx @@ -33,7 +33,25 @@ const styleModels = [ "bookmark_count": 1 }, "created_at": "2024-02-28T21:00:43Z", - "updated_at": "2024-02-28T21:00:43Z" + "updated_at": "2024-02-28T21:00:43Z", + defaultCN:{ + cnCanny: 0, + cnDepth: 0, + cnLineArtAnime: 0.7, + cnLineArtRealistic: 0, + cnLipsStrength: 0, + cnOpenPose: 1, + cnPipeFace: 0, + cnSparseScribble: 0, + cnSoftEdge: 1, + cnRegularSteps: 20, + }, + defaultPrompts:{ + positivePrompt:"perfect anime illustration,(best-quality:0.8),", + negativePrompt:"", + positivePromptHidden:"", + negativePromptHidden:"flare, lens flare, glare,naked, nsfw, text, logo, watermark:1.3, letterboxed,embedding:easynegative, embedding:badhandv4,(worst quality, low quality:1.4), lowres, blurry, monochrome, ", + } }, // { // "weight_token": "weight_vbz0wq7wkv80casj3vfptrrpg", diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/helpers.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/helpers.tsx index cc0681c64d..a063dbe6b0 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/helpers.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/helpers.tsx @@ -1,5 +1,4 @@ import { v4 as uuidv4 } from "uuid"; -import { hiddenValues } from "./dataDefaultValues"; export type VSTType = { // File Settings @@ -21,8 +20,10 @@ export type VSTType = { //basics inputFps: number; - posPrompt: string; - negPrompt: string; + positivePrompt: string; + negativePrompt: string; + positivePromptHidden:string, + negativePromptHidden:string, visibility: string; //advance @@ -36,6 +37,25 @@ export type VSTType = { cnSparseScribble: number; cnSoftEdge: number; cnRegularSteps: number + + defaultCN: { + cnCanny: number; + cnDepth: number; + cnLineArtAnime: number; + cnLineArtRealistic: number; + cnLipsStrength: number; + cnOpenPose: number; + cnPipeFace: number; + cnSparseScribble: number; + cnSoftEdge: number; + cnRegularSteps: number + }, + defaultPrompts:{ + positivePrompt:string, + negativePrompt:string, + positivePromptHidden:string, + negativePromptHidden:string, + } } export function isInputValid(keyValues: {[key:string]:number|string|boolean|undefined}){ @@ -61,9 +81,9 @@ export function mapRequest(vstValues: VSTType){ "maybe_json_modifications": { "$.154.inputs.Value": vstValues.inputFps, "$.510.inputs.Text": - hiddenValues.posPrompt + vstValues.posPrompt, + vstValues.positivePromptHidden + vstValues.positivePrompt, "$.8.inputs.text": - hiddenValues.negPrompt+ vstValues.negPrompt, + vstValues.negativePromptHidden+ vstValues.negativePrompt, "$.401.inputs.Value": 0.7, //Denoise First Pass "$.140.inputs.Value": 1, // Every nth frame diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/pageVSTApp.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/pageVSTApp.tsx index 3d081a2290..0c42975b65 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/pageVSTApp.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/components/pageVSTApp/pageVSTApp.tsx @@ -38,7 +38,13 @@ export default function PageVSTApp({ }); const handleOnChange = (val: { - [key: string]: number | string | boolean | undefined; + [key: string]: + number | + string | + boolean | + undefined | + {[key: string]: number | string} + ; }) => { setVstValues(curr => ({ ...curr, ...val })); }; @@ -73,12 +79,12 @@ export default function PageVSTApp({ trimStartSeconds={vstValues.trimStart} trimEndSeconds={vstValues.trimEnd} mediaToken={vstValues.fileToken} - onSelect={(val: QuickTrimData) => + onSelect={(val: QuickTrimData) =>{ handleOnChange({ trimStart: val.trimStartSeconds, trimEnd: val.trimEndSeconds, }) - } + }} onResponse={res => { dispatchPageState({ type: "loadFileSuccess", @@ -97,7 +103,7 @@ export default function PageVSTApp({ placeholder: t("input.placeholder.prompt"), onChange: (e: React.ChangeEvent) => handleOnChange({ posPrompt: e.target.value }), - value: vstValues.posPrompt, + value: vstValues.positivePrompt, required: false, }} /> @@ -107,7 +113,7 @@ export default function PageVSTApp({ placeholder: t("input.placeholder.negPrompt"), onChange: (e: React.ChangeEvent) => handleOnChange({ negPrompt: e.target.value }), - value: vstValues.negPrompt, + value: vstValues.negativePrompt, required: false, }} /> @@ -121,6 +127,7 @@ export default function PageVSTApp({ diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/reducer.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/reducer.tsx index 85a65a297f..f5d4d5bccf 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/reducer.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/reducer.tsx @@ -82,6 +82,5 @@ export function reducer (state: State, action: Action): State { case 'reset': default: return {status: states.NO_FILE}; - } } \ No newline at end of file