feat: init Router and YooForum, add forgotten files

package.json

@@ -0,0 +1,34 @@
+{
+  "name": "YoomoocRN",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "android": "react-native run-android",
+    "ios": "react-native run-ios",
+    "start": "react-native start",
+    "test": "jest",
+    "lint": "eslint ."
+  },
+  "dependencies": {
+    "@react-native-async-storage/async-storage": "^1.13.2",
+    "@react-native-community/cookies": "^5.0.1",
+    "buffer": "^6.0.3",
+    "iconv-lite": "^0.6.2",
+    "react": "16.13.1",
+    "react-native": "0.63.3",
+    "stream": "^0.0.2"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.12.9",
+    "@babel/runtime": "^7.12.5",
+    "@react-native-community/eslint-config": "^2.0.0",
+    "babel-jest": "^26.6.3",
+    "eslint": "^7.14.0",
+    "jest": "^26.6.3",
+    "metro-react-native-babel-preset": "^0.64.0",
+    "react-test-renderer": "16.13.1"
+  },
+  "jest": {
+    "preset": "react-native"
+  }
+}

src/App.js

@@ -1,7 +1,8 @@
 import React from 'react';
 import {StyleSheet, View, Platform} from 'react-native';
 import {StatusBarHeight} from './api/StatusBarHeight';
-import {YooLogin, YooBackground} from './component/index';
+import {YooBackground} from './component/index';
+import Router from './Router';
 
 const styles = StyleSheet.create({
   container: {
@@ -15,7 +16,7 @@ export default function App() {
   return (
     <View style={styles.container}>
       <YooBackground />
-      <YooLogin />
+      <Router />
     </View>
   );
 }

src/Router.js

@@ -0,0 +1,44 @@
+import React, {Component} from 'react';
+import {View, Animated, Dimensions} from 'react-native';
+import {YooLogin, YooForum} from './component/index';
+
+const width = Dimensions.get('window').width;
+
+export default class Router extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      currentX: new Animated.Value(0),
+      nextX: new Animated.Value(width),
+    };
+    this.gotoForum = this.gotoForum.bind(this);
+  }
+
+  gotoForum() {
+    Animated.parallel([
+      Animated.timing(this.state.currentX, {
+        toValue: -width,
+        duration: 500,
+        useNativeDriver: false,
+      }),
+      Animated.timing(this.state.nextX, {
+        toValue: 0,
+        duration: 500,
+        useNativeDriver: false,
+      }),
+    ]).start();
+  }
+
+  render() {
+    return (
+      <View>
+        <Animated.View style={{left: this.state.currentX}}>
+          <YooLogin onSuccess={this.gotoForum} />
+        </Animated.View>
+        <Animated.View style={{left: this.state.nextX}}>
+          <YooForum />
+        </Animated.View>
+      </View>
+    );
+  }
+}

src/api/StatusBarHeight.js

@@ -0,0 +1,21 @@
+import {Dimensions, Platform, StatusBar} from 'react-native';
+
+const X_WIDTH = 375;
+const X_HEIGHT = 812;
+
+const XSMAX_WIDTH = 414;
+const XSMAX_HEIGHT = 896;
+
+const {height, width} = Dimensions.get('window');
+
+export const isIPhoneX = () =>
+  Platform.OS === 'ios' && !Platform.isPad && !Platform.isTVOS
+    ? (width === X_WIDTH && height === X_HEIGHT) ||
+      (width === XSMAX_WIDTH && height === XSMAX_HEIGHT)
+    : false;
+
+export const StatusBarHeight = Platform.select({
+  ios: isIPhoneX() ? 44 : 20,
+  android: StatusBar.currentHeight,
+  default: 0,
+});

src/component/YooForum.js

@@ -0,0 +1,8 @@
+import React, {Component} from 'react';
+import YooForumUI from '../ui/YooForumUI';
+
+export default class YooForum extends Component {
+  render() {
+    return <YooForumUI />;
+  }
+}

src/component/YooLogin.js

@@ -43,14 +43,16 @@ export default class YooLogin extends Component {
         this.state.username +
         '&IPT_LOGINPASSWORD=' +
         this.state.password,
-    }).then((response) => {
+    })
+      .then((response) => {
         if (/<title>(.|\n)*用户登录(.|\n)*<\/title>/.test(response)) {
           onFail();
           CookieManager.clearAll();
         } else if (/<title>(.|\n)*网络课程(.|\n)*<\/title>/.test(response)) {
-        // TODO:onSuccess();
+          this.props.onSuccess();
         }
-    });
+      })
+      .catch(onFail);
   }
 
   render() {

src/component/index.js

@@ -1,4 +1,5 @@
 import YooLogin from './YooLogin';
+import YooForum from './YooForum';
 import YooBackground from '../ui/YooBackground';
 
-export {YooLogin, YooBackground};
+export {YooLogin, YooForum, YooBackground};

src/ui/YooBackground.js

@@ -1,7 +1,7 @@
 import React, {useState} from 'react';
 import {Image, StyleSheet, Animated} from 'react-native';
 
-export function YooBackground() {
+export default function YooBackground() {
   const imgPosition = useState(new Animated.ValueXY())[0];
   const styles = StyleSheet.create({
     backgroundContainer: {

src/ui/YooForumUI.js

@@ -0,0 +1,19 @@
+import React, {Component} from 'react';
+import {View, StyleSheet, Text} from 'react-native';
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: 'center',
+  },
+});
+
+export default class YooForumUI extends Component {
+  render() {
+    return (
+      <View style={styles.container}>
+        <Text>Forum</Text>
+      </View>
+    );
+  }
+}

src/ui/YooLoginUI.js

@@ -37,7 +37,7 @@ const styles = StyleSheet.create({
     backgroundColor: '#1c90ce',
     width: 100,
     height: 50,
-    borderRadius: 100,
+    borderRadius: 25,
   },
   buttonText: {
     fontWeight: 'bold',