fix quelques bug. ajout images points.

Backend/add_session
mohamed 2 years ago
parent 2d684c1640
commit 448ad0f5dd

Binary file not shown.

After

Width:  |  Height:  |  Size: 527 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 594 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 419 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 587 B

@ -106,12 +106,12 @@ export default function Lap(props: { navigation: any, route : any}) {
<View style={styles.infoContainer}>
<Text style={styles.infoItem}>Average Speed:</Text>
<Text style={styles.infoValue}>{currentLap.getAverageSpeed()} km/h</Text>
<Text style={styles.infoValue}>{currentLap.getAverageSpeed().toFixed()} km/h</Text>
</View>
<View style={styles.infoContainer}>
<Text style={styles.infoItem}>Max Speed:</Text>
<Text style={styles.infoValue}>{currentLap.getMaxSpeed()} km/h</Text>
<Text style={styles.infoValue}>{currentLap.getMaxSpeed().toFixed()} km/h</Text>
</View>
</View>
</BackgroundImage>

@ -1,7 +1,7 @@
import { BackgroundImage } from '@rneui/base';
import { StyleSheet, Text, View, TouchableOpacity, ScrollView } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import MapView, { Marker } from 'react-native-maps';
import MapView, { MapCallout, Marker } from 'react-native-maps';
import React from 'react';
import TopBar from '../components/TopBar';
import { Point } from '../core/Point';
@ -20,6 +20,7 @@ export default function Lap(props: { navigation: any, route : any}) {
const goToPreviousPoint = () => {
if (currentPointIndex > 0) {
setCurrentPointIndex(currentPointIndex - 1);
}
};
@ -29,11 +30,24 @@ export default function Lap(props: { navigation: any, route : any}) {
}
};
const markers: { id: number; name: string; coordinate: { latitude: number; longitude: number } }[] = points.map((pt, index) => {
const markers: { id: number; name: string; coordinate: { latitude: number; longitude: number }, image: HTMLImageElement }[] = points.map((pt, index) => {
var img;
const brake = pt.getPBreakF();
if(brake <= 0)
{
img = require("../assets/images/noBrake.png");
}else if(brake > 0 && brake <= 30){
img = require("../assets/images/startBrake.png");
}else if(brake > 0 && brake <= 100){
img = require("../assets/images/midBrake.png");
}else{
img = require("../assets/images/fullBrake.png");
}
return {
id: index,
name: pt.getDistance() + 'm',
coordinate: { latitude: pt.getGeo().getGpsLat(), longitude: pt.getGeo().getGpsLong() },
image: img,
};
});
@ -63,7 +77,7 @@ export default function Lap(props: { navigation: any, route : any}) {
</View>
</TouchableOpacity>
<Text style={styles.text_title}>Point {currentPointIndex + 1 } / { points.length } </Text>
<Text style={styles.text_title}>Point {currentPointIndex + 1 } </Text>
<TouchableOpacity style={[styles.LapBrowserButton, currentPointIndex === points.length - 1 ? styles.disabled : null]} onPress={goToNextPoint}>
<View>
@ -84,8 +98,8 @@ export default function Lap(props: { navigation: any, route : any}) {
longitudeDelta: 0.015,
}}
>
{markers.map(({ id, name, coordinate }) => (
<Marker key={id} title={name} coordinate={coordinate} onPress={() => handleMarker(id)} />
{markers.map(({ id, name, coordinate,image }) => (
<Marker key={id} title={name} coordinate={coordinate} onPress={() => handleMarker(id)} icon={image} style={{ width: 1, height: 1 }} />
))}
@ -116,7 +130,7 @@ export default function Lap(props: { navigation: any, route : any}) {
<View style={styles.infoContainer}>
<Text style={styles.infoItem}>nGear:</Text>
<Text style={styles.infoValue}>{currentPoint.getVCar()} gear</Text>
<Text style={styles.infoValue}>{currentPoint.getNGear()} gear</Text>
</View>
<View style={styles.infoContainer}>
@ -137,7 +151,7 @@ export default function Lap(props: { navigation: any, route : any}) {
</View>
<View style={styles.infoContainer}>
<Text style={styles.infoItem}>gLat:</Text>
<Text style={styles.infoValue}>{currentPoint.getGLong()} g</Text>
<Text style={styles.infoValue}>{currentPoint.getGLat()} g</Text>
</View>
</View>
</BackgroundImage>

@ -6,6 +6,7 @@ import {
Text,
View,
TouchableOpacity,
ActivityIndicator,
} from "react-native";
import { useDispatch, useSelector } from "react-redux";
import SessionListItem from "../components/SessionCmp";
@ -17,6 +18,7 @@ import { SESSIONS } from "../stub/stub";
export default function Session_browser(props: { navigation: any }) {
const { navigation } = props;
const [search, setSearch] = useState("");
const [loading, setLoading] = useState(false);
const handlePress = (item: Session) => {
setSearch("");
@ -28,8 +30,10 @@ export default function Session_browser(props: { navigation: any }) {
const dispatch = useDispatch();
useEffect(() => {
setLoading(true);
const loadTeams = async () => {
await dispatch(getSessionsList());
setLoading(false);
};
loadTeams();
}, [dispatch]);
@ -61,13 +65,17 @@ export default function Session_browser(props: { navigation: any }) {
value={search}
onChangeText={setSearch}
/>
<FlatList
data={filteredData}
renderItem={({ item }) => (
<SessionListItem session={item} onPress={handlePress} />
)}
keyExtractor={(Item) => Item.getName()}
/>
{loading ? (
<ActivityIndicator size="large" color="#BF181F" />
) : (
<FlatList
data={filteredData}
renderItem={({ item }) => (
<SessionListItem session={item} onPress={handlePress} />
)}
keyExtractor={(Item) => Item.getName()}
/>
)}
<TouchableOpacity
style={styles.addContainerButton}

Loading…
Cancel
Save