304_complete geolocation

android/app/src/debug/AndroidManifest.xml

@@ -2,7 +2,11 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools">
 
-    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+    <uses-permission android:name="android.permission.INTERNET" />
+    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
+    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
+    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
+    <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
 
     <application
         android:usesCleartextTraffic="true"

android/app/src/main/AndroidManifest.xml

@@ -3,7 +3,9 @@
 
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
+    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
     <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
+    <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
 
     <application
       android:name=".MainApplication"

component/OnlineStudy/2-PlayerPKHome/index.js

@@ -15,14 +15,14 @@ class TwoPlayerPKHome extends Component {
     this.cancelSearching();
   }
 
-  state = {isStarted: false, opponentID: 0};
+  state = {isStarted: false, opponent: null};
 
   ifFound = () => {
-    const {opponentID} = this.state;
+    const {opponent} = this.state;
     if (true) {
       //this.props.navigation.navigate('双人PK结算');
-      this.props.navigation.navigate('双人PK中', {opponentID: opponentID});
-      this.setState({isStarted: false, opponentID: 0});
+      this.props.navigation.navigate('双人PK中', {opponent: opponent});
+      this.setState({isStarted: false, opponent: null});
       clearInterval(this.timer);
     }
   };
@@ -36,7 +36,7 @@ class TwoPlayerPKHome extends Component {
 
   cancelSearching = () => {
     clearInterval(this.timer);
-    this.setState({isStarted: false, opponentID: 0});
+    this.setState({isStarted: false, opponent: null});
   };
 
   render() {

component/OnlineStudy/2-PlayerPKStudy/index.js

@@ -5,6 +5,7 @@ import MyTitle from '../MyTitle';
 import SettingButton from '../SettingButton';
 import MyBanner from '../MyBanner';
 import TwoPlayerPKState from '../2-PlayerPKState';
+import {parseMinute, parseTime} from '../MyUtilities';
 
 const {width, height} = Dimensions.get('window');
 /**
@@ -25,11 +26,21 @@ class TwoPlayerPKStudy extends Component {
   }
 
   state = {
-    opponentID: undefined,
+    user: {
+      name: 'username',
+      rank: 'error',
+      duration: -1,
+    },
+    opponent: {
+      id: undefined,
+      name: 'opponent',
+      rank: 'error',
+      duration: -1,
+    },
     victories: 0,
     isStarted: false,
-    timeInAGame: 0,
-    timeInAMatch: 999,
+    timeInTheGame: 0,
+    timeInTheMatch: 999,
   };
 
   componentDidMount() {
@@ -48,8 +59,8 @@ class TwoPlayerPKStudy extends Component {
       this.forceUpdate();
     });
     // 以下不是标语风格切换相关
-    if (typeof params.opponentID !== 'undefined') {
-      this.setState({opponentID: params.opponentID, isStarted: true});
+    if (params.opponent !== undefined && params.opponent !== null) {
+      this.setState({opponent: params.opponent, isStarted: true});
     }
     this.startTimer();
   }
@@ -60,21 +71,11 @@ class TwoPlayerPKStudy extends Component {
     clearInterval(this.timer);
   }
 
-  parseTime = time => {
-    const minute = parseInt(time / 60, 10);
-    const second = time % 60;
-    return minute.toString() + ':' + second.toString();
-  };
-
-  parseMinute = time => {
-    return parseInt(time / 60, 10).toString();
-  };
-
   calculateTime = () => {
-    const {timeInAGame, timeInAMatch} = this.state;
+    const {timeInTheGame, timeInTheMatch} = this.state;
     this.setState({
-      timeInAGame: timeInAGame + 1,
-      timeInAMatch: timeInAMatch + 1,
+      timeInTheGame: timeInTheGame + 1,
+      timeInTheMatch: timeInTheMatch + 1,
     });
   };
 
@@ -97,7 +98,7 @@ class TwoPlayerPKStudy extends Component {
           //console.log('OK Pressed');
           clearInterval(this.timer);
           this.props.navigation.navigate('双人PK结算', {
-            numberTop: parseInt(this.state.timeInAMatch / 60, 10),
+            numberTop: parseInt(this.state.timeInTheMatch / 60, 10),
             numberCentre: 999,
             numberBottom: 9999,
           });
@@ -107,7 +108,14 @@ class TwoPlayerPKStudy extends Component {
   };
 
   render() {
-    const {victories, isStarted, timeInAGame, timeInAMatch} = this.state;
+    const {
+      user,
+      opponent,
+      victories,
+      isStarted,
+      timeInTheGame,
+      timeInTheMatch,
+    } = this.state;
 
     return (
       <View style={styles.container}>
@@ -120,25 +128,25 @@ class TwoPlayerPKStudy extends Component {
             text={{
               first: {
                 top: '用户',
-                bottom: 'name',
+                bottom: user.name,
               },
               second: {
                 top: '段位',
-                bottom: '黄金',
+                bottom: user.rank,
               },
               third: {
                 top: '本次时长',
-                bottom: this.parseMinute(timeInAMatch) + ' min',
+                bottom: parseMinute(timeInTheMatch) + ' min',
               },
               forth: {
                 top: '生涯时长',
-                bottom: '1' + ' min',
+                bottom: parseMinute(timeInTheMatch) + user.duration + ' min',
               },
             }}
           />
           <TwoPlayerPKState
             isStarted={isStarted}
-            time={this.parseTime(timeInAGame)}
+            time={parseTime(timeInTheGame)}
           />
           <MyStatistics
             containerStyle={styles.containerOnRight}
@@ -147,11 +155,11 @@ class TwoPlayerPKStudy extends Component {
             text={{
               first: {
                 top: '用户',
-                bottom: 'name',
+                bottom: opponent.name,
               },
               second: {
                 top: '段位',
-                bottom: '黄金',
+                bottom: opponent.rank,
               },
               third: {
                 top: '本次时长',
@@ -165,9 +173,7 @@ class TwoPlayerPKStudy extends Component {
           />
         </View>
         <View style={styles.containerTimer}>
-          <Text style={styles.textTimer}>
-            {this.parseTime(timeInAMatch)}
-          </Text>
+          <Text style={styles.textTimer}>{parseTime(timeInTheMatch)}</Text>
         </View>
         <MyBanner
           containerStyle={styles.myButton.container}

component/OnlineStudy/GlobalACID/index.js

+global.acID = 1; // acID of range PK

component/OnlineStudy/GlobalSetting/index.js

-global.bannerStyle = 1; //标语风格的代号
+global.bannerStyle = 1; // 标语风格的代号

component/OnlineStudy/MyUtilities/index.js

+import React from 'react';
+
+const EARTH_RADIUS = 6371393; // metre
+const DEFAULT_DISTANCE = 100; // metre
+
+const LocationTable = {
+  notLocated: {name: '未定位'},
+  notInRange: {name: '教学楼外'},
+  x3: {
+    name: '西3',
+    latitude: 26.05849318962613, //变大往上
+    longitude: 119.19549000209701, //变小往左
+  },
+  x2: {
+    name: '西2',
+    latitude: 26.058946504275003, //变大往上
+    longitude: 119.1953938804798, //变小往左
+  },
+  x1: {
+    name: '西1',
+    latitude: 26.059403829377106, //变大往上
+    longitude: 119.19544060319686, //变小往左
+  },
+  zl: {
+    name: '中楼',
+    latitude: 26.060012472674234, //变大往上
+    longitude: 119.19570664618345, //变小往左
+  },
+  d1: {
+    name: '东1',
+    latitude: 26.06053774653399, //变大往上
+    longitude: 119.19617778126203, //变小往左
+  },
+  d2: {
+    name: '东2',
+    latitude: 26.060904190098523, //变大往上
+    longitude: 119.19640098744283, //变小往左
+  },
+  d3: {
+    name: '东3',
+    latitude: 26.060942537313174, //变大往上
+    longitude: 119.19752215079187, //变小往左
+  },
+  w1: {
+    name: '文1',
+    latitude: 26.062238879973553, //变大往上
+    longitude: 119.1984734895727, //变小往左
+  },
+  w2: {
+    name: '文2',
+    latitude: 26.062238879973553, //变大往上
+    longitude: 119.1990734895727, //变小往左
+  },
+  w3: {
+    name: '文3',
+    latitude: 26.062790879973553, //变大往上
+    longitude: 119.1989734895727, //变小往左
+  },
+  w4: {
+    name: '文4',
+    latitude: 26.063100879973553, //变大往上
+    longitude: 119.1987734895727, //变小往左
+  },
+};
+
+export function isLegalRangeID(rangeID) {
+  if (
+    LocationTable.hasOwnProperty(rangeID) &&
+    rangeID !== 'notInRange' &&
+    rangeID !== 'notLocated'
+  ) {
+    return true;
+  } else {
+    return false;
+  }
+}
+
+export function parseRangeID(rangeID) {
+  // console.log('parseRangeID rangID: ' + rangeID);
+  if (LocationTable.hasOwnProperty(rangeID)) {
+    rangeID = LocationTable[rangeID].name;
+  } else {
+    rangeID = 'error';
+  }
+  return rangeID;
+}
+
+function getRadian(angle) {
+  return (angle * Math.PI) / 180;
+}
+
+function getDistance(longitude1, latitude1, longitude2, latitude2) {
+  const radianLatitude1 = getRadian(latitude1);
+  const radianLatitude2 = getRadian(latitude2);
+  const differenceOfLatitudes = radianLatitude1 - radianLatitude2;
+  const differenceOfLongitudes = getRadian(longitude1) - getRadian(longitude2);
+  let distance =
+    2 *
+    Math.asin(
+      Math.sqrt(
+        Math.pow(Math.sin(differenceOfLatitudes / 2), 2) +
+          Math.cos(radianLatitude1) *
+            Math.cos(radianLatitude2) *
+            Math.pow(Math.sin(differenceOfLongitudes / 2), 2),
+      ),
+    );
+  distance = distance * EARTH_RADIUS;
+  // distance = Math.round(distance * 10000) / 10000;
+  return distance;
+}
+
+export function parseLocation(longitude, latitude) {
+  // console.log('longitude: ' + longitude + ' latitude: ' + latitude);
+  let range = {
+    ID: 'notInRange',
+    distance: DEFAULT_DISTANCE,
+  };
+
+  for (let key in LocationTable) {
+    if (key === 'notInRange' || key == 'notLocated') {
+      continue;
+    }
+    const distance = getDistance(
+      LocationTable[key].longitude,
+      LocationTable[key].latitude,
+      longitude,
+      latitude,
+    );
+    if (distance < range.distance) {
+      range.ID = key;
+      range.distance = distance;
+    }
+  }
+  // console.log(range.ID + ' ' + range.distance);
+  return range.ID;
+}
+
+export function parseTime(time) {
+  const minute = parseInt(time / 60, 10);
+  const second = time % 60;
+  return minute.toString() + ':' + second.toString();
+}
+
+export function parseMinute(time) {
+  return parseInt(time / 60, 10);
+}

component/OnlineStudy/RangPKRankingList/index.js

@@ -7,6 +7,7 @@ import {
   View,
 } from 'react-native';
 import {Table, Row, Rows} from 'react-native-table-component';
+import '../GlobalACID';
 
 const {width, height} = Dimensions.get('window');
 

component/OnlineStudy/RangePKHome/index.js

@@ -13,6 +13,8 @@ import Located from './img/located1.png';
 import Locating from './img/locating1.png';
 import MyButton from '../MyButton';
 import Geolocation from '@react-native-community/geolocation';
+import {parseRangeID, isLegalRangeID, parseLocation} from '../MyUtilities';
+import '../GlobalACID';
 
 const {width, height} = Dimensions.get('window');
 const config = {
@@ -28,7 +30,7 @@ class RangePKHome extends Component {
   }
 
   componentWillUnmount() {
-    this.cancelLocating();
+    // this.cancelLocating();
     // 卸载异步操作设置状态
     this.setState = (state, callback) => {
       return;
@@ -38,7 +40,7 @@ class RangePKHome extends Component {
   state = {
     isStarted: false,
     isLocated: false,
-    rangeID: undefined,
+    rangeID: 'notLocated', // 初始rangeID
     longitude: undefined,
     latitude: undefined,
   };
@@ -52,12 +54,11 @@ class RangePKHome extends Component {
       //   const error = {code: 100, message: 'Locating request is aborted.'};
       //   return reject(error);
       // });
-
       Geolocation.getCurrentPosition(
         location => {
           const longitude = location.coords.longitude; //经度
           const latitude = location.coords.latitude; //纬度
-          const rangeID = this.parseLocation(longitude, latitude);
+          const rangeID = parseLocation(longitude, latitude);
           // this.setState({isStarted: false, isLocated: true, rangeID: rangID});
           this.setState({
             isStarted: false,
@@ -87,7 +88,7 @@ class RangePKHome extends Component {
         {
           enableHighAccuracy: true,
           timeout: 5000,
-          maximumAge: 10000,
+          maximumAge: 50,
         },
       );
     });
@@ -107,11 +108,6 @@ class RangePKHome extends Component {
     }
   };
 
-  parseLocation = (longitude, latitude) => {
-    console.log('longitude: ' + longitude + ' latitude: ' + latitude);
-    return 'x1';
-  };
-
   startLocating = () => {
     // // eslint-disable-next-line no-undef
     // this.abortController = new AbortController();
@@ -119,50 +115,33 @@ class RangePKHome extends Component {
     this.geoLocate().then(r => {});
   };
 
-  cancelLocating = () => {
-    // if (this.abortController) {
-    //   this.abortController.abort();
-    //   this.abortController = null;
-    // }
-    // this.setState({isStarted: false});
-  };
+  // cancelLocating = () => {
+  //   if (this.abortController) {
+  //     this.abortController.abort();
+  //     this.abortController = null;
+  //   }
+  //   this.setState({isStarted: false});
+  // };
 
   startStudy = () => {
     //this.props.navigation.navigate('');
     this.props.navigation.navigate('区域PK中', {rangeID: this.state.rangeID});
   };
 
-  parseRangeID = () => {
-    let {rangeID} = this.state;
-    // console.log('parseRangeID rangID: ' + rangeID);
-    switch (rangeID) {
-      case undefined:
-        rangeID = '未定位';
-        break;
-      case 'x1':
-        rangeID = '西1';
-        break;
-      default:
-        rangeID = 'Error';
-        break;
-    }
-    return rangeID;
-  };
-
   render() {
-    const {isStarted, isLocated} = this.state;
+    const {isStarted, isLocated, rangeID} = this.state;
     return (
       <View style={styles.container}>
         <Image source={isStarted ? Locating : Located} style={styles.image} />
         <Text numberOfLines={1} style={styles.text}>
-          当前所在区域：{this.parseRangeID()}
+          当前所在区域：{parseRangeID(rangeID)}
         </Text>
         {isStarted ? (
           <MyButton
             containerStyle={styles.myButton.container}
             disabled={true}
             title="定位中"
-            onPress={this.cancelLocating}
+            // onPress={this.cancelLocating}
           />
         ) : (
           <MyButton
@@ -172,7 +151,7 @@ class RangePKHome extends Component {
           />
         )}
         <MyButton
-          disabled={!isLocated}
+          disabled={!isLegalRangeID(rangeID)}
           containerStyle={styles.myButton.container}
           title="开始自习"
           onPress={this.startStudy}

component/OnlineStudy/RangePKStudy/index.js

@@ -12,6 +12,8 @@ import MyTitle from '../MyTitle';
 import SettingButton from '../SettingButton';
 import MyBanner from '../MyBanner';
 import RangePKState from '../RangePKState';
+import {parseMinute, parseRangeID, parseTime} from '../MyUtilities';
+import '../GlobalACID';
 
 const {width, height} = Dimensions.get('window');
 /**
@@ -33,8 +35,25 @@ class RangePKStudy extends Component {
 
   state = {
     rangeID: undefined,
+    user: {
+      name: 'username',
+      rank: 'error',
+      duration: -1,
+    },
     ranking: 1,
-    timeInAMatch: 0,
+    timeInTheMatch: 0,
+    rankingFirst: {
+      name: 'username',
+      time: -1,
+    },
+    rankingSecond: {
+      name: 'username',
+      time: -1,
+    },
+    rankingThird: {
+      name: 'username',
+      time: -1,
+    },
   };
 
   componentDidMount() {
@@ -53,7 +72,7 @@ class RangePKStudy extends Component {
       this.forceUpdate();
     });
     // 以下不是标语风格切换相关
-    if (typeof params.rangeID !== 'undefined') {
+    if (params.rangeID !== undefined) {
       this.setState({rangeID: params.rangeID});
     }
     this.startTimer();
@@ -65,21 +84,11 @@ class RangePKStudy extends Component {
     clearInterval(this.timer);
   }
 
-  parseTime = time => {
-    const minute = parseInt(time / 60, 10);
-    const second = time % 60;
-    return minute.toString() + ':' + second.toString();
-  };
-
-  parseMinute = time => {
-    return parseInt(time / 60, 10).toString();
-  };
-
   calculateTime = () => {
-    const {timeInAGame, timeInAMatch} = this.state;
+    const {timeInAGame, timeInTheMatch} = this.state;
     this.setState({
       timeInAGame: timeInAGame + 1,
-      timeInAMatch: timeInAMatch + 1,
+      timeInTheMatch: timeInTheMatch + 1,
     });
   };
 
@@ -89,22 +98,6 @@ class RangePKStudy extends Component {
     }, 1000);
   };
 
-  parseRangeID = () => {
-    let {rangeID} = this.state;
-    switch (rangeID) {
-      case 'undefined':
-        rangeID = '未定位';
-        break;
-      case 'x1':
-        rangeID = '西1';
-        break;
-      default:
-        rangeID = 'Error';
-        break;
-    }
-    return rangeID;
-  };
-
   openRankingList = () => {
     this.props.navigation.navigate('区域排行榜');
   };
@@ -144,10 +137,10 @@ class RangePKStudy extends Component {
           //console.log('OK Pressed');
           clearInterval(this.timer);
           this.props.navigation.navigate('区域PK结算', {
-            numberTop: parseInt(this.state.timeInAMatch / 60, 10),
+            numberTop: parseInt(this.state.timeInTheMatch / 60, 10),
             numberCentre: 999,
             numberBottom: 9999,
-            range: this.parseRangeID(),
+            range: parseRangeID(this.state.rangeID),
           });
         },
       },
@@ -155,7 +148,14 @@ class RangePKStudy extends Component {
   };
 
   render() {
-    const {ranking, timeInAMatch} = this.state;
+    const {
+      user,
+      ranking,
+      timeInTheMatch,
+      rankingFirst,
+      rankingSecond,
+      rankingThird,
+    } = this.state;
 
     return (
       <View style={styles.container} {...this.panResponder.panHandlers}>
@@ -168,23 +168,23 @@ class RangePKStudy extends Component {
             text={{
               first: {
                 top: '用户',
-                bottom: 'name',
+                bottom: user.name,
               },
               second: {
                 top: '段位',
-                bottom: '黄金',
+                bottom: user.rank,
               },
               third: {
                 top: '本次时长',
-                bottom: this.parseMinute(timeInAMatch) + ' min',
+                bottom: parseMinute(timeInTheMatch) + ' min',
               },
               forth: {
                 top: '生涯时长',
-                bottom: '1' + ' min',
+                bottom: parseMinute(timeInTheMatch) + user.duration + ' min',
               },
             }}
           />
-          <RangePKState range={this.parseRangeID()} />
+          <RangePKState range={parseRangeID(this.state.rangeID)} />
           <MyStatistics
             containerStyle={styles.containerOnRight}
             insideStyle={styles.containerInRightColumn}
@@ -192,27 +192,27 @@ class RangePKStudy extends Component {
             onPress={this.openRankingList}
             text={{
               first: {
-                top: '区域',
+                top: parseRangeID(this.state.rangeID) + '区域',
                 bottom: 'Top 3',
               },
               second: {
-                top: '老王',
-                bottom: '1' + ' min',
+                top: rankingFirst.name,
+                bottom: rankingFirst.time + ' min',
               },
               third: {
-                top: '老王',
-                bottom: '1' + ' min',
+                top: rankingSecond.name,
+                bottom: rankingSecond.time + ' min',
               },
               forth: {
-                top: '老王',
-                bottom: '1' + ' min',
+                top: rankingThird.name,
+                bottom: rankingThird.time + ' min',
               },
             }}
           />
         </View>
         <View style={styles.containerTimer}>
           <Text style={styles.text}>{'<--'}左滑打开排行榜</Text>
-          <Text style={styles.textTimer}>{this.parseTime(timeInAMatch)}</Text>
+          <Text style={styles.textTimer}>{parseTime(timeInTheMatch)}</Text>
         </View>
         <MyBanner
           containerStyle={styles.myBanner.container}

component/OnlineStudy/index.js

@@ -9,7 +9,7 @@ import TwoPlayerPKRecord from './2-PlayerPKRecord';
 import RangePKHome from './RangePKHome';
 import RangePKStudy from './RangePKStudy';
 import RangePKRecord from './RangePKRecord';
-import RangePKRankingList from "./RangPKRankingList";
+import RangePKRankingList from './RangPKRankingList';
 
 class OnlineStudy extends Component {
   constructor() {