From a6bc3f88ba3d36209a3c00bc9968c551c918001d Mon Sep 17 00:00:00 2001 From: Anuj Pant Date: Thu, 12 Oct 2017 15:40:45 -0400 Subject: [PATCH 1/2] flag location change test --- component/Map.js | 92 +++++++++++++++++++++++-------------- component/SelectGameView.js | 2 + config/router.js | 14 +++--- model/index.js | 2 +- store/flag.js | 10 ++++ 5 files changed, 78 insertions(+), 42 deletions(-) diff --git a/component/Map.js b/component/Map.js index 2d90e0f..3796ec1 100644 --- a/component/Map.js +++ b/component/Map.js @@ -22,7 +22,7 @@ import { import { playerMarkerPath } from "../assets/playerMarkers"; import Uuid from "uuid-lib"; import { Player, Team, Flag } from "../model"; -import { getDistanceFromFlagThunk, updatePlayerLocationThunk } from "../store"; +import { getDistanceFromFlagThunk, updatePlayerLocationThunk, updateFlagLocationThunk } from "../store"; class Map extends Component { constructor(props) { @@ -87,7 +87,6 @@ class Map extends Component { redCoordinates: batteryPark.redCoordinates, blueCoordinates: batteryPark.blueCoordinates, }); - } this.watchPosition(); setInterval(this.checkInside, 100); @@ -136,7 +135,7 @@ class Map extends Component { if ( geolib.isPointInCircle( { latitude: this.state.latitude, longitude: this.state.longitude }, - this.props.flags[0].startLocation, // red team's flag + this.props.flags[0].currentLocation, // red team's flag 2 ) ) { @@ -148,7 +147,7 @@ class Map extends Component { if ( geolib.isPointInCircle( { latitude: this.state.latitude, longitude: this.state.longitude }, - this.props.flags[1].startLocation, // blue team's flag + this.props.flags[1].currentLocation, // blue team's flag 2 ) ) { @@ -225,26 +224,26 @@ class Map extends Component { // Re: added team logic onCapturePress() { - let team = ''; + // let team = ''; - for (let i=0; i player.playerKey === this.props.localUserKey) - + const homeRegion = geolib.getCenter(this.state.gameAreaCoordinates); + const deltas = this.props.game.gameId === 1 ? { latitudeDelta: 0.0002305 * 2,longitudeDelta: 0.00010525 * 2} : + this.props.game.gameId === 2 ? { latitudeDelta: 0.000927,longitudeDelta: 0.000687} : + { latitudeDelta: 0.002521,longitudeDelta: 0.001835} + let firebasePath = ''; if (me !== undefined && me.length > 0) { @@ -320,17 +326,16 @@ class Map extends Component { ); } - if (this.props.flags.length === 2) { - + if (homeRegion.latitude > 0 && this.props.flags.length === 2) { return ( this.handleFlagPress(event)} > this.handleFlagPress(event)} > + + this.handleFlagPress(event)} + > + + + + + {/* display bar in the middle of the view */} @@ -466,7 +490,7 @@ const mapStateToProps = state => { }; }; -const mapDispatchToProps = { getDistanceFromFlagThunk }; +const mapDispatchToProps = { getDistanceFromFlagThunk, updateFlagLocationThunk }; const MapContainer = connect(mapStateToProps, mapDispatchToProps)(Map); diff --git a/component/SelectGameView.js b/component/SelectGameView.js index a4cd21b..d78ae4f 100644 --- a/component/SelectGameView.js +++ b/component/SelectGameView.js @@ -138,6 +138,7 @@ class SelectGameView extends Component { latitude: redCoordinates.latitude, longitude: redCoordinates.longitude } + redFlag.currentLocation = redFlag.startLocation this.props.createFlag(redFlag) const blueCoordinates = locationArray[polyId].blueFlagSpawn[randNum]; let blueFlag = new Flag('blue', 2); @@ -145,6 +146,7 @@ class SelectGameView extends Component { latitude: blueCoordinates.latitude, longitude: blueCoordinates.longitude } + blueFlag.currentLocation = blueFlag.startLocation this.props.createFlag(blueFlag) } diff --git a/config/router.js b/config/router.js index db5dfa9..0f47344 100644 --- a/config/router.js +++ b/config/router.js @@ -5,13 +5,13 @@ import { StackNavigator } from 'react-navigation'; import { OAuthLoginForm, GameView, SelectGameView, ListView } from '../component'; export const GameScreen = StackNavigator({ - OAuthLoginForm: { - screen: OAuthLoginForm, - navigationOptions: { - title: 'Sign-Up/Login', - header: null - } - }, + // OAuthLoginForm: { + // screen: OAuthLoginForm, + // navigationOptions: { + // title: 'Sign-Up/Login', + // header: null + // } + // }, SelectGameView: { screen: SelectGameView, navigationOptions: { diff --git a/model/index.js b/model/index.js index cc0f320..3ae9a58 100644 --- a/model/index.js +++ b/model/index.js @@ -42,7 +42,7 @@ export class Flag { constructor(color, num) { this.flagId = num this.startLocation = null - this.currentLocation = null + this.currentLocation = false this.team = color this.isTaken = false this.holder = null diff --git a/store/flag.js b/store/flag.js index aa3fe97..acf9a9c 100644 --- a/store/flag.js +++ b/store/flag.js @@ -119,6 +119,16 @@ export function getDistanceFromFlagThunk(lat, lng, event){ } } +export function updateFlagLocationThunk(flagFirebasePath, playerLocation) { + firebase.database() + .ref(flagFirebasePath) + .update({currentLocation: {latitude: playerLocation.latitude, longitude: playerLocation.longitude}}) + // .then(() => firebase.database().ref('GameArea3/-Kw5kOK5-vXMLrT7R6rp/players/0/location').update({longitude})) + .then(() => console.log('flag location updated')) + .catch(error => console.log(error)) + // firebase.database().ref('GameArea3/-Kw5kOK5-vXMLrT7R6rp/players/0/location').update({latitude, longitude}) +} + export function takeFlagThunk(flag){ } From 9290bef4fe6b11969d40cde6bcc7a61df5f95861 Mon Sep 17 00:00:00 2001 From: Anuj Pant Date: Thu, 12 Oct 2017 17:02:27 -0400 Subject: [PATCH 2/2] updating player --- component/Map.js | 58 ++++++++++++++++++++++++++---------------------- config/router.js | 14 ++++++------ store/flag.js | 16 ++++++------- 3 files changed, 45 insertions(+), 43 deletions(-) diff --git a/component/Map.js b/component/Map.js index 3796ec1..114506d 100644 --- a/component/Map.js +++ b/component/Map.js @@ -31,7 +31,7 @@ class Map extends Component { latitude: 0, longitude: 0, error: null, - enableCapture: false, + enableCapture: true, pressFlag: false, displayStatus: "", gameAreaCoordinates: [ @@ -62,6 +62,7 @@ class Map extends Component { this.onCapturePress = this.onCapturePress.bind(this); this.onCloseCamera = this.onCloseCamera.bind(this); this.onFlagCapture = this.onFlagCapture.bind(this); + this.updateFlagLocation = this.updateFlagLocation.bind(this); } componentDidMount() { @@ -136,7 +137,7 @@ class Map extends Component { geolib.isPointInCircle( { latitude: this.state.latitude, longitude: this.state.longitude }, this.props.flags[0].currentLocation, // red team's flag - 2 + 5 ) ) { this.setState({ displayStatus: "Red flag nearby" }); @@ -148,7 +149,7 @@ class Map extends Component { geolib.isPointInCircle( { latitude: this.state.latitude, longitude: this.state.longitude }, this.props.flags[1].currentLocation, // blue team's flag - 2 + 5 ) ) { this.setState({ displayStatus: "Blue flag nearby" }); @@ -261,6 +262,7 @@ class Map extends Component { // Pressing AR image on Camera // This is passed down as props to Camera component onFlagCapture(player, flag) { + console.log('i am pressed') // if user's team is the same as the flag's (e.g., this.state.team === this.props.flags.team === 'red', then // if (this.state.team === this.props.flags.flagId) // and change flag's location to that the user (use playerId) @@ -268,11 +270,12 @@ class Map extends Component { // need dispatch here to have flag's location be the same as the holder // this.props.flags[0].location = this.props.players[whatever index the player is].location - let playerTeam = '', flagId = '', playerLocation = ''; + let playerTeam = '', flagId = '', playerLocation = {}; for (let i=0; i console.log('flag location updated')) + .catch(error => console.log(error)) +} + render() { const players = this.props.players; const flags = this.props.flags; @@ -416,25 +431,6 @@ class Map extends Component { radius={2} fillColor="rgba(0, 0, 200, 0.3)" /> - - this.handleFlagPress(event)} - > - - - - - {/* display bar in the middle of the view */} @@ -490,8 +486,16 @@ const mapStateToProps = state => { }; }; -const mapDispatchToProps = { getDistanceFromFlagThunk, updateFlagLocationThunk }; +const mapDispatchToProps = { getDistanceFromFlagThunk }; const MapContainer = connect(mapStateToProps, mapDispatchToProps)(Map); export default MapContainer; + +const hardCodedFlags = [ + {latitude: 40.705162, longitude: -74.007185}, + {latitude: 40.704463, longitude: -74.009470}, + {latitude: 40.704007, longitude: -74.008971}, + {latitude: 40.702616, longitude: -74.010006}, + {latitude: 40.703616, longitude: -74.011513} +] diff --git a/config/router.js b/config/router.js index 0f47344..db5dfa9 100644 --- a/config/router.js +++ b/config/router.js @@ -5,13 +5,13 @@ import { StackNavigator } from 'react-navigation'; import { OAuthLoginForm, GameView, SelectGameView, ListView } from '../component'; export const GameScreen = StackNavigator({ - // OAuthLoginForm: { - // screen: OAuthLoginForm, - // navigationOptions: { - // title: 'Sign-Up/Login', - // header: null - // } - // }, + OAuthLoginForm: { + screen: OAuthLoginForm, + navigationOptions: { + title: 'Sign-Up/Login', + header: null + } + }, SelectGameView: { screen: SelectGameView, navigationOptions: { diff --git a/store/flag.js b/store/flag.js index acf9a9c..6f83041 100644 --- a/store/flag.js +++ b/store/flag.js @@ -119,15 +119,13 @@ export function getDistanceFromFlagThunk(lat, lng, event){ } } -export function updateFlagLocationThunk(flagFirebasePath, playerLocation) { - firebase.database() - .ref(flagFirebasePath) - .update({currentLocation: {latitude: playerLocation.latitude, longitude: playerLocation.longitude}}) - // .then(() => firebase.database().ref('GameArea3/-Kw5kOK5-vXMLrT7R6rp/players/0/location').update({longitude})) - .then(() => console.log('flag location updated')) - .catch(error => console.log(error)) - // firebase.database().ref('GameArea3/-Kw5kOK5-vXMLrT7R6rp/players/0/location').update({latitude, longitude}) -} +// export function updateFlagLocationThunk(flagFirebasePath, playerLocation) { +// firebase.database() +// .ref(flagFirebasePath) +// .update({currentLocation: {latitude: playerLocation.latitude, longitude: playerLocation.longitude}}) +// .then(() => console.log('flag location updated')) +// .catch(error => console.log(error)) +// } export function takeFlagThunk(flag){