diff --git a/packages/components/src/api/enums/MediaFileClass.ts b/packages/components/src/api/enums/MediaFileClass.ts new file mode 100644 index 0000000000..69d222b55e --- /dev/null +++ b/packages/components/src/api/enums/MediaFileClass.ts @@ -0,0 +1,27 @@ + +export enum MediaFileClass { + /// Unknown (default value) + /// This will be present until we migrate all old files. + Unknown = "unknown", + + /// Audio files: wav, mp3, etc. + Audio = "audio", + + /// Image files: png, jpeg, etc. + Image = "image", + + /// Video files: mp4, etc. + Video = "video", + + /// Engine "animations" + Animation = "animation", + + /// Engine "characters" + Character = "character", + + /// Engine "prop" items + Prop = "prop", + + /// Engine scenes (internal and external scenes) + Scene = "scene", +} diff --git a/packages/fakeyou.com/src/hooks/useMediaUploader/useMediaUploader.tsx b/packages/fakeyou.com/src/hooks/useMediaUploader/useMediaUploader.tsx index 9ff5407cca..d33c224485 100644 --- a/packages/fakeyou.com/src/hooks/useMediaUploader/useMediaUploader.tsx +++ b/packages/fakeyou.com/src/hooks/useMediaUploader/useMediaUploader.tsx @@ -6,6 +6,7 @@ import { UploadMedia } from "@storyteller/components/src/api/media_files/UploadM import { UploadEngineAsset }from "@storyteller/components/src/api/media_files/UploadEngineAsset"; import { MediaFileSubtype } from "@storyteller/components/src/api/enums/MediaFileSubtype"; import { GetFileTypeByExtension as extension } from "@storyteller/components/src/utils/GetFileTypeByExtension"; +import { MediaFileClass } from "@storyteller/components/src/api/enums/MediaFileClass"; interface Props { autoUpload?: boolean, @@ -15,13 +16,14 @@ interface Props { const n = () => {}; export default function useMediaUploader({ autoUpload, onSuccess = n }: Props) { + const [mediaClass,mediaClassSet] = useState(MediaFileClass.Unknown); const [engineSubtype,engineSubtypeSet] = useState(); const createUpload = (inputFile: File, todo = n ) => { const fileExtension = extension(inputFile.name || ""); const isEngineAsset = isSelectedType(MediaFilters.engine_asset, fileExtension); const baseConfig = { uuid_idempotency_token: uuidv4(), file: inputFile }; - const engineConfig = { ...baseConfig, media_file_subtype: engineSubtype }; + const engineConfig = { ...baseConfig, media_file_subtype: engineSubtype, media_file_class: mediaClass }; const mediaConfig = { ...baseConfig, source: "file" }; const uploader = isEngineAsset ? UploadEngineAsset(engineConfig) : UploadMedia(mediaConfig); @@ -44,10 +46,14 @@ export default function useMediaUploader({ autoUpload, onSuccess = n }: Props) { const engineSubtypeChange = ({ target }: { target: any }) => engineSubtypeSet(target.value); + const mediaClassChange = ({ target }: { target: any }) => mediaClassSet(target.value); + return { clear, engineSubtype, engineSubtypeChange, + mediaClass, + mediaClassChange, file, inputProps, isAudio: isSelectedType(MediaFilters.audio, extension(file?.name || "")), diff --git a/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevUpload.tsx b/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevUpload.tsx index 22f65fd5f5..cfbc9a4168 100644 --- a/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevUpload.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevUpload.tsx @@ -5,13 +5,14 @@ import { Button, Container, Panel } from "components/common"; import { UploaderResponse } from "components/entities/EntityTypes"; import { faUpload } from "@fortawesome/pro-solid-svg-icons"; import { MediaFileSubtype } from "@storyteller/components/src/api/enums/MediaFileSubtype"; +import { MediaFileClass } from "@storyteller/components/src/api/enums/MediaFileClass"; import { Link } from "react-router-dom"; interface DevUploadProps {} export default function DevUpload(props: DevUploadProps) { const [tokens, tokensSet] = useState([]); - const { engineSubtype, engineSubtypeChange, file, inputProps, isEngineAsset, isVideo, upload } = useMediaUploader({ + const { engineSubtype, engineSubtypeChange, mediaClass, mediaClassChange, file, inputProps, isEngineAsset, isVideo, upload } = useMediaUploader({ onSuccess: (res: UploaderResponse) => tokensSet([res.media_file_token, ...tokens]) }); @@ -19,13 +20,32 @@ export default function DevUpload(props: DevUploadProps) { const { studioAccessCheck } = useSession(); let title = "Upload Generic File"; - let mediaFileSubtypeForm = <>; + let engineSubForm = <>; if (isVideo) { title = "Upload Video"; } if (isEngineAsset) { title = "Upload Engine Asset"; - mediaFileSubtypeForm = ( + engineSubForm = ( <> +
+ + +