parent
753a2f5622
commit
019b67cce0
@ -1,97 +0,0 @@
|
||||
// import { SafeAreaView, StyleSheet, View } from "react-native";
|
||||
// import React from "react";
|
||||
// import {
|
||||
// Avatar,
|
||||
// AvatarFallbackText,
|
||||
// AvatarImage,
|
||||
// } from "@/components/ui/avatar";
|
||||
// import { AntDesign } from "@expo/vector-icons";
|
||||
// import { Text } from "@/components/ui/text";
|
||||
// import ExerciceOverview from "@/components/ExerciceOverview";
|
||||
|
||||
// export default function HomeScreen() {
|
||||
// const date = new Date();
|
||||
// const formattedDate = date.toLocaleDateString("fr-FR", {
|
||||
// year: "numeric",
|
||||
// month: "long",
|
||||
// day: "numeric",
|
||||
// });
|
||||
|
||||
// return (
|
||||
// <SafeAreaView style={styles.container}>
|
||||
// <View style={styles.headerStyle}>
|
||||
// <View style={styles.dateContainer}>
|
||||
// <AntDesign name="calendar" size={24} color="white" />
|
||||
// <Text style={styles.dateText}>{formattedDate}</Text>
|
||||
// </View>
|
||||
|
||||
// <View style={styles.avatarContainer}>
|
||||
// <Avatar size="xl">
|
||||
// <AvatarFallbackText>Jane Doe</AvatarFallbackText>
|
||||
// <AvatarImage
|
||||
// source={{
|
||||
// uri: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=687&q=80",
|
||||
// }}
|
||||
// />
|
||||
// </Avatar>
|
||||
// <Text style={styles.titleNameUser}>Hello, Tata Monique</Text>
|
||||
// </View>
|
||||
// </View>
|
||||
|
||||
// <View>
|
||||
// <ExerciceOverview />
|
||||
// </View>
|
||||
// </SafeAreaView>
|
||||
// );
|
||||
// }
|
||||
|
||||
// const styles = StyleSheet.create({
|
||||
// container: {
|
||||
// flex: 1,
|
||||
// backgroundColor: "#f9f9f9", // Fond de l'écran avec une couleur claire
|
||||
// },
|
||||
// headerStyle: {
|
||||
// height: 200,
|
||||
// backgroundColor: "#333333", // Gris foncé pour l'arrière-plan du header
|
||||
// borderBottomEndRadius: 25,
|
||||
// borderBottomStartRadius: 25,
|
||||
// padding: 20,
|
||||
// alignItems: "flex-start",
|
||||
// justifyContent: "flex-start",
|
||||
// },
|
||||
// dateContainer: {
|
||||
// flexDirection: "row",
|
||||
// alignItems: "flex-start",
|
||||
// marginBottom: 20,
|
||||
// },
|
||||
// dateText: {
|
||||
// fontSize: 18,
|
||||
// fontWeight: "bold",
|
||||
// marginLeft: 10,
|
||||
// color: "#ffffff",
|
||||
// },
|
||||
// avatarContainer: {
|
||||
// marginBottom: 15,
|
||||
// flexDirection: "row",
|
||||
// alignItems: "center",
|
||||
// },
|
||||
|
||||
// titleNameUser: {
|
||||
// fontSize: 24,
|
||||
// color: "#ffffff",
|
||||
// fontWeight: "bold",
|
||||
// marginLeft: 10,
|
||||
// },
|
||||
// contentContainer: {
|
||||
// marginTop: 20,
|
||||
// padding: 15,
|
||||
// alignItems: "flex-start",
|
||||
// },
|
||||
// contentText: {
|
||||
// fontSize: 16,
|
||||
// color: "#333333", // Texte en gris foncé pour une bonne lisibilité
|
||||
// textAlign: "center",
|
||||
// },
|
||||
|
||||
// fitness: {},
|
||||
// });
|
@ -1,19 +0,0 @@
|
||||
import React from "react";
|
||||
import {Stack} from "expo-router";
|
||||
|
||||
export default function RootoLayout() {
|
||||
return (
|
||||
<Stack screenOptions={{
|
||||
headerShown: false,
|
||||
}}
|
||||
initialRouteName={"ExercicesScreen"}
|
||||
>
|
||||
<Stack.Screen name="ExercicesScreen" />
|
||||
|
||||
<Stack.Screen name="WorkoutScreen"/>
|
||||
|
||||
</Stack>
|
||||
|
||||
);
|
||||
|
||||
}
|
@ -0,0 +1,156 @@
|
||||
import React, { useState } from "react";
|
||||
import { View, Text, ImageBackground, TouchableOpacity, ScrollView, Dimensions, Image } from "react-native";
|
||||
import Modal from "react-native-modal";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import {useWorkoutStore} from "@/store/workoutStore";
|
||||
import {Workout} from "@/model/Workout";
|
||||
import {useRouter} from "expo-router";
|
||||
|
||||
const screenHeight = Dimensions.get("window").height;
|
||||
|
||||
export default function WorkoutScreen() {
|
||||
const router = useRouter();
|
||||
const workout = useWorkoutStore((s) => s.selectedWorkout);
|
||||
const [isModalVisible, setModalVisible] = useState(false);
|
||||
|
||||
if (!workout) return <Text>Pas de workout</Text>;
|
||||
|
||||
const exercises: any[] = [
|
||||
{
|
||||
id: "1",
|
||||
title: "Back Warmup",
|
||||
duration: "05:30",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Bent Over Row",
|
||||
duration: "10:00",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Renegade Row",
|
||||
duration: "08:45",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<View className="flex-1 bg-black">
|
||||
|
||||
<ImageBackground
|
||||
source={require("assets/images/TrainingPresentation.png")}
|
||||
className="flex-1 justify-between px-6 pb-10 pt-14"
|
||||
imageStyle={{ resizeMode: "cover" }}
|
||||
>
|
||||
<View className="flex-row justify-between">
|
||||
<TouchableOpacity className="bg-black/50 p-2 rounded-full">
|
||||
<Ionicons name="chevron-back" size={20} color="white" />
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity className="bg-black/50 p-2 rounded-full">
|
||||
<Ionicons name="settings-outline" size={20} color="white" />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<View className="flex-1 justify-end">
|
||||
<View className="items-center">
|
||||
<View className="bg-black/50 px-6 py-2 rounded-full mb-4">
|
||||
<Text className="text-white text-base">{exercises.length} Total</Text>
|
||||
</View>
|
||||
<Text className="text-white text-4xl font-bold">{workout.name}</Text>
|
||||
</View>
|
||||
|
||||
<View className="flex-row justify-between mb-16 mt-16">
|
||||
<View className="items-center flex-1">
|
||||
<Ionicons name="time-outline" size={36} color="white" />
|
||||
<Text className="text-white font-bold text-xl mt-2">{workout.duration} min</Text>
|
||||
<Text className="text-gray-300 text-lg">Time</Text>
|
||||
</View>
|
||||
|
||||
<View className="h-20 w-1 bg-white mx-2" />
|
||||
|
||||
<View className="items-center flex-1">
|
||||
<Ionicons name="flame-outline" size={36} color="white" />
|
||||
<Text className="text-white font-bold text-xl mt-2">240kcal</Text>
|
||||
<Text className="text-gray-300 text-lg">Calories</Text>
|
||||
</View>
|
||||
|
||||
<View className="h-20 w-1 bg-white mx-2" />
|
||||
|
||||
<View className="items-center flex-1">
|
||||
<Ionicons name="barbell-outline" size={36} color="white" />
|
||||
<Text className="text-white font-bold text-xl mt-2">{workout.nbRepetitions}</Text>
|
||||
<Text className="text-gray-300 text-lg">Sets</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
|
||||
<View className="flex-row">
|
||||
<TouchableOpacity
|
||||
className="flex-1 bg-black/50 p-4 rounded-xl flex-row justify-center items-center"
|
||||
onPress={() => setModalVisible(true)}
|
||||
>
|
||||
<Text className="text-white mr-2">Details</Text>
|
||||
<Ionicons name="document-text-outline" size={18} color="white" />
|
||||
</TouchableOpacity>
|
||||
|
||||
<TouchableOpacity className="flex-1 bg-orange-500 p-4 rounded-xl flex-row justify-center items-center">
|
||||
<Text className="text-white font-bold mr-2">Start</Text>
|
||||
<Ionicons name="timer-outline" size={18} color="white" />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</ImageBackground>
|
||||
|
||||
<Modal
|
||||
isVisible={isModalVisible}
|
||||
onBackdropPress={() => setModalVisible(false)}
|
||||
swipeDirection="down"
|
||||
onSwipeComplete={() => setModalVisible(false)}
|
||||
style={{
|
||||
justifyContent: "flex-end",
|
||||
margin: 0,
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
height: screenHeight * 0.65,
|
||||
backgroundColor: "white",
|
||||
borderTopLeftRadius: 20,
|
||||
borderTopRightRadius: 20,
|
||||
padding: 20,
|
||||
}}
|
||||
>
|
||||
<ScrollView>
|
||||
<Text className="text-center text-gray-700 mb-4">
|
||||
Liste des exercices
|
||||
</Text>
|
||||
|
||||
{exercises.map((ex, index) => (
|
||||
<View
|
||||
key={ex.id}
|
||||
className="flex-row bg-gray-100 rounded-xl items-center p-3 mb-4"
|
||||
>
|
||||
<Image source={require("assets/images/TrainingPresentation.png")} className="w-16 h-16 rounded-md mr-3" />
|
||||
<View className="flex-1">
|
||||
<Text className="font-semibold text-black">
|
||||
{index + 1}. {ex.title}
|
||||
</Text>
|
||||
<View className="flex-row items-center mt-1">
|
||||
<Ionicons name="time-outline" size={14} color="gray" />
|
||||
<Text className="text-gray-500 text-xs ml-1">{ex.duration}</Text>
|
||||
</View>
|
||||
</View>
|
||||
<TouchableOpacity
|
||||
onPress={() => {
|
||||
// router.push("/(tabs)/(exercice)/ExercicesScreen")
|
||||
}}>
|
||||
<Ionicons name="play-circle" size={30} color="#ff7a00" />
|
||||
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
))}
|
||||
</ScrollView>
|
||||
</View>
|
||||
</Modal>
|
||||
</View>
|
||||
);
|
||||
}
|
@ -0,0 +1,32 @@
|
||||
import {router, useLocalSearchParams} from 'expo-router';
|
||||
import { View, Text, Image } from 'react-native';
|
||||
import { useEffect, useState } from 'react';
|
||||
import {Workout} from "@/model/Workout";
|
||||
import WorkoutPresentationComponent from "@/components/WorkoutPresentationComponent";
|
||||
|
||||
export default function WorkoutScreen() {
|
||||
const params = useLocalSearchParams();
|
||||
const [workout, setWorkout] = useState<Workout | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (typeof params.workout === 'string') {
|
||||
try {
|
||||
const parsed = JSON.parse(params.workout);
|
||||
setWorkout(parsed);
|
||||
} catch (error) {
|
||||
}
|
||||
}
|
||||
}, []);
|
||||
|
||||
if (!workout) {
|
||||
return <Text style={{ padding: 20, margin: 30 }}>Aucune donnée reçue.</Text>;
|
||||
}
|
||||
|
||||
return (
|
||||
<View>
|
||||
<WorkoutPresentationComponent
|
||||
workout={workout}
|
||||
/>r
|
||||
</View>
|
||||
);
|
||||
}
|
@ -0,0 +1,16 @@
|
||||
import React from "react";
|
||||
import {Stack} from "expo-router";
|
||||
|
||||
export default function RootoLayout() {
|
||||
return (
|
||||
<Stack
|
||||
screenOptions={{
|
||||
headerShown: false,
|
||||
}}
|
||||
initialRouteName="ExercicesScreen"
|
||||
>
|
||||
<Stack.Screen name="ExercicesScreen" />
|
||||
<Stack.Screen name="WorkoutScreen" />
|
||||
</Stack>
|
||||
);
|
||||
}
|
Binary file not shown.
After Width: | Height: | Size: 354 KiB |
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 278 KiB |
Before Width: | Height: | Size: 278 KiB |
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,16 @@
|
||||
import {TargetEnum} from "@/model/enums/Target.enum";
|
||||
|
||||
export interface Exercice {
|
||||
id: string;
|
||||
name: string;
|
||||
description: string;
|
||||
target: TargetEnum;
|
||||
image: string;
|
||||
video: string;
|
||||
duration: number;
|
||||
nbSeries: number;
|
||||
restTime: number;
|
||||
nbRepetitions: number;
|
||||
weight: number;
|
||||
passed: boolean;
|
||||
}
|
@ -0,0 +1,10 @@
|
||||
import {Exercice} from "@/model/Exercice";
|
||||
import {CategoryEnum} from "@/model/enums/Category.enum";
|
||||
|
||||
export interface Session {
|
||||
id: string;
|
||||
name: string;
|
||||
description: string;
|
||||
category: CategoryEnum;
|
||||
exercises: Exercice[];
|
||||
}
|
@ -0,0 +1,8 @@
|
||||
import {Session} from "@/model/Session";
|
||||
|
||||
export interface Training {
|
||||
id: string;
|
||||
name: string;
|
||||
description: string;
|
||||
sessions: Session[];
|
||||
}
|
@ -0,0 +1,6 @@
|
||||
export enum CategoryEnum {
|
||||
NONE = 'none',
|
||||
TRAINING = 'training',
|
||||
STRETCHING = 'stretching',
|
||||
WARMUP = 'warmup'
|
||||
}
|
@ -0,0 +1,8 @@
|
||||
export enum TargetEnum {
|
||||
NONE = 'none',
|
||||
ARM= 'arms',
|
||||
BACK = 'back',
|
||||
CARDIO = 'cardio',
|
||||
CHEST = 'chest',
|
||||
LEG = 'legs'
|
||||
}
|
@ -0,0 +1,14 @@
|
||||
import {Workout} from "@/model/Workout";
|
||||
import {create} from "zustand/react";
|
||||
import {Exercice} from "@/model/Exercice";
|
||||
|
||||
|
||||
type State = {
|
||||
selectedExercice: Exercice | null;
|
||||
setExercice: (exercice: Exercice) => void;
|
||||
}
|
||||
|
||||
export const useExerciceStore = create<State>((set) => ({
|
||||
selectedExercice: null,
|
||||
setExercice: (exercice: Exercice) => set({ selectedExercice: exercice })
|
||||
}));
|
@ -0,0 +1,12 @@
|
||||
import {Workout} from "@/model/Workout";
|
||||
import {create} from "zustand/react";
|
||||
|
||||
type State = {
|
||||
selectedWorkout: Workout | null;
|
||||
setWorkout: (workout: Workout) => void;
|
||||
};
|
||||
|
||||
export const useWorkoutStore = create<State>((set) => ({
|
||||
selectedWorkout: null,
|
||||
setWorkout: (workout: Workout) => set({ selectedWorkout: workout }),
|
||||
}));
|
Loading…
Reference in new issue