Philip Cesar Garay
64 lines
2.0 KiB
JavaScript
64 lines
2.0 KiB
JavaScript
import React, { useCallback, useState } from "react";
|
|
import { Image, StyleSheet, View } from "react-native";
|
|
import { ai, background } from "../../assets";
|
|
import BorderGradientButton from "../../components/BorderGradientButton";
|
|
import GradientButton from "../../components/GradientButton";
|
|
import MusicLandHeader from "../../components/MusicLandHeader";
|
|
import Page from "../../layouts/Page";
|
|
import { Routes } from "../../navigation";
|
|
import { goBack, navigate } from "../../navigation/NavigationService";
|
|
import { gutters } from "../../styles";
|
|
import FullscreenIntroVideo from "../../components/FullscreenIntroVideo";
|
|
|
|
const Playback = ({ route }) => {
|
|
const { project } = route.params;
|
|
const [showIntro, setShowIntro] = useState(true);
|
|
|
|
const onPressRecord = useCallback(() => {
|
|
// Les timestamps sont désormais générés automatiquement côté serveur
|
|
// lors de la mise à jour du document (si songUrl existe).
|
|
navigate(Routes.RecordPlayback, { project });
|
|
}, [project]);
|
|
|
|
return (
|
|
<Page headerType="NONE" backgroundImg={background.playbackBG2}>
|
|
<Image source={ai.john} style={styles.img} resizeMode="contain" />
|
|
<MusicLandHeader onPressBack={goBack} progress={25} />
|
|
<View
|
|
style={{
|
|
flex: 1,
|
|
paddingBottom: gutters * 2,
|
|
justifyContent: "flex-end",
|
|
}}
|
|
>
|
|
<View style={{ width: "80%", alignSelf: "center", gap: 12 }}>
|
|
<BorderGradientButton
|
|
title="Guide du Playbacker"
|
|
onPress={() => setShowIntro(true)}
|
|
/>
|
|
{/* <BorderGradientButton title="Importer une vidéo" /> */}
|
|
<GradientButton
|
|
title="Enregistrer mon Playback"
|
|
onPress={onPressRecord}
|
|
/>
|
|
</View>
|
|
</View>
|
|
<FullscreenIntroVideo
|
|
visible={showIntro}
|
|
onClose={() => setShowIntro(false)}
|
|
/>
|
|
</Page>
|
|
);
|
|
};
|
|
|
|
export default Playback;
|
|
|
|
const styles = StyleSheet.create({
|
|
img: {
|
|
width: "100%",
|
|
height: "70%",
|
|
position: "absolute",
|
|
bottom: -40,
|
|
},
|
|
});
|