Skip to content

E
EmidWife-New
Commit 967efaa7 authored by isuraem's avatar isuraem
Browse files
Options

changes_on_the_exercise_view

parent 03d5b126
Hide whitespace changes
Inline Side-by-side
Showing with 193 additions and 106 deletions
App.js
View file @ 967efaa7
......@@ -7,14 +7,15 @@ LogBox.ignoreAllLogs();
const App = () => {
// Your Firebase project config
const firebaseConfig = {
apiKey: "AIzaSyDYUf2gYWwE_qvQk2e-8ErEZ_PYBZ7eX0o",
authDomain: "emidwife-382f9.firebaseapp.com",
databaseURL: "https://emidwife-382f9-default-rtdb.asia-southeast1.firebasedatabase.app",
projectId: "emidwife-382f9",
storageBucket: "emidwife-382f9.appspot.com",
messagingSenderId: "586342030256",
appId: "1:586342030256:web:a88085b0dd2a72a953d475"
apiKey: "AIzaSyCeAB4zi1RAoBPPJyE6qii36pz01tfKrYQ",
authDomain: "esp32-emidwife.firebaseapp.com",
databaseURL: "https://esp32-emidwife-default-rtdb.firebaseio.com",
projectId: "esp32-emidwife",
storageBucket: "esp32-emidwife.appspot.com",
messagingSenderId: "590307045316",
appId: "1:590307045316:web:3471bfeaec9f74f6dcbe91"
};
// Initialize Firebase
if (!firebase.apps.length) {
firebase.initializeApp(firebaseConfig);
......
src/constants/routes.js
View file @ 967efaa7
......@@ -23,5 +23,8 @@ export default {
EXERCISE_MAIN_NEW_MENU: 'Exercise_Home_New_Menu',
EXERCISE_VIEW: 'Exercise_View',
EXERCISE_ACTION_VIEW: 'Exercise_ACTION_View',
EXERCISE_PROGRESS: 'Exercise_PROGRESS'
EXERCISE_PROGRESS: 'Exercise_PROGRESS',
EXERCISE_NEW_VIEW: 'Exercise_NEW_View',
EXERCISE_NEW_ACTION_VIEW: 'Exercise_NEW_ACTION_View',
EXERCISE_NEW_PROGRESS: 'Exercise_NEW_PROGRESS'
};
src/navigations/ExerciseNavigator.js
View file @ 967efaa7
......@@ -69,6 +69,9 @@ function ExerciseNavigator() {
<Stack.Screen name={ROUTES.EXERCISE_WELCOME} component={WelcomeExercise} key="ExerciseWelcome" />
<Stack.Screen name={ROUTES.EXERCISE_FORM} component={HealthFormExercise} key="ExerciseForm" />
<Stack.Screen name={ROUTES.EXERCISE_MAIN_NEW_MENU} component={MainMenuExercise} key="MainMenuNewExercise" />
<Stack.Screen name={ROUTES.EXERCISE_NEW_VIEW} component={ExerciseView} key="ExerciseNewView" />
<Stack.Screen name={ROUTES.EXERCISE_NEW_ACTION_VIEW} component={ExerciseActionView} key="ExerciseActionNewView" />
<Stack.Screen name={ROUTES.EXERCISE_NEW_PROGRESS} component={ExercisesProgress} key="ExercisesNewProgress" />
</>
)}
</Stack.Navigator>
......
src/screens/home/exercise/ExerciseActionView.js
View file @ 967efaa7
import React, { useState, useRef, useEffect } from 'react';
import { StyleSheet, Text, View, ActivityIndicator, TouchableOpacity } from 'react-native';
import { StyleSheet, Text, View, ActivityIndicator, TouchableOpacity, ToastAndroid, Dimensions, SafeAreaView, ScrollView,FlatList } from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import Video from 'react-native-video';
import { Camera, useCameraDevice, CameraPermissionStatus } from 'react-native-vision-camera';
import CircleProgressBar from '../../../components/CircleProgressBar';
import { COLORS, ROUTES } from '../../../constants';
import Dot from '../../../assets/icons/dot.svg';
const { width } = Dimensions.get('window');
const cameraWidth = width * 0.8; // Example: 80% of the screen width
const cameraHeight = cameraWidth * (16 / 9); // Maintain 16:9 aspect ratio
const { height: screenHeight } = Dimensions.get('window');
const ExerciseView = (props) => {
const { route } = props;
const { data } = route.params; // Assuming you pass videoUrl as a route parameter
let { route, navigation } = props;
let { data } = route.params; // Assuming you pass videoUrl as a route parameter
const videoRef = useRef(null);
const cameraRef = useRef(null);
const [loading, setLoading] = useState(true);
......@@ -17,6 +22,7 @@ const ExerciseView = (props) => {
const [startCountDown, setStartCountDown] = useState(false);
const [isRecording, setIsRecording] = useState(false);
const [videoSource, setVideoSource] = useState('');
const [completeStatus, setCompleteStatus] = useState(false);
const device = useCameraDevice('front')
const handleLoad = () => {
......@@ -35,6 +41,19 @@ const ExerciseView = (props) => {
setVideoPaused(true);
};
const moveToNext = () => {
navigation.navigate(ROUTES.EXERCISE_MAIN_MENU)
ToastAndroid.show('Navigation successfully !', ToastAndroid.SHORT);
};
const handleStop = () => {
setRemainingTime(0);
setCompleteStatus(true)
navigation.navigate(ROUTES.EXERCISE_MAIN_MENU)
ToastAndroid.show('Navigation successfully !', ToastAndroid.SHORT);
};
const handleVideoEnd = () => {
setVideoPaused(true);
// setStartCountDown(true);
......@@ -56,14 +75,21 @@ const ExerciseView = (props) => {
},
});
}
};
const stopRecording = () => {
};
const stopRecording = () => {
if (cameraRef.current && isRecording) {
cameraRef.current.stopRecording();
setIsRecording(false);
cameraRef.current.stopRecording();
setIsRecording(false);
}
};
};
const renderStep = ({ item, index }) => (
<View style={styles.stepContainer}>
<Dot width={16} height={16} color={COLORS.primary} style={styles.dotIcon} />
<Text style={styles.stepItem}>{item.step}</Text>
</View>
);
useEffect(() => {
// Initialize remainingTime when component mounts
......@@ -94,11 +120,12 @@ const ExerciseView = (props) => {
return (
<View style={styles.container}>
<Text style={styles.title}>Exercise Details</Text>
<View style={styles.videoContainer}>
<Video
<SafeAreaView style={styles.container}>
<ScrollView style={{ height: screenHeight, paddingBottom: 30, marginBottom: 30 }}>
<Text style={styles.title}>Exercise Details</Text>
<View style={styles.videoContainer}>
<Video
ref={videoRef}
source={{ uri: data.exercise_video_url }}
style={styles.video}
......@@ -108,82 +135,57 @@ const ExerciseView = (props) => {
onLoad={handleLoad}
onBuffer={handleBuffer}
/>
{loading && <ActivityIndicator style={styles.loader} size="large" color="#0000ff" />}
</View>
<View style={styles.progressMainView}>
<CircleProgressBar percentage={(remainingTime / (data.duration * 2)) * 100} />
<View style={styles.progressSecondView}>
<Text>Remaining</Text>
<Text>{remainingTime} seconds</Text>
</View>
</View>
<View style={styles.buttonsContainer}>
<TouchableOpacity style={styles.button} onPress={videoPaused ? handlePlay : handlePause}>
<Text style={styles.buttonText}>{videoPaused ? 'Play' : 'Pause'}</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.buttonRed} onPress={handlePause}>
<Text style={styles.buttonText}>Stop</Text>
</TouchableOpacity>
</View>
<View>
{device != null && (
<View style={styles.cameraContainer}>
<Camera
ref={cameraRef}
style={styles.camera}
device={device}
isActive={true}
video={true}
audio={true}
/>
</View>
)}
</View>
{/* <View style={styles.videoContainer}>
<Video
ref={videoRef}
source={{ uri: data.exercise_video_url }}
style={styles.video}
controls={true}
paused={videoPaused}
resizeMode="contain"
onLoad={handleLoad}
onBuffer={handleBuffer}
onEnd={handleVideoEnd}
/>
{loading && <ActivityIndicator style={styles.loader} size="large" color="#0000ff" />}
<View style={styles.buttonsContainer}>
<TouchableOpacity style={styles.button} onPress={videoPaused ? handlePlay : handlePause}>
<Text style={styles.buttonText}>{videoPaused ? 'Play' : 'Pause'}</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.button} onPress={handlePause}>
<Text style={styles.buttonText}>Stop</Text>
</TouchableOpacity>
{loading && <ActivityIndicator style={styles.loader} size="large" color="#0000ff" />}
</View>
<View style={styles.progressMainView}>
<CircleProgressBar percentage={(remainingTime / data.duration) * 100} />
<CircleProgressBar percentage={(remainingTime / (data.duration * 2)) * 100} />
<View style={styles.progressSecondView}>
<Text>Remaining</Text>
<Text>{remainingTime} seconds</Text>
</View>
</View>
<View style={styles.stepsContainer}>
<Text style={styles.stepsTitle}>Steps:</Text>
<View style={styles.stepsContent}>
{data.exer_steps.map((step, index) => (
<View key={index} style={styles.stepContainer}>
<Dot width={16} height={16} color={COLORS.primary} style={styles.dotIcon} />
<Text style={styles.stepItem}>{step.step}</Text>
<View style={{ display: 'flex', justifyContent: 'center', flexDirection: 'row' }}>
{remainingTime > 0 &&
<View style={styles.buttonsContainer}>
<TouchableOpacity style={styles.button} onPress={videoPaused ? handlePlay : handlePause}>
<Text style={styles.buttonText}>{videoPaused ? 'Play' : 'Pause'}</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.buttonRed} onPress={moveToNext}>
<Text style={styles.buttonText}>Stop</Text>
</TouchableOpacity>
</View>
}
{(remainingTime <= 0 || completeStatus == true) &&
<View style={styles.loginBtnWrapper}>
<LinearGradient
colors={[COLORS.gradientForm, COLORS.bgColor]}
style={styles.linearGradient}
start={{ y: 0.0, x: 0.0 }}
end={{ y: 1.0, x: 0.0 }}>
{/******************** LOGIN BUTTON *********************/}
<TouchableOpacity activeOpacity={0.7} style={styles.loginBtn} onPress={moveToNext}>
<Text style={styles.loginText}>Move To Next</Text>
</TouchableOpacity>
</LinearGradient>
</View>
))}
}
</View>
</View>
</View> */}
</View>
<Text style={styles.title}>Exercise Preview</Text>
<View style={styles.cameraContainer}>
<Camera
ref={cameraRef}
style={styles.camera}
device={device}
isActive={true}
video={true}
audio={true}
ratio="16:9"
/>
</View>
</ScrollView>
</SafeAreaView>
);
};
......@@ -192,7 +194,6 @@ const styles = StyleSheet.create({
backgroundColor: '#fff',
alignItems: 'center',
width: '100%',
height: 'auto'
},
title: {
fontSize: 20,
......@@ -250,7 +251,7 @@ const styles = StyleSheet.create({
progressMainView: {
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-between',
justifyContent: 'space-around',
shadowColor: '#000',
shadowOffset: {
width: 2,
......@@ -260,7 +261,7 @@ const styles = StyleSheet.create({
shadowRadius: 3.84,
elevation: 5,
backgroundColor: COLORS.white,
marginHorizontal: 20,
marginHorizontal: 60,
borderRadius: 15,
marginTop: 20,
paddingVertical: 10,
......@@ -284,9 +285,8 @@ const styles = StyleSheet.create({
flexDirection: 'column',
},
stepContainer: {
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
marginBottom: 10,
},
dotIcon: {
......@@ -303,9 +303,52 @@ const styles = StyleSheet.create({
marginHorizontal: 5,
},
cameraContainer: {
display: 'flex',
width: width,
marginTop: 5,
justifyContent: 'center',
alignItems: 'center'
},
camera: {
width: cameraWidth,
height: cameraHeight,
justifyContent: 'flex-end',
alignItems: 'center',
},
// Login Btn Styles
loginBtnWrapper: {
height: 55,
marginTop: 25,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: 0.4,
shadowRadius: 3,
elevation: 5,
width: "80%",
marginLeft: "10%"
},
linearGradient: {
width: '100%',
aspectRatio: 16 / 9,
marginTop: 20,
borderRadius: 50,
},
loginBtn: {
textAlign: 'center',
justifyContent: 'center',
alignItems: 'center',
width: '100%',
height: 55,
},
loginText: {
color: COLORS.white,
fontSize: 16,
fontWeight: '400',
},
horizontalFlatList: {
flexDirection: 'row',
flexWrap: 'wrap',
},
});
......@@ -390,15 +433,15 @@ export default ExerciseView;
// </View>
// </View>
// <View style={styles.stepsContainer}>
// <Text style={styles.stepsTitle}>Steps:</Text>
// {data.exer_steps.map((step, index) => (
// <View key={index} style={styles.stepContainer}>
// {index !== 0 && <View style={styles.line} />}
// <Dot width={16} height={16} color={COLORS.primary} style={styles.dotIcon} />
// {/* {index < data.exer_steps.length - 1 && <View style={styles.line}></View>} */}
// <Text style={styles.stepItem}>{step.step}</Text>
// </View>
// ))}
// <Text style={styles.stepsTitle}>Steps:</Text>
// {data.exer_steps.map((step, index) => (
// <View key={index} style={styles.stepContainer}>
// {index !== 0 && <View style={styles.line} />}
// <Dot width={16} height={16} color={COLORS.primary} style={styles.dotIcon} />
// {/* {index < data.exer_steps.length - 1 && <View style={styles.line}></View>} */}
// <Text style={styles.stepItem}>{step.step}</Text>
// </View>
// ))}
// </View>
// </View>
......@@ -809,3 +852,36 @@ export default ExerciseView;
// });
// export default ExerciseView;
{/* <FlatList
data={[...data.exer_steps, { isCamera: true }]} // Adding a placeholder for the camera view
renderItem={({ item, index }) => (
item.isCamera ? (
<View style={styles.cameraContainer}>
<Camera
ref={cameraRef}
style={styles.camera}
device={device}
isActive={true}
video={true}
audio={true}
ratio="16:9"
/>
</View>
) : (
<View style={{ marginHorizontal: 5 }}>
{data.exer_steps.map((step, index) => (
<View key={index} style={styles.stepContainer}>
<Dot width={16} height={16} color={COLORS.primary} style={styles.dotIcon} />
<Text style={styles.stepItem}>{step.step}</Text>
</View>
))}
</View>
)
)}
keyExtractor={(item, index) => index.toString()}
horizontal
showsHorizontalScrollIndicator={false}
contentContainerStyle={styles.horizontalFlatList}
/> */}
\ No newline at end of file
src/screens/home/exercise/HealthFormExercise.js
View file @ 967efaa7
......@@ -75,7 +75,7 @@ const HealthFormExercise = (props) => {
if (responds.data) {
try {
await AsyncStorage.setItem('userData', JSON.stringify(userData));
navigation.navigate(ROUTES.EXERCISE_MAIN_MENU)
navigation.navigate(ROUTES.EXERCISE_MAIN_NEW_MENU)
ToastAndroid.show('userData updated successfully !', ToastAndroid.SHORT);
} catch (error) {
ToastAndroid.show('Error updating userData !', ToastAndroid.SHORT);
......@@ -163,6 +163,7 @@ const HealthFormExercise = (props) => {
</TouchableOpacity>
<TouchableOpacity
onPress={() => {
setIsWearbleDevice(false)
setWearableModalVisible(false);
}}
......
src/screens/home/exercise/MainMenuExercise.js
View file @ 967efaa7
......@@ -94,9 +94,11 @@ const MainMenuExercise = (props) => {
dataNum = 2;
}
if (todayDateByFormat === "Friday" || todayDateByFormat === "Saturday" || todayDateByFormat === "Sunday") {
dataNum = 2;
dataNum = 3;
}
console.log("data",userData._id, dataNum)
let exerciseData = await getAllExerciseDay(userData._id, dataNum);
console.log("dAT",exerciseData.data.data)
let dataArray = exerciseData.data.data;
if (dataArray.length > 0) {
let exerciseModifiedAarray = [];
......@@ -138,6 +140,7 @@ const MainMenuExercise = (props) => {
useEffect(() => {
retriveExerciseList()
setSelectedId(null)
}, [])
return (
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment