Commit 6e521176 authored by Malsha Jayakody's avatar Malsha Jayakody

change UIs

parent 66b6c0b7
/* eslint-disable react-native/no-inline-styles */
import React from 'react';
import {
ScrollView,
ImageBackground,
Dimensions,
Text,
View,
StyleSheet,
TouchableOpacity,
} from 'react-native';
import {COLORS, IMGS, ROUTES} from '../../../constants';
import {IMGS, ROUTES} from '../../../constants';
const ChooseGame = ({navigation, route}) => {
const {predictedGameLevel} = route.params;
......@@ -134,7 +132,6 @@ const styles = StyleSheet.create({
brandViewText: {
color: '#FFFFFF',
fontSize: 40,
// fontWeight: 'bold',
},
bottomView: {
flex: 1.5,
......
import React from 'react';
import {View, StyleSheet, TouchableOpacity, Text} from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import {COLORS, IMGS, ROUTES} from '../../../constants';
import {COLORS, ROUTES} from '../../../constants';
const GameLevelPage = ({route, navigation}) => {
const {predictedGameLevel} = route.params;
......@@ -27,17 +27,28 @@ const GameLevelPage = ({route, navigation}) => {
</View>
<View style={styles.diamondContainer}>
<View style={styles.innerCircle}>
<Text style={styles.scoreText}>
{predictedGameLevel === 0 ? '2' : predictedGameLevel}
<Text
style={{
color: '#ffffff',
fontSize: predictedGameLevel === 0 ? 20 : 100,
fontWeight: 'bold',
}}>
{predictedGameLevel === 0 ? 'No Depression' : predictedGameLevel}
</Text>
</View>
</View>
<TouchableOpacity
style={styles.button}
onPress={() =>
navigation.navigate(ROUTES.CHOOSE_GAME, {predictedGameLevel})
}>
<Text style={styles.buttonText}>Choose a Game</Text>
onPress={() => {
if (predictedGameLevel === 0) {
navigation.navigate(ROUTES.GAME_WELCOME);
} else {
navigation.navigate(ROUTES.CHOOSE_GAME, {predictedGameLevel});
}
}}>
<Text style={styles.buttonText}>
{predictedGameLevel === 0 ? 'Exit' : 'Choose a Game'}
</Text>
</TouchableOpacity>
</View>
</LinearGradient>
......
......@@ -9,6 +9,7 @@ import {
ScrollView,
} from 'react-native';
import {ROUTES, COLORS} from '../../../constants';
import LinearGradient from 'react-native-linear-gradient';
const MainDetailsForm = ({navigation}) => {
const [maritalStatus, setMaritalStatus] = useState('single');
......@@ -64,7 +65,13 @@ const MainDetailsForm = ({navigation}) => {
return (
<>
<ScrollView style={styles.container}>
<View style={styles.bottomView}>
<LinearGradient
style={{
flex: 1,
width: '100%',
height: '100%',
}}
colors={[COLORS.light_purple, COLORS.white, COLORS.rose]}>
<View style={{padding: 25}}>
<View
style={{
......@@ -86,39 +93,6 @@ const MainDetailsForm = ({navigation}) => {
Please answer for this questions
</Text>
</View>
{/* <View style={{marginTop: 5}}>
<Text
semi
style={{
fontSize: 15,
fontWeight: 'bold',
marginTop: 10,
color: COLORS.black,
}}>
Your Name:
</Text>
<TextInput
style={{
backgroundColor: '#ffffff',
borderRadius: 15,
height: 48,
marginBottom: 10,
marginTop: 10,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 8,
},
shadowOpacity: 0.46,
shadowRadius: 11.14,
fontSize: 13,
color: COLORS.black,
elevation: 17,
}}
// value={value}
// onChangeText={(text) => setValue(text)}
/>
</View> */}
<View style={{marginTop: 15}}>
<Text
semi
......@@ -246,7 +220,7 @@ const MainDetailsForm = ({navigation}) => {
<View style={{marginTop: 55}}>
<TouchableOpacity
style={{
backgroundColor: COLORS.normal_purple,
backgroundColor: COLORS.pastal_blue,
height: 50,
marginBottom: 20,
justifyContent: 'center',
......@@ -281,13 +255,14 @@ const MainDetailsForm = ({navigation}) => {
style={{
color: COLORS.white,
fontSize: 20,
fontWeight: 700,
}}>
Next
</Text>
</TouchableOpacity>
</View>
</View>
</View>
</LinearGradient>
</ScrollView>
</>
);
......
......@@ -9,6 +9,7 @@ import {
ScrollView,
} from 'react-native';
import {ROUTES, COLORS} from '../../../constants';
import LinearGradient from 'react-native-linear-gradient';
const MainDetailsFormInSinhala = ({navigation}) => {
const [maritalStatus, setMaritalStatus] = useState('single');
......@@ -64,7 +65,13 @@ const MainDetailsFormInSinhala = ({navigation}) => {
return (
<>
<ScrollView style={styles.container}>
<View style={styles.bottomView}>
<LinearGradient
style={{
flex: 1,
width: '100%',
height: '100%',
}}
colors={[COLORS.light_purple, COLORS.white, COLORS.rose]}>
<View style={{padding: 25}}>
<View
style={{
......@@ -86,39 +93,6 @@ const MainDetailsFormInSinhala = ({navigation}) => {
කරුණාකර මෙම ප්‍රශ්න සඳහා පිළිතුරු සපයන්න
</Text>
</View>
{/* <View style={{marginTop: 5}}>
<Text
semi
style={{
fontSize: 15,
fontWeight: 'bold',
marginTop: 10,
color: COLORS.black,
}}>
ඔබගේ නම:
</Text>
<TextInput
style={{
backgroundColor: '#ffffff',
borderRadius: 15,
height: 48,
marginBottom: 10,
marginTop: 10,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 8,
},
shadowOpacity: 0.46,
shadowRadius: 11.14,
fontSize: 13,
color: COLORS.black,
elevation: 17,
}}
// value={value}
// onChangeText={(text) => setValue(text)}
/>
</View> */}
<View style={{marginTop: 15}}>
<Text
semi
......@@ -247,7 +221,7 @@ const MainDetailsFormInSinhala = ({navigation}) => {
<View style={{marginTop: 35}}>
<TouchableOpacity
style={{
backgroundColor: COLORS.normal_purple,
backgroundColor: COLORS.pastal_blue,
height: 50,
marginBottom: 10,
justifyContent: 'center',
......@@ -288,7 +262,7 @@ const MainDetailsFormInSinhala = ({navigation}) => {
</TouchableOpacity>
</View>
</View>
</View>
</LinearGradient>
</ScrollView>
</>
);
......@@ -304,8 +278,6 @@ const styles = StyleSheet.create({
flex: 1,
height: 860,
backgroundColor: COLORS.purple,
// borderTopStartRadius: 30,
// borderTopEndRadius: 30,
},
radioContainer: {
flexDirection: 'row',
......
......@@ -4,13 +4,12 @@ import {
View,
StyleSheet,
TouchableOpacity,
ScrollView,
Text,
ActivityIndicator,
} from 'react-native';
import axios from 'axios';
import {useNavigation} from '@react-navigation/native';
import {COLORS, IMGS, ROUTES} from '../../../constants';
import {COLORS, ROUTES} from '../../../constants';
import RadioButton from '../../../components/RadioButton';
import LinearGradient from 'react-native-linear-gradient';
......@@ -46,18 +45,16 @@ const QuestionInEnglishPage = ({navigation, route}) => {
const loadData = () => {
axios
// .get('http://192.168.8.161:8070/api/quiz/all_english')
.get('http://16.16.97.48/api/quiz/all_english')
.then(response => {
// console.log(response.data);
setQuestions(response.data.data);
setIsLoading(false);
})
.catch(error => {
console.error(error);
2;
setIsLoading(false); // Ensure loading is set to false even if there's an error
// Ensure loading is set to false even if there's an error
setIsLoading(false);
});
};
const handleNext = () => {
......@@ -75,8 +72,6 @@ const QuestionInEnglishPage = ({navigation, route}) => {
const isOnFirstQuestions = questionIndex === 0;
const isOnLastQuestions = questionIndex >= questions.length - 2;
const appNavigation = useNavigation();
// Handle navigation to the "Quiz Score" page and pass the totalScore as a parameter
const handleNavigationToQuizScore = () => {
// Create a new object that includes all the formData fields and adds the totalScore as depression_level
......@@ -117,7 +112,7 @@ const QuestionInEnglishPage = ({navigation, route}) => {
}}>
<Text
style={{
color: '#DE3163',
color: COLORS.pastal_blue,
fontSize: 22,
fontWeight: 'bold',
}}>
......@@ -127,7 +122,7 @@ const QuestionInEnglishPage = ({navigation, route}) => {
<View
style={{
backgroundColor: 'white',
borderColor: '#FFC107', // Add this line to set the border color
borderColor: COLORS.pink,
borderWidth: 3,
borderRadius: 17,
marginTop: 5,
......@@ -150,8 +145,8 @@ const QuestionInEnglishPage = ({navigation, route}) => {
</View>
<View
style={{
marginTop: 30,
gap: 2,
marginTop: 10,
gap: 3,
marginBottom: 5,
color: 'black',
marginRight: 25,
......@@ -205,13 +200,13 @@ const QuestionInEnglishPage = ({navigation, route}) => {
style={{
flexDirection: 'row',
justifyContent: 'space-between',
marginTop: 25,
marginBottom: 50,
marginTop: 50,
marginBottom: 30,
}}>
{!isOnFirstQuestions && (
<TouchableOpacity
style={{
backgroundColor: '#DE3163',
backgroundColor: COLORS.pastal_blue,
height: 50,
justifyContent: 'center',
alignItems: 'center',
......@@ -237,7 +232,7 @@ const QuestionInEnglishPage = ({navigation, route}) => {
{!isOnLastQuestions && (
<TouchableOpacity
style={{
backgroundColor: '#DE3163',
backgroundColor: COLORS.pastal_blue,
height: 50,
justifyContent: 'center',
alignItems: 'center',
......@@ -263,7 +258,7 @@ const QuestionInEnglishPage = ({navigation, route}) => {
{isOnLastQuestions && (
<TouchableOpacity
style={{
backgroundColor: '#116A7B',
backgroundColor: '#DE3163',
height: 50,
justifyContent: 'center',
alignItems: 'center',
......
......@@ -4,13 +4,12 @@ import {
View,
StyleSheet,
TouchableOpacity,
ScrollView,
Text,
ActivityIndicator,
} from 'react-native';
import axios from 'axios';
import {useNavigation} from '@react-navigation/native';
import {COLORS, IMGS, ROUTES} from '../../../constants';
import {COLORS, ROUTES} from '../../../constants';
import RadioButton from '../../../components/RadioButton';
import LinearGradient from 'react-native-linear-gradient';
......@@ -46,7 +45,6 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
const loadData = () => {
axios
// .get('http://192.168.8.161:8070/api/quiz/all_sinhala')
.get('http://16.16.97.48/api/quiz/all_sinhala')
.then(response => {
setQuestions(response.data.data);
......@@ -72,8 +70,6 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
const isOnFirstQuestions = questionIndex === 0;
const isOnLastQuestions = questionIndex >= questions.length - 2;
const appNavigation = useNavigation();
// Handle navigation to the "Quiz Score" page and pass the totalScore as a parameter
const handleNavigationToQuizScore = () => {
const updatedFormData = {
......@@ -113,7 +109,7 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
}}>
<Text
style={{
color: '#DE3163',
color: COLORS.pastal_blue,
fontSize: 22,
fontWeight: 'bold',
}}>
......@@ -123,7 +119,7 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
<View
style={{
backgroundColor: 'white',
borderColor: '#FFC107', // Add this line to set the border color
borderColor: COLORS.pink,
borderWidth: 3,
borderRadius: 17,
marginTop: 5,
......@@ -146,9 +142,9 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
</View>
<View
style={{
marginTop: 30,
gap: 2,
marginBottom: 5,
marginTop: 1,
gap: 3,
marginBottom: 1,
color: 'black',
marginRight: 25,
}}>
......@@ -201,13 +197,13 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
style={{
flexDirection: 'row',
justifyContent: 'space-between',
marginTop: 25,
marginBottom: 50,
marginTop: 50,
marginBottom: 30,
}}>
{!isOnFirstQuestions && (
<TouchableOpacity
style={{
backgroundColor: '#DE3163',
backgroundColor: COLORS.pastal_blue,
height: 50,
justifyContent: 'center',
alignItems: 'center',
......@@ -233,7 +229,7 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
{!isOnLastQuestions && (
<TouchableOpacity
style={{
backgroundColor: '#DE3163',
backgroundColor: COLORS.pastal_blue,
height: 50,
justifyContent: 'center',
alignItems: 'center',
......@@ -259,7 +255,7 @@ const QuestionInSinhalaPage = ({navigation, route}) => {
{isOnLastQuestions && (
<TouchableOpacity
style={{
backgroundColor: '#116A7B',
backgroundColor: '#DE3163',
height: 50,
justifyContent: 'center',
alignItems: 'center',
......
/* eslint-disable react-native/no-inline-styles */
import React from 'react';
import {
ScrollView,
ImageBackground,
Text,
Image,
View,
StyleSheet,
TouchableOpacity,
} from 'react-native';
import {COLORS, IMGS, ROUTES} from '../../../constants';
import {Text, Image, View, StyleSheet, TouchableOpacity} from 'react-native';
import {COLORS, ROUTES} from '../../../constants';
const QuizOptionsPage = ({navigation}) => {
return (
......
......@@ -8,11 +8,9 @@ import {
ActivityIndicator,
} from 'react-native';
import {COLORS, IMGS, ROUTES} from '../../../constants';
import axios from 'axios';
import {gameLevelPredict} from '../../../services/games';
const QuizScoreDisplayPage = ({route, navigation}) => {
// const {score} = route.params;
const {formData} = route.params || {
formData: {},
};
......@@ -43,10 +41,10 @@ const QuizScoreDisplayPage = ({route, navigation}) => {
musicFields[musicKeys[randomIndex]] = 1;
try {
const response = await gameLevelPredict(
formData.age, // Assuming formData contains 'age'
formData.depression_level, // Passed from previous screen
formData.previous_child_birth_experiences, // Assuming formData contains 'previous_child_birth_experiences'
formData.marital_status_divorced, // Assuming formData contains boolean values for these fields
formData.age,
formData.depression_level,
formData.previous_child_birth_experiences,
formData.marital_status_divorced,
formData.marital_status_married,
formData.marital_status_single,
formData.family_background_bad,
......@@ -99,7 +97,6 @@ const QuizScoreDisplayPage = ({route, navigation}) => {
<TouchableOpacity
style={styles.button}
onPress={handleChooseGamePress}>
{/* onPress={() => navigation.navigate(ROUTES.Level01Instructions)}> */}
<Text bold medium center style={styles.buttonText}>
Check Your Gaming Level
</Text>
......
......@@ -2,7 +2,6 @@
import React from 'react';
import {Image, TouchableOpacity, Text, View} from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import Button from '../../../components/Button';
import {COLORS, IMGS, ROUTES} from '../../../constants';
const WelcomePageGame = ({navigation}) => {
......
......@@ -13,6 +13,17 @@ import Sound from 'react-native-sound';
// A simple array of names, meanings, and origins for demonstration
const namesData = [
{name: 'Yasas', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Sama', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Dilshan', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Poorna', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Parami', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Randi', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Isura', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Devin', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Lili', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Ann', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Amara', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Kisuri', meaning: 'Fame, Glory', origin: 'Sinhalese'},
{name: 'Ashan', meaning: 'Eternal, Immortal', origin: 'Sinhalese'},
{name: 'Nirmala', meaning: 'Pure, Clean', origin: 'Sinhalese'},
{name: 'Tharaka', meaning: 'Star', origin: 'Sinhalese'},
......
......@@ -92,26 +92,34 @@ const Game02Level04 = ({navigation}) => {
const foundLadyItem = ladyItems.find(item => item.x === x && item.y === y);
if (foundBabyItemIndex !== -1) {
setCollectedItems(currentItems => [...currentItems, `${x},${y}`]); // Use position as a unique identifier
Alert.alert('Good job!', 'You found a baby item!');
// Update the collected items and perform checks inside the update callback
setCollectedItems(currentItems => {
const updatedItems = [...currentItems, `${x},${y}`];
// Remove the found baby item from the array to prevent recounting
const newBabyItems = [...babyItems];
newBabyItems.splice(foundBabyItemIndex, 1);
setBabyItems(newBabyItems);
// Check if two baby items have been collected
if (collectedItems.length + 1 >= 2) {
Alert.alert('Good job!', 'You found a baby item!', [
// Check if the last baby item has been collected
if (updatedItems.length >= 2) {
// This is the last item; show only the congratulations message
Alert.alert('Congratulations 🥳🥳! You won the game.', '', [
{
text: 'OK',
onPress: () => {
navigation.navigate(ROUTES.Game02ProgressLevel02);
backgroundMusic.current.setVolume(0.0);
},
},
]);
backgroundMusic.current.setVolume(0.0);
} else {
// Not the last item, show the generic good job message
Alert.alert('Good job!', 'You found a baby item!');
}
return updatedItems;
});
} else if (foundLadyItem) {
Alert.alert('Oops!', "This is a lady's item. Try again!", [
{
......@@ -151,7 +159,11 @@ const Game02Level04 = ({navigation}) => {
<Text
medium
center
style={{color: 'black', fontSize: 30, fontWeight: 'bold'}}>
style={{
color: 'black',
fontSize: 30,
fontWeight: 'bold',
}}>
{isMuted ? '🔇' : '🔊'}
</Text>
</TouchableOpacity>
......
......@@ -29,7 +29,6 @@ const Game02Level05 = ({navigation}) => {
{x: 6, y: 1, type: 'ladyItem', image: IMGS.game_img_38},
]);
const [selectedCandy, setSelectedCandy] = useState(null);
const backgroundMusic = useRef(null);
const [isMuted, setIsMuted] = useState(false);
......@@ -93,26 +92,36 @@ const Game02Level05 = ({navigation}) => {
const foundLadyItem = ladyItems.find(item => item.x === x && item.y === y);
if (foundBabyItemIndex !== -1) {
setCollectedItems(currentItems => [...currentItems, `${x},${y}`]); // Use position as a unique identifier
Alert.alert('Good job!', 'You found a baby item!');
// Remove the found baby item from the array to prevent recounting
// Prepare the updated list of baby items by removing the found item
const newBabyItems = [...babyItems];
newBabyItems.splice(foundBabyItemIndex, 1);
setBabyItems(newBabyItems);
// Check if two baby items have been collected
if (collectedItems.length + 1 >= 3) {
Alert.alert('Good job!', 'You found a baby item!', [
// Update the collected items state
setCollectedItems(currentItems => {
const updatedItems = [...currentItems, `${x},${y}`];
// Check if all baby items have been collected (assuming total items needed to win is 3)
if (updatedItems.length === 3) {
// Show only the congratulations message when the last item is collected
Alert.alert('Congratulations 🥳🥳! You won the game!', '', [
{
text: 'OK',
onPress: () => {
navigation.navigate(ROUTES.Game02ProgressLevel04);
backgroundMusic.current.setVolume(0.0);
},
},
]);
backgroundMusic.current.setVolume(0.0);
} else {
// Show this alert if there are still items left to collect
Alert.alert('Good job!', 'You found a baby item!');
}
return updatedItems;
});
// Update the baby items array state
setBabyItems(newBabyItems);
} else if (foundLadyItem) {
Alert.alert('Oops!', "This is a lady's item. Try again!", [
{
......@@ -151,7 +160,11 @@ const Game02Level05 = ({navigation}) => {
<Text
medium
center
style={{color: 'black', fontSize: 30, fontWeight: 'bold'}}>
style={{
color: 'black',
fontSize: 30,
fontWeight: 'bold',
}}>
{isMuted ? '🔇' : '🔊'}
</Text>
</TouchableOpacity>
......
......@@ -32,7 +32,6 @@ const Game02Level06 = ({navigation}) => {
{x: 2, y: 5, type: 'ladyItem', image: IMGS.game_img_29},
]);
const [selectedCandy, setSelectedCandy] = useState(null);
const backgroundMusic = useRef(null);
const [isMuted, setIsMuted] = useState(false);
......@@ -50,8 +49,8 @@ const Game02Level06 = ({navigation}) => {
backgroundMusic.current.setNumberOfLoops(-1);
},
);
return () => backgroundMusic.current.release(); // Release the audio player resource when the component unmounts
// Release the audio player resource when the component unmounts
return () => backgroundMusic.current.release();
}, []);
const toggleMute = () => {
......@@ -96,17 +95,18 @@ const Game02Level06 = ({navigation}) => {
const foundLadyItem = ladyItems.find(item => item.x === x && item.y === y);
if (foundBabyItemIndex !== -1) {
setCollectedItems(currentItems => [...currentItems, `${x},${y}`]); // Use position as a unique identifier
Alert.alert('Good job!', 'You found a baby item!');
// Remove the found baby item from the array to prevent recounting
const newBabyItems = [...babyItems];
newBabyItems.splice(foundBabyItemIndex, 1);
setBabyItems(newBabyItems);
// Check if two baby items have been collected
if (collectedItems.length + 1 >= 4) {
Alert.alert('Congratulations 🥳🥳! You won the game.', [
// Use position as a unique identifier and update the collected items
setCollectedItems(currentItems => {
const updatedItems = [...currentItems, `${x},${y}`];
// Check if all baby items have been collected
if (updatedItems.length >= 4) {
Alert.alert('Congratulations 🥳🥳!', 'You won the game.', [
{
text: 'OK',
onPress: () => {
......@@ -115,7 +115,12 @@ const Game02Level06 = ({navigation}) => {
},
]);
backgroundMusic.current.setVolume(0.0);
} else {
Alert.alert('Good job!', 'You found a baby item!');
}
return updatedItems;
});
} else if (foundLadyItem) {
Alert.alert('Oops!', "This is a lady's item. Try again!", [
{
......@@ -128,10 +133,6 @@ const Game02Level06 = ({navigation}) => {
}
};
const resetGame = () => {
setPlayerPosition({x: 0, y: 0});
setCollectedItems([]);
};
return (
<ImageBackground
source={IMGS.game_img_45}
......
......@@ -32,7 +32,6 @@ const Game02Level07 = ({navigation}) => {
{x: 2, y: 7, type: 'ladyItem', image: IMGS.game_img_29},
]);
const [selectedCandy, setSelectedCandy] = useState(null);
const backgroundMusic = useRef(null);
const [isMuted, setIsMuted] = useState(false);
......@@ -89,11 +88,6 @@ const Game02Level07 = ({navigation}) => {
checkForItem(newX, newY);
};
const resetGame = () => {
setPlayerPosition({x: 0, y: 0});
setCollectedItems([]);
};
const checkForItem = (x, y) => {
const foundBabyItemIndex = babyItems.findIndex(
item => item.x === x && item.y === y,
......@@ -101,33 +95,41 @@ const Game02Level07 = ({navigation}) => {
const foundLadyItem = ladyItems.find(item => item.x === x && item.y === y);
if (foundBabyItemIndex !== -1) {
setCollectedItems(currentItems => [...currentItems, `${x},${y}`]); // Use position as a unique identifier
Alert.alert('Good job!', 'You found a baby item!');
// Use position as a unique identifier and update the collected items
setCollectedItems(currentItems => {
const updatedItems = [...currentItems, `${x},${y}`];
// Remove the found baby item from the array to prevent recounting
const newBabyItems = [...babyItems];
newBabyItems.splice(foundBabyItemIndex, 1);
setBabyItems(newBabyItems);
// Check if two baby items have been collected
if (collectedItems.length + 1 >= 4) {
Alert.alert('Congratulations 🥳🥳! You won the game.', [
// Check if all baby items have been collected (assuming total items needed to win is 3)
if (updatedItems.length >= 4) {
// Only show the congratulations message when the last item is collected
Alert.alert('Congratulations 🥳🥳! You won the game.', '', [
{
text: 'OK',
onPress: () => {
navigation.navigate(ROUTES.Game02ProgressLevel02);
backgroundMusic.current.setVolume(0.0);
},
},
]);
backgroundMusic.current.setVolume(0.0);
} else {
// This alert is for collecting but not finishing the game
Alert.alert('Good job!', 'You found a baby item!');
}
return updatedItems;
});
} else if (foundLadyItem) {
Alert.alert('Oops!', "This is a lady's item. Try again!", [
{
text: 'OK',
onPress: () => {
navigation.navigate(ROUTES.GAME_QUIZ_OPTIONS);
},
// onPress: () => {
// navigation.navigate(ROUTES.GAME_QUIZ_OPTIONS);
// },
},
]);
}
......
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