leonm/musicland
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more fixes and changes, crash, design …

Browse Source
This commit is contained in:
Thomas Demirdjian
2025-11-14 18:25:28 +01:00
parent cd31d42c0c
commit 705fda0ce3
17 changed files with 1136 additions and 785 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/screens/Playback/Playback.js
+36 -6
View File
@@ -1,4 +1,4 @@
import React, { useCallback, useState } from "react";
import React, { useCallback, useEffect, useMemo, useState } from "react";
import { Image, StyleSheet, View } from "react-native";
import { ai, background } from "../../assets";
import BorderGradientButton from "../../components/BorderGradientButton";
@@ -6,13 +6,42 @@ import FullscreenIntroVideo from "../../components/FullscreenIntroVideo";
import GradientButton from "../../components/GradientButton";
import MusicLandHeader from "../../components/MusicLandHeader";
import Page from "../../layouts/Page";
import { isWeb } from "../../hooks/useLayoutType";
import { Routes } from "../../navigation";
import { goBack, navigate } from "../../navigation/NavigationService";
import { useUser } from "../../providers/UserDataProvider";
import { gutters } from "../../styles";
const Playback = ({ route }) => {
const { project } = route.params;
const [showIntro, setShowIntro] = useState(true);
const { project } = route.params || {};
const { videos } = useUser();
const [showIntro, setShowIntro] = useState(false);
const introVideoUrl = useMemo(() => {
if (!videos) {
return null;
}
return isWeb ? videos?.benhaiWeb || null : videos?.benhai || null;
}, [videos]);
useEffect(() => {
if (!introVideoUrl) {
setShowIntro(false);
return;
}
setShowIntro(true);
}, [introVideoUrl]);
const handleCloseIntro = useCallback(() => {
setShowIntro(false);
}, []);
const handleShowGuide = useCallback(() => {
if (!introVideoUrl) {
return;
}
setShowIntro(true);
}, [introVideoUrl]);
const onPressRecord = useCallback(() => {
navigate(Routes.RecordPlayback, { project });
@@ -36,14 +65,15 @@ const Playback = ({ route }) => {
/>
<BorderGradientButton
title="Guide du Playbacker"
onPress={() => setShowIntro(true)}
onPress={handleShowGuide}
/>
{/* <BorderGradientButton title="Importer une vidéo" /> */}
</View>
</View>
<FullscreenIntroVideo
visible={showIntro}
onClose={() => setShowIntro(false)}
url={introVideoUrl}
visible={showIntro && !!introVideoUrl}
onClose={handleCloseIntro}
/>
</Page>
);
src/screens/Playback/RecordPlayback.web.js
+27 -24
View File
@@ -24,6 +24,8 @@ import { goBack, navigate } from "../../navigation/NavigationService";
import { gutters, Palette } from "../../styles";
import { FONT_FAMILY } from "../../styles/Fonts";
import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
import { background } from "../../assets";
import playbackBG2 from "../../assets/UI/playbackBG2.png";
const TIME_BEFORE_INCREMENT_MS = 20000;
const LOG_PREFIX = "[RecordPlayback.web]";
@@ -169,7 +171,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"mediaRecorder:stopPrevious:error",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
@@ -187,7 +189,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"mediaRecorder:createError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
setMediaError(e instanceof Error ? e : new Error(String(e || "")));
return false;
@@ -209,7 +211,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"mediaRecorder:error",
String(err?.message || err || "")
String(err?.message || err || ""),
);
setMediaError(err instanceof Error ? err : new Error(String(err || "")));
};
@@ -230,7 +232,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"mediaRecorder:onstop:createBlobError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
releaseRecordingUrl();
}
@@ -253,7 +255,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"mediaRecorder:startError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
if (stopRecordingResolveRef.current) {
stopRecordingResolveRef.current(null);
@@ -283,7 +285,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"mediaRecorder:stopError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
@@ -298,7 +300,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"mediaRecorder:waitStopError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
} finally {
stopRecordingPromiseRef.current = null;
@@ -320,7 +322,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"resetSession:error",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
try {
@@ -330,7 +332,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"resetSession:recorderError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
console.log(LOG_PREFIX, "resetSession:end");
@@ -360,7 +362,7 @@ const RecordPlayback = ({ route }) => {
setLooping(!!originalLoopingValueRef.current.value);
}
};
}, [setLooping])
}, [setLooping]),
);
useFocusEffect(
@@ -370,7 +372,7 @@ const RecordPlayback = ({ route }) => {
console.log(LOG_PREFIX, "focusEffect:cleanup");
void resetSessionRef.current?.();
};
}, [])
}, []),
);
useEffect(() => {
@@ -385,7 +387,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"requestingCameraPermission:error",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
})();
@@ -410,7 +412,7 @@ const RecordPlayback = ({ route }) => {
!navigator.mediaDevices?.getUserMedia
) {
setMediaError(
new Error("La capture vidéo n'est pas supportée sur ce navigateur")
new Error("La capture vidéo n'est pas supportée sur ce navigateur"),
);
setMediaReady(false);
return;
@@ -460,7 +462,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"previewVideo:attachError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
} else {
@@ -502,7 +504,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"stopAndNavigate:pauseError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
@@ -516,7 +518,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"stopAndNavigate:recorderError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
@@ -562,7 +564,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"progressLoop:correctInitialJumpError",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
}
@@ -644,7 +646,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"listenLoop:incrementViews:error",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
}
@@ -654,7 +656,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"listenLoop:error",
String(e?.message || e || "")
String(e?.message || e || ""),
);
}
}, 500);
@@ -683,7 +685,7 @@ const RecordPlayback = ({ route }) => {
console.log(
LOG_PREFIX,
"startPlayback:error",
String(e?.message || e || "")
String(e?.message || e || ""),
);
setIsRecording(false);
setIsPreparing(false);
@@ -702,7 +704,7 @@ const RecordPlayback = ({ route }) => {
},
},
],
{ cancelable: false }
{ cancelable: false },
);
}
}
@@ -743,6 +745,7 @@ const RecordPlayback = ({ route }) => {
maxWidth={800}
containerStyle={{ margin: 0, padding: 0, backgroundColor: Palette.black }}
headerType="NONE"
backgroundImg={background.playbackBG2}
>
<MusicLandHeader progress={9} onPressBack={goBack} />
@@ -767,7 +770,7 @@ const RecordPlayback = ({ route }) => {
height: "100%",
objectFit: "cover",
transform: "scaleX(-1)",
backgroundColor: "#000000",
backgroundColor: "transparent",
}}
/>
@@ -793,7 +796,7 @@ const RecordPlayback = ({ route }) => {
left: 0,
right: 0,
bottom: 0,
backgroundColor: "#00000099",
backgroundColor: "transparent",
alignItems: "center",
justifyContent: "center",
paddingHorizontal: gutters,
@@ -820,7 +823,7 @@ const RecordPlayback = ({ route }) => {
left: 0,
right: 0,
bottom: 0,
backgroundColor: "#00000066",
backgroundColor: "transparent",
alignItems: "center",
justifyContent: "center",
}}