diff --git a/packages/fakeyou.com/src/components/common/Label/Label.tsx b/packages/fakeyou.com/src/components/common/Label/Label.tsx
index 8950320fcd..e20984c47b 100644
--- a/packages/fakeyou.com/src/components/common/Label/Label.tsx
+++ b/packages/fakeyou.com/src/components/common/Label/Label.tsx
@@ -14,24 +14,14 @@ export default function Label({
required,
disabled,
}: Props) {
- return (
-
- {label ? (
-
- ) : null}
- {invalidReason ? (
-
- {invalidReason}
-
- ) : null}
-
- );
+ return label ?
+
+ { invalidReason ? (
+
+ {invalidReason}
+
+ ) : null }
+
: null;
}
diff --git a/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.scss b/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.scss
index a0d864315d..72b4355d6f 100644
--- a/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.scss
+++ b/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.scss
@@ -106,4 +106,14 @@
label { }
}
+
+ .fy-entity-input-upload-detail {
+ span {
+ opacity: .66;
+ display: block;
+ font-size: .75rem;
+ line-height: 1em;
+ height: .75rem;
+ }
+ }
}
\ No newline at end of file
diff --git a/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx b/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx
index ec306800b6..3224678abb 100644
--- a/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx
+++ b/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx
@@ -8,7 +8,7 @@ import { FileWrapper, Label, Spinner } from "components/common";
import { EntityType, MediaFilterProp, WeightFilterProp } from "components/entities/EntityTypes";
import { useFile, useMedia, useModal, useSession } from "hooks";
import { BucketConfig } from "@storyteller/components/src/api/BucketConfig";
-import { faFileArrowUp, faGrid, faPersonWalking } from "@fortawesome/pro-solid-svg-icons";
+import { faDiagramSankey, faFile, faFileArrowUp, faGrid, faImage, faPersonWalking, faWaveform } from "@fortawesome/pro-solid-svg-icons";
import { FontAwesomeIcon as Icon } from "@fortawesome/react-fontawesome";
import { UploadMedia, UploadMediaResponse } from "@storyteller/components/src/api/media_files/UploadMedia";
import { v4 as uuidv4 } from "uuid";
@@ -17,6 +17,7 @@ import "./EntityInput.scss";
interface Props {
label?: string,
onChange?: any,
+ owner?: string,
mediaType?: MediaFilterProp,
aspectRatio?: "square" | "landscape" | "portrait",
weightType?: WeightFilterProp,
@@ -32,6 +33,7 @@ interface EmptySlideProps extends SlideProps {
inputProps?: any,
onSelect: any,
open: any,
+ owner: string,
user: any
};
@@ -64,24 +66,37 @@ const MocapInputFull = ({ media }: SlideProps) => {
>;
};
-const MediaPickerEmpty = ({ entityType, filterType, media, onSelect, open, inputProps, user }: EmptySlideProps) => {
+const MediaPickerEmpty = ({ entityType, filterType, media, onSelect, open, owner, inputProps, user }: EmptySlideProps) => {
const browserClick = () => open({
component: MediaBrowser,
- props: { entityType, filterType, onSelect, username: user?.username || "" }
+ props: { entityType, filterType, onSelect, owner, username: user?.username || "" }
});
+ const mediaIcons = () => {
+ switch (filterType) {
+ case "audio": return faWaveform;
+ case "image": return faImage;
+ case "bvh": return faPersonWalking;
+ default: return faFile;
+ }
+ }
+
return <>
-
+
-
- <>
-
- Upload, click or drag here
- >
-
+ { entityType === EntityType.media &&
+
+ <>
+
+
+ Upload, click or drag here
+ { filterType !== "all" && { filterType } files supported }
+
+ >
+ }
- Choose from your media
+ Choose from your { ["","media","weights"][entityType] }
>;
@@ -94,7 +109,7 @@ const AniMod = ({ animating, className, isLeaving, render: Render, style, ...res
;
-export default function EntityInput({ aspectRatio = "square", label, onChange, mediaType, weightType }: Props) {
+export default function EntityInput({ aspectRatio = "square", label, onChange, owner, mediaType, weightType }: Props) {
const entityType = mediaType ? EntityType.media : weightType ? EntityType.weights : EntityType.unknown;
const filterType = mediaType || weightType || "all";
const { search } = useLocation();
@@ -149,7 +164,7 @@ export default function EntityInput({ aspectRatio = "square", label, onChange, m
return [
,
,
-
+
][i];
})
diff --git a/packages/fakeyou.com/src/components/entities/EntityTypes.tsx b/packages/fakeyou.com/src/components/entities/EntityTypes.tsx
index 2a6e3eaddc..cb36434825 100644
--- a/packages/fakeyou.com/src/components/entities/EntityTypes.tsx
+++ b/packages/fakeyou.com/src/components/entities/EntityTypes.tsx
@@ -11,6 +11,7 @@ export enum MediaFilters {
export enum WeightsFilters {
all,
hifigan_tt2,
+ rvc_v2,
sd_1,
"sd_1.5",
sdxl,
@@ -35,6 +36,6 @@ export const EntityFilterOptions = ( mode: EntityType, t = (v:string) => v) => {
.filter(val => isNaN(Number(val)))
.map((value) => {
if (typeof value === "string") return { value, label: t(value) }
- return { label: "", value: "" };
+ return { label: "all", value: "all" };
}) : [];
};
\ No newline at end of file
diff --git a/packages/fakeyou.com/src/components/entities/MediaList/MediaList.tsx b/packages/fakeyou.com/src/components/entities/MediaList/MediaList.tsx
index 7a0662e0d6..2a5522647f 100644
--- a/packages/fakeyou.com/src/components/entities/MediaList/MediaList.tsx
+++ b/packages/fakeyou.com/src/components/entities/MediaList/MediaList.tsx
@@ -2,7 +2,7 @@ import React, { useRef } from "react";
import { MediaFile } from "@storyteller/components/src/api/media_files/GetMedia";
import MasonryGrid from "components/common/MasonryGrid/MasonryGrid";
import { ImagePreview, MocapPreview, VideoPreview } from '../CardPreviews';
-import { AudioCard, OverlayCard, CardWrapper } from "components/entities";
+import { AudioCard, OverlayCard, CardWrapper, WeightCard } from "components/entities";
import { EntityType } from "components/entities/EntityTypes";
interface MediaCardsProps {
@@ -33,6 +33,10 @@ const MediaCards = ({ props, type }: MediaCardsProps) => {
const WeightsCards = ({ props, type }: MediaCardsProps) => {
switch (type) {
+ case "rvc_v2":
+ return ;
+ case "tt2":
+ return ;
default:
return Unsupported media type
;
}
diff --git a/packages/fakeyou.com/src/components/entities/WeightCard/WeightCard.tsx b/packages/fakeyou.com/src/components/entities/WeightCard/WeightCard.tsx
new file mode 100644
index 0000000000..cc8f31cd6f
--- /dev/null
+++ b/packages/fakeyou.com/src/components/entities/WeightCard/WeightCard.tsx
@@ -0,0 +1,54 @@
+import React from "react";
+import moment from "moment";
+import { MakeRatingsProps } from "hooks/useRatings";
+import WeightCoverImage from "components/common/WeightCoverImage";
+import CardBadge from "../CardBadge";
+import CardFooter from "../CardFooter";
+import { BucketConfig } from "@storyteller/components/src/api/BucketConfig";
+
+interface Props {
+ data: any,
+ makeRatingsProps?: MakeRatingsProps,
+ showCover?: boolean
+ showCreator?: boolean
+}
+
+export default function WeightCard({ data, makeRatingsProps, showCover = true, showCreator }: Props) {
+ const { cover_image, created_at, details, maybe_creator, title, token, weight_type } = data || {}
+ const timeCreated = moment( created_at || "").fromNow();
+ const path = cover_image.maybe_cover_image_public_bucket_path || details?.maybe_weight_data?.maybe_cover_image_public_bucket_path;
+ const bucketConfig = new BucketConfig();
+ const coverImage = bucketConfig.getCdnUrl(path, 110, 100);
+
+ return <>
+
+ {showCover && (
+
+ )}
+
+
+
+
+
+
+
+ { title || details.maybe_weight_data.title}
+
+
{ timeCreated }
+
+
+
+
+
+ >;
+};
\ No newline at end of file
diff --git a/packages/fakeyou.com/src/components/entities/WeightCard/index.tsx b/packages/fakeyou.com/src/components/entities/WeightCard/index.tsx
new file mode 100644
index 0000000000..51be8d0bee
--- /dev/null
+++ b/packages/fakeyou.com/src/components/entities/WeightCard/index.tsx
@@ -0,0 +1 @@
+export { default } from "./WeightCard";
\ No newline at end of file
diff --git a/packages/fakeyou.com/src/components/entities/index.tsx b/packages/fakeyou.com/src/components/entities/index.tsx
index dc973c453e..043d89b296 100644
--- a/packages/fakeyou.com/src/components/entities/index.tsx
+++ b/packages/fakeyou.com/src/components/entities/index.tsx
@@ -3,5 +3,6 @@ import CardWrapper from "./CardWrapper";
import EntityInput from "./EntityInput";
import MediaList from "./MediaList";
import OverlayCard from "./OverlayCard";
+import WeightCard from "./WeightCard";
-export { AudioCard, CardWrapper, EntityInput, MediaList, OverlayCard };
\ No newline at end of file
+export { AudioCard, CardWrapper, EntityInput, MediaList, OverlayCard, WeightCard };
\ No newline at end of file
diff --git a/packages/fakeyou.com/src/components/modals/MediaBrowser/MediaBrowser.tsx b/packages/fakeyou.com/src/components/modals/MediaBrowser/MediaBrowser.tsx
index 4c6eeb3ba8..37400276ae 100644
--- a/packages/fakeyou.com/src/components/modals/MediaBrowser/MediaBrowser.tsx
+++ b/packages/fakeyou.com/src/components/modals/MediaBrowser/MediaBrowser.tsx
@@ -20,12 +20,12 @@ interface Props {
handleClose: any,
mediaToken: string,
onSelect?: any,
+ owner?: string,
filterType?: MediaFilterProp | WeightFilterProp,
username: string,
}
-export default function MediaBrowser({ entityType, filterType: inputFilter, mediaToken, handleClose = () => {}, onSelect, username }: Props) {
- console.log("😎",entityType);
+export default function MediaBrowser({ entityType, filterType: inputFilter, mediaToken, handleClose = () => {}, onSelect, owner, username }: Props) {
const ratings = useRatings();
const [showMasonryGrid, setShowMasonryGrid] = useState(true);
const [filterType, filterTypeSet] = useState(inputFilter || "all");
@@ -46,7 +46,7 @@ export default function MediaBrowser({ entityType, filterType: inputFilter, medi
setShowMasonryGrid(true);
},
requestList: true,
- urlParam: "echelon",
+ urlParam: owner || username,
urlUpdate: false
});
@@ -74,7 +74,7 @@ export default function MediaBrowser({ entityType, filterType: inputFilter, medi
return <>
-
{ ["","Media","Weights"][entityType] }
+ { ["",`${ owner ? owner + "'s " : "" }Media`,"Weights"][entityType] }
handleClose() }}/>
diff --git a/packages/fakeyou.com/src/components/providers/ModalProvider/ModalProvider.tsx b/packages/fakeyou.com/src/components/providers/ModalProvider/ModalProvider.tsx
index 4ad7b68506..e003c45a34 100644
--- a/packages/fakeyou.com/src/components/providers/ModalProvider/ModalProvider.tsx
+++ b/packages/fakeyou.com/src/components/providers/ModalProvider/ModalProvider.tsx
@@ -13,10 +13,7 @@ interface ModalConfig {
export default function ModalProvider({ children }: Props) {
const [modalState,modalStateSet] = useState
(null);
- const open = (cfg: ModalConfig) => {
- console.log("🪬",cfg);
- modalStateSet(cfg);
- };
+ const open = (cfg: ModalConfig) => modalStateSet(cfg);
const close = () => modalStateSet(null);
return
diff --git a/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx b/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx
index ec88d331fd..59f7369eaf 100644
--- a/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx
+++ b/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx
@@ -33,7 +33,6 @@ export default function useListContent({
urlParam = "",
urlUpdate = true
}: Props) {
- console.log("💎",fetcher);
const { pathname, search: locSearch } = useLocation();
const history = useHistory();
const urlQueries = new URLSearchParams(locSearch);
diff --git a/packages/fakeyou.com/src/v2/view/pages/EngineCompositor/EngineCompositor.scss b/packages/fakeyou.com/src/v2/view/pages/EngineCompositor/EngineCompositor.scss
index d5cddc989a..c10af58fbc 100644
--- a/packages/fakeyou.com/src/v2/view/pages/EngineCompositor/EngineCompositor.scss
+++ b/packages/fakeyou.com/src/v2/view/pages/EngineCompositor/EngineCompositor.scss
@@ -1,12 +1,10 @@
.fy-engine-compositor {
- // margin: 1rem;
padding: 1rem;
.engine-compositor-container {
padding: 1rem;
header {
- // background: blue;
margin-bottom: 1.5rem;
display: flex;
align-items: center;
@@ -14,16 +12,12 @@
width: 100%;
}
- h2 { margin-bottom: 0; }
+ h2, .fy-temp-select, .fy-input { margin-bottom: 0; }
}
.compositor-content {
display: flex;
gap: 1rem;
- // padding: 1rem;
- > * {
- width: 100%;
- // background: red;
- }
+ > * { width: 100%; }
}
}
\ No newline at end of file
diff --git a/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx b/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx
index 2d970a6a6d..4a079ab0de 100644
--- a/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx
+++ b/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx
@@ -1,11 +1,7 @@
import React, { useState } from "react";
import { EntityInput } from "components/entities";
-import { Button } from "components/common";
-// import { useInferenceJobs } from "hooks";
-// import InferenceJobsList from "components/layout/InferenceJobsList";
-// import { EnqueueEngineCompositing } from "@storyteller/components/src/api/engine_compositor/EnqueueEngineCompositing";
-// import { FrontendInferenceJobType } from "@storyteller/components/src/jobs/InferenceJob";
-// import { v4 as uuidv4 } from "uuid";
+import { EntityFilterOptions, EntityType, MediaFilterProp, WeightFilterProp } from "components/entities/EntityTypes";
+import { Button, SegmentButtons, TempInput, TempSelect } from "components/common";
interface Props {
value?: any;
@@ -13,34 +9,34 @@ interface Props {
export default function DevMediaInput({ value }: Props) {
const [mediaToken,mediaTokenSet] = useState();
+ const [mediaType,mediaTypeSet] = useState("all");
+ const [weightType,weightTypeSet] = useState("all");
+ const [entityType,entityTypeSet] = useState(EntityType.media);
+ const [owner,ownerSet] = useState("");
const onChange = ({ target }: any) => mediaTokenSet(target.value);
- // const inferenceJobs = useInferenceJobs(FrontendInferenceJobType.EngineComposition);
- // const failures = (fail = "") => {
- // switch (fail) {
- // default:
- // return "Uknown failure";
- // }
- // };
+ const options = [{ label: "Media", value: EntityType.media },{ label: "Weights", value: EntityType.weights }];
+ const changeFilter = ({ target }: { target: any }) => [mediaTypeSet,mediaTypeSet,weightTypeSet][entityType](target.value);
return
{ [526,187].map((num = 0) => String.fromCodePoint(128000 + num)) }
+ entityTypeSet(target.value), options, value: entityType }}/>
+ ownerSet(target.value), placeholder: "User" }}/>
+
-
+
{ mediaToken }
- {
- //
- }
;
};
\ No newline at end of file