mirror of
https://github.com/FranP-code/Hangman-game-with-React.git
synced 2025-10-13 00:42:32 +00:00
Added the firebase integration
This commit is contained in:
39
src/App.js
39
src/App.js
@@ -21,11 +21,13 @@ import LettersRegistered from "./components/LettersRegistered/LettersRegistered"
|
||||
import alphabet from "./General Scripts/alphabet"
|
||||
import checkVictory from "./General Scripts/checkVictory";
|
||||
import checkDefeat from "./General Scripts/checkDefeat";
|
||||
import BringTheWords from "./Firebase Querys/BringTheWord";
|
||||
import SelectRandomWord from "./Firebase Querys/SelectRandomWord";
|
||||
|
||||
function App() {
|
||||
const [displayApp, setDisplayApp] = useState(true)
|
||||
const [displayApp, setDisplayApp] = useState(false)
|
||||
|
||||
const [selectedWord, setSelectedWord] = useState('TEST')
|
||||
const [selectedWord, setSelectedWord] = useState('')
|
||||
|
||||
const [correctLetters, setCorrectLetters] = useState([])
|
||||
const [lettersRegistered, setLettersRegistered] = useState([])
|
||||
@@ -44,7 +46,21 @@ function App() {
|
||||
|
||||
const [displayCategories, setDisplayCategories] = useState(false)
|
||||
|
||||
React.useEffect(() => {
|
||||
const bringWordFromFirebase = async () => {
|
||||
|
||||
if (!displayApp && selectedWord === '') {
|
||||
setSelectedWord('a')
|
||||
|
||||
let word = await BringTheWords(language, category, selectedWord)
|
||||
word = word.toLowerCase()
|
||||
|
||||
console.log(word)
|
||||
await setSelectedWord(word)
|
||||
await setDisplayApp(true)
|
||||
}
|
||||
}
|
||||
|
||||
React.useEffect(() => {
|
||||
RecoveryCurrentScore(setCurrentScore)
|
||||
|
||||
RecoveryCurrentCategory(setCategory)
|
||||
@@ -52,12 +68,18 @@ function App() {
|
||||
|
||||
DetermineUserLanguage(setLanguage)
|
||||
RecoveryCurrentLanguage(setLanguage)
|
||||
setLanguageIsReady(true)
|
||||
|
||||
ChangeTitle(language)
|
||||
setLanguageIsReady(true)
|
||||
|
||||
setSelectedWord(selectedWord.toLowerCase())
|
||||
}, [])
|
||||
if (!displayApp && selectedWord === '' && categoryIsReady && languageIsReady) {
|
||||
bringWordFromFirebase()
|
||||
}
|
||||
|
||||
console.log(category)
|
||||
}, [categoryIsReady])
|
||||
|
||||
|
||||
React.useEffect(() => {
|
||||
|
||||
@@ -84,7 +106,7 @@ function App() {
|
||||
else {
|
||||
setHangmanFrame(hangmanFrame + 1)
|
||||
|
||||
checkDefeat(setEndOfGame, hangmanFrame)
|
||||
checkDefeat(setEndOfGame, hangmanFrame, setCorrectLetters, selectedWord)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -103,7 +125,7 @@ function App() {
|
||||
AlmacenateCategory(category)
|
||||
AlmacenateLanguage(language)
|
||||
|
||||
window.location.reload(true)
|
||||
window.location.reload(false)
|
||||
}, 3000)
|
||||
}
|
||||
|
||||
@@ -149,9 +171,8 @@ function App() {
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{
|
||||
//!displayApp ? <Loading /> : null
|
||||
!displayApp ? <Loading /> : null
|
||||
}
|
||||
|
||||
{endOfGame === 'Victory' ? <Victory currentScore={currentScore} setCurrentScore={setCurrentScore} /> : null}
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import {firestore} from '../../../../Firebase/Firebase_Config'
|
||||
import {firestore} from '../Firebase/Firebase_Config'
|
||||
import { getFirestore, collection, doc, getDocs, getDoc } from 'firebase/firestore/lite';
|
||||
import GetRandomCategory from './GetRandomCategory';
|
||||
import SelectRandomWord from './SelectRandomWord';
|
||||
|
||||
const BringTheWords = async (language = false, category = false, actualWord) => {
|
||||
const BringTheWords = async (language = false, category = false, selectedWord) => {
|
||||
|
||||
if (!actualWord) {
|
||||
if (!selectedWord) {
|
||||
|
||||
|
||||
console.log(category)
|
||||
@@ -28,11 +28,10 @@ const BringTheWords = async (language = false, category = false, actualWord) =>
|
||||
const data = collection(db, `hangman_words/${language}/${category}`)
|
||||
const result = await getDocs(data)
|
||||
|
||||
const words = await result.docs.map(doc => doc.id)
|
||||
const word = SelectRandomWord(await words)
|
||||
|
||||
return word
|
||||
|
||||
const words = await result.docs.map(doc => doc.id)
|
||||
const word = await SelectRandomWord(await words)
|
||||
return await word
|
||||
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
import {firestore} from '../../../../Firebase/Firebase_Config'
|
||||
import {firestore} from '../Firebase/Firebase_Config'
|
||||
import { getFirestore, collection, doc, getDocs, getDoc } from 'firebase/firestore/lite';
|
||||
|
||||
const GetRandomCategory = async () => {
|
||||
@@ -5,7 +5,7 @@ const SelectRandomWord = (arrayWords) => {
|
||||
Math.random() * (arrayWords.length - 0) + 0
|
||||
)
|
||||
|
||||
return randomWord
|
||||
return arrayWords[randomWord]
|
||||
}
|
||||
|
||||
export default SelectRandomWord
|
||||
@@ -1,6 +1,7 @@
|
||||
const checkDefeat = (setEndOfGame, hangmanFrame) => {
|
||||
const checkDefeat = (setEndOfGame, hangmanFrame, setCorrectLetters, selectedWord) => {
|
||||
|
||||
if (hangmanFrame >= 5) {
|
||||
setCorrectLetters([...selectedWord])
|
||||
setEndOfGame('Defeat')
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,12 +2,16 @@ export const RecoveryCurrentCategory = (setCategory) => {
|
||||
|
||||
if (localStorage.getItem('category')) {
|
||||
|
||||
const category = localStorage.getItem('category')
|
||||
|
||||
console.log(category)
|
||||
setCategory(category)
|
||||
localStorage.removeItem('category')
|
||||
|
||||
if (localStorage.getItem('category') === 'false') {
|
||||
|
||||
setCategory(false)
|
||||
//setCategory(false)
|
||||
}
|
||||
|
||||
setCategory(localStorage.getItem('category'))
|
||||
localStorage.removeItem('category')
|
||||
}
|
||||
}
|
||||
|
||||
@@ -25,7 +25,7 @@ const Categories = ({language, displayCategories, category, setCategory, current
|
||||
AlmacenateCurrentScore(currentScore)
|
||||
AlmacenateLanguage(language)
|
||||
|
||||
window.location.reload(false)
|
||||
window.location.reload(true)
|
||||
|
||||
}
|
||||
|
||||
@@ -39,7 +39,7 @@ const Categories = ({language, displayCategories, category, setCategory, current
|
||||
AlmacenateCurrentScore(currentScore)
|
||||
AlmacenateCategory(category)
|
||||
|
||||
window.location.reload(false)
|
||||
window.location.reload(true)
|
||||
}
|
||||
|
||||
React.useEffect (() => {
|
||||
|
||||
Reference in New Issue
Block a user