Skip to content

Commit

Permalink
adds favorite functionality
Browse files Browse the repository at this point in the history
  • Loading branch information
Gabriel Russell authored and Gabriel Russell committed Nov 30, 2020
1 parent de588ab commit ab4cecb
Show file tree
Hide file tree
Showing 4 changed files with 121 additions and 50 deletions.
2 changes: 1 addition & 1 deletion .eslintcache
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
[{"/Users/gabrielrussell/code/world-weather-app/src/reportWebVitals.js":"1","/Users/gabrielrussell/code/world-weather-app/src/App.js":"2","/Users/gabrielrussell/code/world-weather-app/src/index.js":"3"},{"size":362,"mtime":1606235130117,"results":"4","hashOfConfig":"5"},{"size":6891,"mtime":1606688186814,"results":"6","hashOfConfig":"5"},{"size":500,"mtime":1606235130116,"results":"7","hashOfConfig":"5"},{"filePath":"8","messages":"9","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"139zll3",{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/gabrielrussell/code/world-weather-app/src/reportWebVitals.js",[],"/Users/gabrielrussell/code/world-weather-app/src/App.js",[],"/Users/gabrielrussell/code/world-weather-app/src/index.js",[]]
[{"/Users/gabrielrussell/code/world-weather-app/src/reportWebVitals.js":"1","/Users/gabrielrussell/code/world-weather-app/src/App.js":"2","/Users/gabrielrussell/code/world-weather-app/src/index.js":"3","/Users/gabrielrussell/code/world-weather-app/src/timezones.js":"4"},{"size":362,"mtime":1606235130117,"results":"5","hashOfConfig":"6"},{"size":7717,"mtime":1606705032729,"results":"7","hashOfConfig":"6"},{"size":500,"mtime":1606235130116,"results":"8","hashOfConfig":"6"},{"size":650,"mtime":1606693764967,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"139zll3",{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/gabrielrussell/code/world-weather-app/src/reportWebVitals.js",[],"/Users/gabrielrussell/code/world-weather-app/src/App.js",[],"/Users/gabrielrussell/code/world-weather-app/src/index.js",[],"/Users/gabrielrussell/code/world-weather-app/src/timezones.js",[]]
117 changes: 70 additions & 47 deletions src/App.js
View file
Original file line number Diff line number Diff line change
@@ -1,53 +1,12 @@
import React, { Component } from 'react';
import TextTransition, { presets } from 'react-text-transition';
import { timezones } from './timezones';

const api = {
key: '6ef9a57a6186cdb062cac9bdef08165c',
base: 'https://api.openweathermap.org/data/2.5/',
};

const timezones = {
'-43200': -12.0,
'-39600': -11.0,
'-36000': -10.0,
'-34200': -9.3,
'-32400': -9.0,
'-28800': -8.0,
'-25200': -7.0,
'-21600': -6.0,
'-18000': -5.0,
'-16200': -4.3,
'-14400': -4.0,
'-12600': -3.3,
'-10800': -3.0,
'-7200': -2.0,
'-3600': -1.0,
// '0': '0',
// '3600': 1.0,
// '7200': 2.0,
// '10800': 3.0,
// '12600': 3.3,
// '14400': 4.0,
// '16200': 4.3,
// '18000': 5.0,
// '19800': 5.3,
// '20700': 5.45,
// '21600': 6.0,
// '23400': 6.3,
// '25200': 7.0,
// '28800': 8.0,
// '32400': 9.0,
// '34200': 9.3,
// '36000': 10.0,
// '37800': 10.3,
// '39600': 11.0,
// '41400': 11.3,
// '43200': 12.0,
// '45900': 12.45,
// '46800': 13.0,
// '50400': 14.0,
};

export default class App extends Component {
constructor() {
super();
Expand All @@ -58,12 +17,18 @@ export default class App extends Component {
home: false,
isImp: true,
climate: '',
favoriteLoc: localStorage.getItem('favLoc'),
favorited: false,
};
}

componentDidMount() {
try {
this.getUserLocation();
if (this.state.favoriteLoc === null) {
this.getUserLocation();
} else {
this.goFavorite();
}
} catch (err) {
console.log(err);
}
Expand All @@ -73,7 +38,6 @@ export default class App extends Component {
navigator.geolocation.getCurrentPosition((location) => {
let lat = location.coords.latitude;
let lon = location.coords.longitude;
console.log(location);
fetch(
`${api.base}weather?lat=${lat}&lon=${lon}&units=imperial&APPID=${api.key}`
)
Expand All @@ -91,6 +55,54 @@ export default class App extends Component {
});
};

favoriteLocation = (evt) => {
if (
this.state.favoriteLoc !==
this.state.weather.name + ', ' + this.state.weather.sys.country
) {
localStorage.setItem(
'favLoc',
this.state.weather.name + ', ' + this.state.weather.sys.country
);
this.setState({
favoriteLoc:
this.state.weather.name + ', ' + this.state.weather.sys.country,
});
} else {
localStorage.removeItem('favLoc');
this.setState({
favoriteLoc: null,
});
}
};

goFavorite = () => {
fetch(
`${api.base}weather?q=${this.state.favoriteLoc}&units=imperial&APPID=${api.key}`
)
.then((res) => res.json())
.then((result) => {
let d = this.locationDateCalc(result);
this.setState({
query: '',
weather: result,
climate: result.weather[0].main.toLowerCase(),
date: d,
});
});
};

checkIfFav = () => {
if (
this.state.favoriteLoc ===
this.state.weather.name + ', ' + this.state.weather.sys.country
) {
return 'star';
} else {
return 'star_border';
}
};

search = (evt) => {
if (evt.key === 'Enter') {
this.setState({ home: false });
Expand Down Expand Up @@ -187,12 +199,12 @@ export default class App extends Component {

let metrics = context.measureText(text);

console.log(metrics.width);
return metrics.width;
};

sizeCheck = () => {
let impTemp = String(Math.round(this.state.weather.main.temp)) + '°F';

let metTemp =
String(Math.round((this.state.weather.main.temp - 32) * (5 / 9))) + '°C';

Expand Down Expand Up @@ -220,15 +232,26 @@ export default class App extends Component {
value={this.state.query}
onKeyPress={this.search}
/>
<i className="material-icons" onClick={this.getUserLocation}>
<i
className="material-icons current-loc"
onClick={this.getUserLocation}
>
{this.state.home === false ? 'location_searching' : 'gps_fixed'}
</i>
</div>
{typeof this.state.weather.main != 'undefined' ? (
<div>
<div className="location-box">
<div className="location">
{this.state.weather.name}, {this.state.weather.sys.country}
{this.state.weather.name},{' '}
{this.state.weather.sys.country + ' '}
<i
className="material-icons favorited-loc"
onClick={this.favoriteLocation}
>
{this.checkIfFav()}
{/* {this.state.favorited === false ? 'star_border' : 'star'} */}
</i>
</div>
<div className="date">{this.state.date.slice(0, 15)}</div>
</div>
Expand Down
11 changes: 9 additions & 2 deletions src/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ main {
background-color: rgba(255, 255, 255, 0.75);
}

.search-box i {
.search-box .current-loc {
position: absolute;
top: 12.5px;

Expand All @@ -109,6 +109,13 @@ main {
text-shadow: 3px 3px rgba(50, 50, 70, 0.5);
}

.location-box .location .favorited-loc {
color: yellow;
text-shadow: none;

cursor: pointer;
}

.location-box .date {
color: #fff;
font-size: 18px;
Expand All @@ -130,7 +137,7 @@ main {
margin: 15px auto;
background-color: rgba(255, 255, 255, 0.2);
border-radius: 16px;

padding: 15px 25px;

color: #fff;
Expand Down
41 changes: 41 additions & 0 deletions src/timezones.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
export const timezones = {
'-43200': -12.0,
'-39600': -11.0,
'-36000': -10.0,
'-34200': -9.3,
'-32400': -9.0,
'-28800': -8.0,
'-25200': -7.0,
'-21600': -6.0,
'-18000': -5.0,
'-16200': -4.3,
'-14400': -4.0,
'-12600': -3.3,
'-10800': -3.0,
'-7200': -2.0,
'-3600': -1.0,
'0': '0',
'3600': 1.0,
'7200': 2.0,
'10800': 3.0,
'12600': 3.3,
'14400': 4.0,
'16200': 4.3,
'18000': 5.0,
'19800': 5.3,
'20700': 5.45,
'21600': 6.0,
'23400': 6.3,
'25200': 7.0,
'28800': 8.0,
'32400': 9.0,
'34200': 9.3,
'36000': 10.0,
'37800': 10.3,
'39600': 11.0,
'41400': 11.3,
'43200': 12.0,
'45900': 12.45,
'46800': 13.0,
'50400': 14.0,
};

0 comments on commit ab4cecb

Please sign in to comment.