gofnnp/w-aura
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

AW-119-personal-video-edits

Browse Source 
add video preview and change loading on /v1/onboarding page
This commit is contained in:
gofnnp 2024-06-24 18:29:36 +04:00
parent c07a1a9724
commit 005b44324a
4 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/personal_video_preview.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 482 KiB

15
src/components/pages/ABDesign/v1/pages/Onboarding/index.tsx
View File

@ -53,14 +53,15 @@ function OnboardingPage() {
const getProgressIntervalTiming = useCallback(() => { const getProgressIntervalTiming = useCallback(() => {
const generateTimeLimit = import.meta.env.AURA_PERSONAL_VIDEO_TIME_LIMIT; const generateTimeLimit = import.meta.env.AURA_PERSONAL_VIDEO_TIME_LIMIT;
if (progress < 95 || isVideoReady) { const baseTiming = (onboardingTitles.length * 5000) / 100;
return (onboardingTitles.length * 5000) / 100; if (isVideoReady) return baseTiming;
} const generatingVideoTiming =
return (
(Number(generateTimeLimit) * 1000 - new Date().getTime() + createdDate) / (Number(generateTimeLimit) * 1000 - new Date().getTime() + createdDate) /
4 100;
); return generatingVideoTiming < baseTiming
}, [createdDate, isVideoReady, progress]); ? baseTiming
: generatingVideoTiming;
}, [createdDate, isVideoReady]);
useEffect(() => { useEffect(() => {
progressInterval.current = setInterval(() => { progressInterval.current = setInterval(() => {

7
src/components/pages/ABDesign/v1/pages/TrialPayment/components/PersonalVideo/index.tsx
View File

@ -20,12 +20,7 @@ const PersonalVideo = React.memo<IPersonalVideoProps>(({ url, gender }) => {
}; };
return ( return (
<div <div className={styles.container}>
className={styles.container}
style={{
backgroundColor: gender === "male" ? "#85B6FF" : "#D1ACF2",
}}
>
{!isPlaying && !isError && <Loader className={styles.loader} />} {!isPlaying && !isError && <Loader className={styles.loader} />}
{isError && ( {isError && (
<PlayButton <PlayButton

4
src/components/pages/ABDesign/v1/pages/TrialPayment/components/PersonalVideo/styles.module.css
View File

@ -4,6 +4,10 @@
position: relative; position: relative;
overflow: hidden; overflow: hidden;
border-radius: 10px; border-radius: 10px;
background-image: url("/personal_video_preview.webp");
background-size: contain;
background-position: 0 0;
background-repeat: no-repeat;
} }
.play-button, .loader { .play-button, .loader {