Skip to content

Commit

Permalink
fix(gamescreen): deleted rolling effect + refactor fetching scheme (#61)
Browse files Browse the repository at this point in the history 
* fix(gamescreen): deleted rolling effect + refactor fetching scheme

* fix(deadcode): removed dead code in gamescreen
  • Loading branch information
@arenault-pass
arenault-pass authored Mar 31, 2024
1 parent 297c67f commit f206613
Show file tree
Hide file tree
Showing 4 changed files with 79 additions and 98 deletions.
3 changes: 2 additions & 1 deletion .maestro/launchGame.yml
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
appId: com.axe.l.r.drinkup
---
- launchApp
- tapOn: "drinkup on MacBook-Pro-de-Axel.local"
- tapOn: # Open the server in
point: "50%,26%"
- tapOn: "LANCER LA PARTIE"

- assertVisible: "LOBBY"
Expand Down
8 changes: 4 additions & 4 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,17 +17,17 @@
"@react-navigation/native-stack": "^6.9.17",
"eas-cli": "^7.3.0",
"expo": "~49.0.15",
"expo-status-bar": "~1.11.1",
"expo-status-bar": "~1.6.0",
"mongodb": "^6.3.0",
"mongoose": "^8.2.0",
"nativewind": "^2.0.11",
"react": "18.2.0",
"react-native": "0.72.10",
"react-native-heroicons": "^4.0.0",
"react-native-progress": "^5.0.1",
"react-native-safe-area-context": "4.9.0",
"react-native-screens": "~3.29.0",
"react-native-svg": "14.1.0",
"react-native-safe-area-context": "4.6.3",
"react-native-screens": "~3.22.0",
"react-native-svg": "13.9.0",
"tailwindcss": "3.3.2"
},
"devDependencies": {
Expand Down
134 changes: 57 additions & 77 deletions screens/Gamescreen.js
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
import {
View,
Text,
FlatList,
TouchableOpacity,
ImageBackground,
} from "react-native";
import React, { useEffect, useState } from "react";
import { ActivityIndicator } from "react-native"
import { ActivityIndicator } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
import { StatusBar } from "expo-status-bar";
import AsyncStorage from "@react-native-async-storage/async-storage";
Expand All @@ -16,41 +15,35 @@ import * as Progress from "react-native-progress";
import { useImage } from "../provider/ImageContext";

export default function Gamescreen() {
const [isLoading, setIsLoading] = useState(false);
const [questions, setQuestions] = useState([]);
const [currentQuestionIndex, setCurrentQuestionIndex] = useState(0);
const [players, setPlayers] = useState([]);
const port = 3000;
const { backgroundImageSource } = useImage();

useEffect(() => {
fetchQuestions();
fetchPlayers();
fetchQuestionsAndPlayers();
}, []); // Fetch questions and players initially

const fetchQuestions = () => {
fetch(`http://192.168.1.66:${port}/api/questions`)
.then((response) => response.json())
.then((data) => {
const shuffledQuestions = shuffledArray(data);
setQuestions(shuffledQuestions);
console.log("Success fetching questions from API");
})
.catch((error) => {
console.error("Error fetching questions from API:", error);
});
};

const fetchPlayers = () => {
AsyncStorage.getItem("players")
.then((playerData) => {
const parsedPlayers = JSON.parse(playerData) || [];
const shuffledPlayers = shuffledArray(parsedPlayers);
setPlayers(shuffledPlayers);
console.log("Success fetching player from asyncStorage");
})
.catch((error) => {
console.error("Error fetching questions from API:", error);
});
const fetchQuestionsAndPlayers = async () => {
setIsLoading(true);
try {
// Fetch and shuffle questions
const questionsResponse = await fetch(`http://192.168.1.99:${port}/api/questions`);
const questionsData = await questionsResponse.json();
const shuffledQuestions = shuffledArray(questionsData);
setQuestions(shuffledQuestions);

// Fetch and shuffle players
const playerData = await AsyncStorage.getItem("players");
const parsedPlayers = JSON.parse(playerData) || [];
const shuffledPlayers = shuffledArray(parsedPlayers);
setPlayers(shuffledPlayers);
} catch (error) {
console.error("Error fetching data:", error);
}
setIsLoading(false);
};

const shuffledArray = (array) => {
Expand All @@ -67,47 +60,12 @@ export default function Gamescreen() {

const handleNextRound = () => {
if (currentQuestionIndex + 1 >= questions.length) {
// No more questions, navigate to Endscreen
// No more questions, navigate to Endscreen or reset for a new game
navigation.navigate("End");
} else {
// Fetch new questions and players for the next round
fetchQuestions();
fetchPlayers();
// Update the current question index
setCurrentQuestionIndex((prevIndex) => prevIndex + 1);
}
};

const renderQuestion = ({ item }) => {
if (questions.length === 0 || players.length === 0) {
return null; // or loading indicator
}

console.log("rendering questions start");

const currentPlayer = players[currentQuestionIndex % players.length];

if (!item) {
// No more questions, navigate to Endscreen
navigation.navigate("End");
return null;
// Increment index to move to the next question
setCurrentQuestionIndex(currentQuestionIndex + 1);
}

return (
<View className="items-center">
<View className="bg-white rounded-2xl px-2">
<Text className=" text-cyan-700 font-semibold text-center text-xs">
Thème : {item.Theme}
</Text>
</View>
<Text className="text-3xl text-white font-black p-4">
{currentPlayer.name}
</Text>
<Text className="text-white font-semibold text-center text-sm">
{item.Questions}
</Text>
</View>
);
};

const navigation = useNavigation();
Expand All @@ -132,7 +90,12 @@ export default function Gamescreen() {
className="absolute left-8"
onPress={goToHomescreen}
>
<HomeIcon color="white" size="30" className="" testID="homeButton" />
<HomeIcon
color="white"
size="30"
className=""
testID="homeButton"
/>
</TouchableOpacity>
<Text className="text-white absolute right-28 text-2xl font-black">
DRINK'UP
Expand All @@ -156,22 +119,39 @@ export default function Gamescreen() {
{/* Game component */}
<View
style={{ backgroundColor: "rgba(255, 255, 255, 0.1)" }}
className=" flex m-10 p-10 mx-4 rounded-lg items-center"
className="flex m-10 p-10 mx-4 rounded-lg items-center"
>
{questions.length > 0 ? (
<FlatList
horizontal={false}
data={[questions[currentQuestionIndex]]}
keyExtractor={(item) => item._id.toString()}
renderItem={renderQuestion}
/>
{!isLoading && questions.length > 0 && players.length > 0 ? (
(() => {
const item = questions[currentQuestionIndex];
const currentPlayer =
players[currentQuestionIndex % players.length];
return (
<View className="items-center">
<View className="bg-white rounded-2xl px-2">
<Text className="text-cyan-700 font-semibold text-center text-xs">
Thème : {item.Theme}
</Text>
</View>
<Text className="text-3xl text-center text-white font-black p-4">
{currentPlayer.name}
</Text>
<Text className="text-white font-semibold text-center text-sm">
{item.Questions}
</Text>
</View>
);
})()
) : (
<>
<ActivityIndicator size="large" className=" m-4"/>
<Text className=" text-white font-semibold text-center text-sm">Loading questions...</Text>
<ActivityIndicator size="large" className="m-4" />
<Text className="text-white font-semibold text-center text-sm">
Loading...
</Text>
</>
)}
</View>

{/* Button */}
<View className="flex justify-center items-center ">
<TouchableOpacity
Expand Down
32 changes: 16 additions & 16 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4702,10 +4702,10 @@ expo-modules-core@1.5.12:
compare-versions "^3.4.0"
invariant "^2.2.4"

expo-status-bar@~1.11.1:
version "1.11.1"
resolved "https://registry.yarnpkg.com/expo-status-bar/-/expo-status-bar-1.11.1.tgz#a11318741d361048c11db2b16c4364a79a74af30"
integrity sha512-ddQEtCOgYHTLlFUe/yH67dDBIoct5VIULthyT3LRJbEwdpzAgueKsX2FYK02ldh440V87PWKCamh7R9evk1rrg==
expo-status-bar@~1.6.0:
version "1.6.0"
resolved "https://registry.yarnpkg.com/expo-status-bar/-/expo-status-bar-1.6.0.tgz#e79ffdb9a84d2e0ec9a0dc7392d9ab364fefa9cf"
integrity sha512-e//Oi2WPdomMlMDD3skE4+1ZarKCJ/suvcB4Jo/nO427niKug5oppcPNYO+csR6y3ZglGuypS+3pp/hJ+Xp6fQ==

expo@~49.0.15:
version "49.0.21"
Expand Down Expand Up @@ -7834,23 +7834,23 @@ react-native-progress@^5.0.1:
dependencies:
prop-types "^15.7.2"

react-native-safe-area-context@4.9.0:
version "4.9.0"
resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-4.9.0.tgz#21a570ca3594cb4259ba65f93befaa60d91bcbd0"
integrity sha512-/OJD9Pb8IURyvn+1tWTszWPJqsbZ4hyHBU9P0xhOmk7h5owSuqL0zkfagU0pg7Vh0G2NKQkaPpUKUMMCUMDh/w==
react-native-safe-area-context@4.6.3:
version "4.6.3"
resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-4.6.3.tgz#f06cfea05b1c4b018aa9758667a109f619c62b55"
integrity sha512-3CeZM9HFXkuqiU9HqhOQp1yxhXw6q99axPWrT+VJkITd67gnPSU03+U27Xk2/cr9XrLUnakM07kj7H0hdPnFiQ==

react-native-screens@~3.29.0:
version "3.29.0"
resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-3.29.0.tgz#1dee0326defbc1d4ef4e68287abb32a8e6b76b29"
integrity sha512-yB1GoAMamFAcYf4ku94uBPn0/ani9QG7NdI98beJ5cet2YFESYYzuEIuU+kt+CNRcO8qqKeugxlfgAa3HyTqlg==
react-native-screens@~3.22.0:
version "3.22.1"
resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-3.22.1.tgz#b0eb0696dbf1f9a852061cc71c0f8cdb95ed8e53"
integrity sha512-ffzwUdVKf+iLqhWSzN5DXBm0s2w5sN0P+TaHHPAx42LT7+DT0g8PkHT1QDvxpR5vCEPSS1i3EswyVK4HCuhTYg==
dependencies:
react-freeze "^1.0.0"
warn-once "^0.1.0"

react-native-svg@14.1.0:
version "14.1.0"
resolved "https://registry.yarnpkg.com/react-native-svg/-/react-native-svg-14.1.0.tgz#7903bddd3c71bf3a8a503918253c839e6edaa724"
integrity sha512-HeseElmEk+AXGwFZl3h56s0LtYD9HyGdrpg8yd9QM26X+d7kjETrRQ9vCjtxuT5dCZEIQ5uggU1dQhzasnsCWA==
react-native-svg@13.9.0:
version "13.9.0"
resolved "https://registry.yarnpkg.com/react-native-svg/-/react-native-svg-13.9.0.tgz#8df8a690dd00362601f074dec5d3a86dd0f99c7f"
integrity sha512-Ey18POH0dA0ob/QiwCBVrxIiwflhYuw0P0hBlOHeY4J5cdbs8ngdKHeWC/Kt9+ryP6fNoEQ1PUgPYw2Bs/rp5Q==
dependencies:
css-select "^5.1.0"
css-tree "^1.1.3"
Expand Down

0 comments on commit f206613

Please sign in to comment.