Ajout traque-app

2026-02-09 10:20:16 +01:00 · 2025-08-24 10:30:32 +02:00
parent 623d1c05bf
commit a7f047388f
72 changed files with 45125 additions and 0 deletions
--- a/traque-app/app/index.js
+++ b/traque-app/app/index.js
@@ -0,0 +1,113 @@
+// React
+import { useState, useEffect } from 'react';
+import { ScrollView, View, Text, StyleSheet, Image, Alert } from 'react-native';
+// Expo
+import { useRouter } from 'expo-router';
+// Components
+import CustomButton from '../components/button';
+import CustomImage from '../components/image';
+import CustomTextInput from '../components/input';
+// Other
+import { useSocket } from '../context/socketContext';
+import { useTeamContext } from '../context/teamContext';
+import { useTeamConnexion } from "../context/teamConnexionContext";
+import { usePickImage } from '../hook/usePickImage';
+
+const backgroundColor = '#f5f5f5';
+
+export default function Index() {
+    const router = useRouter();
+    const {SERVER_URL} = useSocket();
+    const {login, loggedIn, loading} = useTeamConnexion();
+    const {getLocationAuthorization, stopLocationTracking} = useTeamContext();
+    const {image, pickImage, sendImage} = usePickImage();
+    const [teamID, setTeamID] = useState("");
+    const [isSubmitting, setIsSubmitting] = useState(false);
+
+    // Disbaling location tracking
+    useEffect(() => {
+        stopLocationTracking();
+    }, []);
+
+    // Routeur
+    useEffect(() => {
+        if (!loading && loggedIn) {
+            router.replace("/display");
+        }
+    }, [loggedIn, loading]);
+
+    function handleSubmit() {
+        if (!isSubmitting && !loading) {
+            setIsSubmitting(true);
+            if (getLocationAuthorization()) {
+                login(parseInt(teamID))
+                    .then((response) => {
+                        if (response.isLoggedIn) {
+                            sendImage(`${SERVER_URL}/upload?team=${teamID}`);
+                        } else {
+                            Alert.alert("Échec", "L'ID d'équipe est inconnu.");
+                        }
+                        setIsSubmitting(false);
+                    })
+                    .catch(() => {
+                        Alert.alert("Échec", "La connection au serveur a échoué.");
+                        setIsSubmitting(false);
+                    });
+            }
+            setTeamID("");
+        }
+    }
+
+    return (
+        <ScrollView contentContainerStyle={styles.container}>
+            <View style={styles.transitionContainer}>
+                <View style={styles.subContainer}>
+                    <Image style={styles.logoImage} source={require('../assets/images/logo/logo_traque.png')}/>
+                    <Text style={styles.logoText}>LA TRAQUE</Text>
+                </View>
+                <View style={styles.subContainer}>
+                    <CustomTextInput value={teamID} inputMode="numeric" placeholder="ID de l'équipe" style={styles.input} onChangeText={setTeamID}/>
+                </View>
+                <View style={styles.subContainer}>
+                    <Text style={{fontSize: 15}}>Appuyer pour changer la photo d'équipe</Text>
+                    <Text style={{fontSize: 13, marginBottom: 3}}>(Le haut du corps doit être visible)</Text>
+                    <CustomImage source={image ? {uri: image.uri} : require('../assets/images/missing_image.jpg')} onPress={pickImage}/>
+                </View>
+                <View style={styles.subContainer}>
+                     <CustomButton label={(isSubmitting || loading) ? "..." : "Valider"} onPress={handleSubmit}/>
+                </View>
+            </View>
+        </ScrollView>
+    );
+}
+
+const styles = StyleSheet.create({
+    container: {
+        flexGrow: 1,
+        alignItems: 'center',
+        paddingVertical: 20,
+        backgroundColor: backgroundColor
+    },
+    transitionContainer: {
+        flexGrow: 1,
+        width: '80%',
+        maxWidth: 600,
+        alignItems: 'center',
+    },
+    subContainer: {
+        flexGrow: 1,
+        width: "100%",
+        alignItems: 'center',
+        justifyContent: 'center',
+        margin: 10,
+    },
+    logoImage: {
+        width: 130,
+        height: 130,
+        margin: 10,
+    },
+    logoText: {
+        fontSize: 50,
+        fontWeight: 'bold',
+    }
+});