score component

2 years ago · 80f15d61ed
1 changed files with 80 additions and 0 deletions
--- a/squarenotsquare/src/screens/Score.js
+++ b/squarenotsquare/src/screens/Score.js
@ -0,0 +1,80 @@
+import React, { useEffect } from "react";
+import { BackHandler, SafeAreaView, Text, TouchableOpacity, View } from "react-native";
+import { styles } from './styles/AppStyles';
+import Slider from "../components/Slider";
+import { useDispatch } from "react-redux";
+import {goHome, goToScores} from '../redux/actions/SystemActions';
+
+function Score(){
+  const dispatch = useDispatch();
+
+  useEffect(() => {
+    BackHandler.addEventListener('hardwareBackPress', () => {return true});
+  }, [])
+
+  function onPressMainMenu(){
+    dispatch(goHome());
+  }
+
+  function onPressHighScores(){
+    dispatch(goToScores());
+  }
+
+  const now = new Date(Date.now());
+
+  return (
+    <SafeAreaView style={[styles.flex]}>
+      <View style={[styles.flex, styles.spaceEvenly]}>
+        <Slider origin={400} duration={750} delay={0}>
+          <Text style={[styles.darkText, styles.headerTitleFont, styles.boldText, styles.centeredText]}>
+            TIME
+          </Text>
+          <Text style={[styles.darkText, styles.mediumFont, styles.boldText, styles.centeredText]}>
+            {'(60 - 9.500) X 1000 = 50500'}
+          </Text>
+        </Slider>
+        <Slider origin={400} duration={750} delay={1000}>
+          <Text style={[styles.darkText, styles.headerTitleFont, styles.boldText, styles.centeredText]}>
+            ANSWERS
+          </Text>
+          <Text style={[styles.darkText, styles.mediumFont, styles.boldText, styles.centeredText]}>
+            {'20 X 1000 = 20000'}
+          </Text>
+        </Slider>
+
+        <Slider origin={400} duration={750} delay={2000}>
+          <Text style={[styles.darkText, styles.headerTitleFont, styles.boldText, styles.centeredText]}>
+            TOTAL
+          </Text>
+          <Text style={[styles.darkText, styles.mediumFont, styles.boldText, styles.centeredText]}>
+            {'70500'}
+          </Text>
+        </Slider>
+      </View>
+      <View style={[styles.flex, styles.centeredItems, styles.spaceEvenly]}>
+        <Slider origin={400} duration={750} delay={3000}>
+          <TouchableOpacity
+            onPress={onPressMainMenu}
+            style={[styles.centeredJustify, styles.darkGreen, styles.menuButton, styles.dropShadow]}
+          >
+            <Text style={[styles.lightText, styles.headerTitleFont, styles.boldText, styles.centeredText]}>
+              Main Menu
+            </Text>
+          </TouchableOpacity>
+        </Slider>
+        <Slider origin={400} duration={750} delay={3500}>
+          <TouchableOpacity
+            onPress={onPressHighScores}
+            style={[styles.centeredJustify, styles.darkGreen, styles.menuButton, styles.dropShadow]}
+          >
+            <Text style={[styles.lightText, styles.headerTitleFont, styles.boldText, styles.centeredText]}>
+              High Scores
+            </Text>
+          </TouchableOpacity>
+        </Slider>
+      </View>
+    </SafeAreaView>
+  )
+}
+
+export default Score;