Skip to content
Snippets Groups Projects
Commit f297a623 authored by Ari-Pekka Kauppinen's avatar Ari-Pekka Kauppinen
Browse files

Save the first profile to cookie works now

parent a348db81
No related branches found
No related tags found
1 merge request!4Merge develop to master
...@@ -7,11 +7,19 @@ class Start extends Component { ...@@ -7,11 +7,19 @@ class Start extends Component {
super(props); super(props);
this.state = { this.state = {
startWindow: false, startWindow: false,
name: "",
age: 6,
sex: "mies",
city: ""
}; };
this.closeWindow = this.closeWindow.bind(this); this.closeWindow = this.closeWindow.bind(this);
this.createTable = this.createTable.bind(this); this.createTable = this.createTable.bind(this);
this.getCity = this.getCity.bind(this); this.getCity = this.getCity.bind(this);
this.handleSubmit = this.handleSubmit.bind(this); this.handleSubmit = this.handleSubmit.bind(this);
this.handleNameChange = this.handleNameChange.bind(this);
this.handleAgeChange = this.handleAgeChange.bind(this);
this.handleSexChange = this.handleSexChange.bind(this);
this.handleCityChange = this.handleCityChange.bind(this);
} }
handleSubmit(e){ handleSubmit(e){
...@@ -21,9 +29,25 @@ class Start extends Component { ...@@ -21,9 +29,25 @@ class Start extends Component {
const cookies = new Cookies(); const cookies = new Cookies();
//cookie expires in the year 2050 //cookie expires in the year 2050
const date = new Date(2070, 1, 1); const date = new Date(2070, 1, 1);
//Set cookie
//profile string
const profileString = {
name: this.state.name,
age: this.state.age,
sex: this.state.sex,
city: this.state.city
}
//console.log(profile)
//profile string to json
var profile = JSON.stringify(profileString);
//Set first page cookie and save profile to cookie
cookies.set('firstPage', 'true', { path: '/', expires: date }); cookies.set('firstPage', 'true', { path: '/', expires: date });
console.log(cookies.get('firstPage')) cookies.set('Profile', profile, {path: '/', expires: date})
//testprint
//console.log("test: " + JSON.stringify(cookies.get('Profile')))
} }
closeWindow(){ closeWindow(){
...@@ -46,12 +70,30 @@ class Start extends Component { ...@@ -46,12 +70,30 @@ class Start extends Component {
getCity(){ getCity(){
//TODO: Get cities from database //TODO: Get cities from database
return <option>Jyväskylä</option> const tempArr = []
tempArr.push(<option>Jyväskylä</option> )
tempArr.push(<option>Helsinki</option> )
return tempArr
}
// form actions to states
handleNameChange(e){
this.setState({name: e.target.value})
}
handleAgeChange(e){
this.setState({age: e.target.value})
}
handleSexChange(e){
this.setState({sex: e.target.value})
//console.log(e.target.value)
}
handleCityChange(e){
this.setState({city: e.target.value})
} }
render() { render() {
//states //states
const {startWindow } = this.state const {startWindow, name, age, sex, city } = this.state
//if start window is already shown //if start window is already shown
if(startWindow) { if(startWindow) {
...@@ -63,21 +105,22 @@ class Start extends Component { ...@@ -63,21 +105,22 @@ class Start extends Component {
<div className="container"> <div className="container">
<form className="form" onSubmit={this.handleSubmit}> <form className="form" onSubmit={this.handleSubmit}>
<label>Nimimerkki:</label> <label>Nimimerkki:</label>
<input type="text" name="name"></input> <input type="text" name="name" value={name} onChange={this.handleNameChange}></input>
<br /> <br />
<label>Ikä:</label> <label>Ikä:</label>
<select className="field"> <select className="field" value={age} onChange={this.handleAgeChange}>
{this.createTable()} {this.createTable()}
</select> </select>
<br /> <br />
<label> Sukupuoli:</label> <label> Sukupuoli:</label>
<select className="field"> <select className="field" value={sex} onChange={this.handleSexChange}>
<option>Mies</option> <option>Mies</option>
<option>Nainen</option> <option>Nainen</option>
</select> </select>
<br/> <br/>
<label>Kaupunki:</label> <label>Kaupunki:</label>
<select className="field"> <select className="field" value={city} onChange={this.handleCityChange}>
<option>Valitse kaupunki</option>
{this.getCity()} {this.getCity()}
</select> </select>
<br/> <br /> <br/> <br />
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment