|
@ -5,6 +5,7 @@ import {genSquareChallenge} from '../libs/Random'; |
|
|
import {shapes} from '../libs/ShapeEnum'; |
|
|
import {shapes} from '../libs/ShapeEnum'; |
|
|
import { styles } from "./styles/AppStyles"; |
|
|
import { styles } from "./styles/AppStyles"; |
|
|
import Autoscroll from "../components/Autoscroll"; |
|
|
import Autoscroll from "../components/Autoscroll"; |
|
|
|
|
|
import Fade from "../components/Fade"; |
|
|
import MaterialIcon from 'react-native-vector-icons/MaterialCommunityIcons'; |
|
|
import MaterialIcon from 'react-native-vector-icons/MaterialCommunityIcons'; |
|
|
import Icons from '../themes/Icons'; |
|
|
import Icons from '../themes/Icons'; |
|
|
import Colors from "../themes/Colors"; |
|
|
import Colors from "../themes/Colors"; |
|
@ -13,8 +14,8 @@ import Metrics from "../themes/Metrics"; |
|
|
function Game(props){ |
|
|
function Game(props){ |
|
|
|
|
|
|
|
|
const squareChallenge = useRef(genSquareChallenge()); |
|
|
const squareChallenge = useRef(genSquareChallenge()); |
|
|
const squareMemo = useMemo(renderPairs, [squareChallenge]); |
|
|
|
|
|
const challengeState = useRef(0); |
|
|
const challengeState = useRef(0); |
|
|
|
|
|
const squareMemo = useMemo(renderPairs, [challengeState.current]); |
|
|
const [timerState, setTimerState] = useState(0); |
|
|
const [timerState, setTimerState] = useState(0); |
|
|
const localTimer = useRef(null); |
|
|
const localTimer = useRef(null); |
|
|
const startTime = useRef(0); |
|
|
const startTime = useRef(0); |
|
@ -113,17 +114,21 @@ function Game(props){ |
|
|
function generatePair(answer, shapeIndex, pairIndex) { |
|
|
function generatePair(answer, shapeIndex, pairIndex) { |
|
|
if (answer === 0) { |
|
|
if (answer === 0) { |
|
|
return ( |
|
|
return ( |
|
|
|
|
|
<Fade faded={challengeState.current !== pairIndex} duration={100}> |
|
|
<View key={pairIndex} style={[styles.flexRow, styles.spaceEvenly, styles.buttonMargin]}> |
|
|
<View key={pairIndex} style={[styles.flexRow, styles.spaceEvenly, styles.buttonMargin]}> |
|
|
{generateSquare(pairIndex)} |
|
|
{generateSquare(pairIndex)} |
|
|
{generateShape(shapeIndex, pairIndex)} |
|
|
{generateShape(shapeIndex, pairIndex)} |
|
|
</View> |
|
|
</View> |
|
|
|
|
|
</Fade> |
|
|
); |
|
|
); |
|
|
} else { |
|
|
} else { |
|
|
return ( |
|
|
return ( |
|
|
|
|
|
<Fade faded={challengeState.current !== pairIndex} duration={100}> |
|
|
<View key={pairIndex} style={[styles.flexRow, styles.spaceEvenly, styles.buttonMargin]}> |
|
|
<View key={pairIndex} style={[styles.flexRow, styles.spaceEvenly, styles.buttonMargin]}> |
|
|
{generateShape(shapeIndex, pairIndex)} |
|
|
{generateShape(shapeIndex, pairIndex)} |
|
|
{generateSquare(pairIndex)} |
|
|
{generateSquare(pairIndex)} |
|
|
</View> |
|
|
</View> |
|
|
|
|
|
</Fade> |
|
|
); |
|
|
); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|