diff --git a/.env.example b/.env.example
new file mode 100644
index 0000000000000000000000000000000000000000..75d1a71c9ec995f3ab6e2f4f3ad2933e576be245
--- /dev/null
+++ b/.env.example
@@ -0,0 +1 @@
+REACT_APP_URL = "http://localhost:5000"
\ No newline at end of file
diff --git a/src/components/EditGameForm.js b/src/components/EditGameForm.js
index dd4e9bd08d7b4c74390a6f4877f97679edecb363..ac56b351fd779e57de73dfe363637af7518d754e 100644
--- a/src/components/EditGameForm.js
+++ b/src/components/EditGameForm.js
@@ -75,7 +75,7 @@ export class EditGameForm extends React.Component {
let token = sessionStorage.getItem('token');
// Send Game info to the server
- fetch('http://localhost:5000/game/edit/' + this.props.gameId, {
+ fetch(`${process.env.REACT_APP_URL}/game/edit/` + this.props.gameId, {
method: 'PUT',
headers: {
Authorization: 'Bearer ' + token,
@@ -102,7 +102,7 @@ export class EditGameForm extends React.Component {
}
getGameInfo(gameId) {
- fetch('http://localhost:5000/game/' + gameId)
+ fetch(`${process.env.REACT_APP_URL}/game/` + gameId)
.then(response => response.json())
.then(json => this.handleGameInfo(json))
.catch(error => console.log(error));
@@ -126,79 +126,79 @@ export class EditGameForm extends React.Component {
render() {
return ReactDOM.createPortal(
- <div className="fade-main">
- <div className="sticky">
+ <div className='fade-main'>
+ <div className='sticky'>
<span
- id="closeEditGameFormX"
- className="close"
+ id='closeEditGameFormX'
+ className='close'
onClick={this.handleView}
>
×
</span>
</div>
- <div className="">
+ <div className=''>
<form onSubmit={this.handleGameSave}>
<h1>Demo Game Creation</h1>
<br />
<input
- placeholder="Game name"
- name="gamename"
+ placeholder='Game name'
+ name='gamename'
value={this.state.gamename}
onChange={this.handleChange}
- id="editGameNameInput"
+ id='editGameNameInput'
/>
<br />
<input
- placeholder="Description"
- type="text"
- name="description"
+ placeholder='Description'
+ type='text'
+ name='description'
value={this.state.description}
onChange={this.handleChange}
- id="editGameDescriptionInput"
+ id='editGameDescriptionInput'
/>
<br />
- <label className="">Start:</label>
+ <label className=''>Start:</label>
<input
- className="formDate"
- type="date"
- name="startDate"
+ className='formDate'
+ type='date'
+ name='startDate'
value={this.state.startDate}
onChange={this.handleChange}
- id="editGameDateStartInput"
+ id='editGameDateStartInput'
/>
<input
- className="formTime"
- type="time"
- name="startTime"
+ className='formTime'
+ type='time'
+ name='startTime'
value={this.state.startTime}
onChange={this.handleChange}
- rid="editGameTimeStartInput"
+ rid='editGameTimeStartInput'
/>
<br />
- <label className="">End:</label>
+ <label className=''>End:</label>
<input
- className="formDate"
- type="date"
- name="endDate"
+ className='formDate'
+ type='date'
+ name='endDate'
value={this.state.endDate}
onChange={this.handleChange}
min={this.state.startDate}
- id="editGameDateEndInput"
+ id='editGameDateEndInput'
/>
<input
- className="formTime"
- type="time"
- name="endTime"
+ className='formTime'
+ type='time'
+ name='endTime'
value={this.state.endTime}
onChange={this.handleChange}
- id="editGameTimeEndInput"
+ id='editGameTimeEndInput'
/>
<br />
<label>Map things</label>
<br />
<Map
- id="editGameCenterMap"
- className=""
+ id='editGameCenterMap'
+ className=''
center={[this.state.mapCenter.lat, this.state.mapCenter.lng]}
zoom={this.state.zoom}
style={{ height: '400px', width: '400px' }}
@@ -206,12 +206,12 @@ export class EditGameForm extends React.Component {
onzoomend={this.handleMapScroll}
>
<TileLayer
- attribution="Maanmittauslaitoksen kartta"
- url=" https://tiles.kartat.kapsi.fi/taustakartta/{z}/{x}/{y}.jpg"
+ attribution='Maanmittauslaitoksen kartta'
+ url=' https://tiles.kartat.kapsi.fi/taustakartta/{z}/{x}/{y}.jpg'
/>
</Map>
<br />
- <button id="editGameSubmitButton" type="submit">
+ <button id='editGameSubmitButton' type='submit'>
Save changes
</button>
<h2>{this.state.errorMsg}</h2>
diff --git a/src/components/GameList.js b/src/components/GameList.js
index 26d32824205167bf9320b097955d9d405704c488..e1b0fa1d69aa8307eaa160a3c90ce845e6611fb1 100644
--- a/src/components/GameList.js
+++ b/src/components/GameList.js
@@ -18,7 +18,7 @@ class GameList extends React.Component {
}
getGames() {
- fetch('http://localhost:5000/game/listgames')
+ fetch(`${process.env.REACT_APP_URL}/game/listgames`)
.then(response => response.json())
.then(games => {
this.setState({
diff --git a/src/components/Header.js b/src/components/Header.js
index 6a0f788fcea295fff261cf87a6163a92889ebe45..c3b0d558801e1b219339a977f5b504bde9d581b0 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -34,7 +34,7 @@ class Header extends React.Component {
componentDidMount() {
let token = sessionStorage.getItem('token');
if (token) {
- fetch('http://localhost:5000/user/verify', {
+ fetch(`${process.env.REACT_APP_URL}/user/verify`, {
headers: {
Authorization: 'Bearer ' + token
}
diff --git a/src/components/LoginForm.js b/src/components/LoginForm.js
index f37999dd525befe0f4f8cf95f15090f10478b046..7dca5868027d18c729ad3cbb43913ec3edd63f24 100644
--- a/src/components/LoginForm.js
+++ b/src/components/LoginForm.js
@@ -38,7 +38,7 @@ export class LoginForm extends React.Component {
e.preventDefault();
// Send login info to the server
- fetch('http://localhost:5000/user/login', {
+ fetch(`${process.env.REACT_APP_URL}/user/login`, {
method: 'POST',
headers: {
Accept: 'application/json',
@@ -80,7 +80,11 @@ export class LoginForm extends React.Component {
return (
<div className='fade-main'>
<div className='sticky'>
- <span id="closeLoginFormX" className='close' onClick={this.handleView}>
+ <span
+ id='closeLoginFormX'
+ className='close'
+ onClick={this.handleView}
+ >
×
</span>
</div>
@@ -93,7 +97,7 @@ export class LoginForm extends React.Component {
name='username'
value={this.state.username}
onChange={this.handleChange}
- id="loginUsernameInput"
+ id='loginUsernameInput'
/>
<br />
<input
@@ -102,15 +106,16 @@ export class LoginForm extends React.Component {
name='password'
value={this.state.password}
onChange={this.handleChange}
- id="loginPasswordInput"
+ id='loginPasswordInput'
/>
<br />
- <button id="submitLoginButton" type='submit'>login</button>
+ <button id='submitLoginButton' type='submit'>
+ login
+ </button>
<h2>{this.state.errorMsg}</h2>
</form>
</div>
</div>
-
);
}
}
diff --git a/src/components/NewGameForm.js b/src/components/NewGameForm.js
index 3f83ccfa0f2cc7a87b500ffb2f938bfe39b72b41..e681b0c725908fb6f1a5a6b3f31083eda31ba7a7 100644
--- a/src/components/NewGameForm.js
+++ b/src/components/NewGameForm.js
@@ -77,7 +77,7 @@ export class NewGameForm extends React.Component {
let token = sessionStorage.getItem('token');
// Send Game info to the server
- fetch('http://localhost:5000/game/new', {
+ fetch(`${process.env.REACT_APP_URL}/game/new`, {
method: 'POST',
headers: {
Authorization: 'Bearer ' + token,
@@ -103,77 +103,77 @@ export class NewGameForm extends React.Component {
render() {
return ReactDOM.createPortal(
- <div className="fade-main">
- <div className="sticky">
+ <div className='fade-main'>
+ <div className='sticky'>
<span
- id="closeNewGameFormX"
- className="close"
+ id='closeNewGameFormX'
+ className='close'
onClick={this.handleView}
>
×
</span>
</div>
- <div className="">
+ <div className=''>
<form onSubmit={this.handleGameCreation}>
<h1>Demo Game Creation</h1>
<br />
<input
- placeholder="Game name"
- name="gamename"
+ placeholder='Game name'
+ name='gamename'
value={this.state.gamename}
onChange={this.handleChange}
- id="newGameNameInput"
+ id='newGameNameInput'
/>
<br />
<input
- placeholder="Description"
- type="text"
- name="description"
+ placeholder='Description'
+ type='text'
+ name='description'
value={this.state.description}
onChange={this.handleChange}
- id="newGameDescriptionInput"
+ id='newGameDescriptionInput'
/>
<br />
- <label className="">Start:</label>
+ <label className=''>Start:</label>
<input
- className="formDate"
- type="date"
- name="startDate"
+ className='formDate'
+ type='date'
+ name='startDate'
value={this.state.startDate}
onChange={this.handleChange}
- id="newGameDateStartInput"
+ id='newGameDateStartInput'
/>
<input
- className="formTime"
- type="time"
- name="startTime"
+ className='formTime'
+ type='time'
+ name='startTime'
onChange={this.handleChange}
- id="newGameTimeStartInput"
+ id='newGameTimeStartInput'
/>
<br />
- <label className="">End:</label>
+ <label className=''>End:</label>
<input
- className="formDate"
- type="date"
- name="endDate"
+ className='formDate'
+ type='date'
+ name='endDate'
value={this.state.endDate}
onChange={this.handleChange}
min={this.state.startDate}
- id="newGameDateEndInput"
+ id='newGameDateEndInput'
/>
<input
- className="formTime"
- type="time"
- name="endTime"
+ className='formTime'
+ type='time'
+ name='endTime'
onChange={this.handleChange}
- id="newGameTimeEndInput"
+ id='newGameTimeEndInput'
/>
<br />
<label>Map things</label>
<br />
<Map
- id="newGameCenterMap"
- className=""
+ id='newGameCenterMap'
+ className=''
center={[this.state.mapCenter.lat, this.state.mapCenter.lng]}
zoom={this.state.zoom}
style={{ height: '400px', width: '400px' }}
@@ -181,12 +181,12 @@ export class NewGameForm extends React.Component {
onzoomend={this.handleMapScroll}
>
<TileLayer
- attribution="Maanmittauslaitoksen kartta"
- url=" https://tiles.kartat.kapsi.fi/taustakartta/{z}/{x}/{y}.jpg"
+ attribution='Maanmittauslaitoksen kartta'
+ url=' https://tiles.kartat.kapsi.fi/taustakartta/{z}/{x}/{y}.jpg'
/>
</Map>
<br />
- <button id="newGameSubmitButton" type="submit">
+ <button id='newGameSubmitButton' type='submit'>
Submit
</button>
<h2>{this.state.errorMsg}</h2>
diff --git a/src/components/RegisterForm.js b/src/components/RegisterForm.js
index 960731a446dc6ac6fd9210f7d9b74cbe46066874..a2706f12668bdfe6306cd7b2c9d6c0d405da08f1 100644
--- a/src/components/RegisterForm.js
+++ b/src/components/RegisterForm.js
@@ -44,7 +44,7 @@ export class RegisterForm extends React.Component {
this.handleError('Passwords do not match');
} else {
// Send register info to the server
- fetch('http://localhost:5000/user/register', {
+ fetch(`${process.env.REACT_APP_URL}/user/register`, {
method: 'POST',
headers: {
Accept: 'application/json',