1
- const input = document . getElementById ( " input" ) ;
2
- const btn = document . getElementById ( " btn" ) ;
3
- const apiKey = " e3a46268fdc2475cb63214712240202" ;
4
- const cityName = document . getElementById ( " city-name" ) ;
5
- const dateTime = document . getElementById ( " date-time" ) ;
6
- const condition2 = document . getElementById ( " condition2" ) ;
7
- const temp = document . getElementById ( " temp" ) ;
8
- const humidity = document . getElementById ( " humidity" ) ;
9
- const countryy = document . getElementById ( " country" ) ;
10
- const locat = document . getElementById ( " getlocation" ) ;
11
- const cities = document . getElementsByClassName ( " city" ) ;
12
- const icon = document . getElementById ( " icon" ) ;
13
- const body = document . querySelector ( " .weather-app" ) ;
1
+ const input = document . getElementById ( ' input' ) ;
2
+ const btn = document . getElementById ( ' btn' ) ;
3
+ const apiKey = ' e3a46268fdc2475cb63214712240202' ;
4
+ const cityName = document . getElementById ( ' city-name' ) ;
5
+ const dateTime = document . getElementById ( ' date-time' ) ;
6
+ const condition2 = document . getElementById ( ' condition2' ) ;
7
+ const temp = document . getElementById ( ' temp' ) ;
8
+ const humidity = document . getElementById ( ' humidity' ) ;
9
+ const countryy = document . getElementById ( ' country' ) ;
10
+ const locat = document . getElementById ( ' getlocation' ) ;
11
+ const cities = document . getElementsByClassName ( ' city' ) ;
12
+ const icon = document . getElementById ( ' icon' ) ;
13
+ const body = document . querySelector ( ' .weather-app' ) ;
14
14
const fetchData = async ( url ) => {
15
15
try {
16
16
const data = await fetch ( url ) ;
@@ -29,9 +29,9 @@ const updateWeatherInfo = (result) => {
29
29
if ( error ) {
30
30
cityName . innerText = `Error: ${ error . message } ` ;
31
31
[ countryy , dateTime , temp , humidity , condition2 , icon ] . forEach ( ( elem ) => {
32
- elem . innerText = "" ;
32
+ elem . innerText = '' ;
33
33
} ) ;
34
- icon . src = "" ;
34
+ icon . src = '' ;
35
35
} else {
36
36
const { name, country, localtime } = location ;
37
37
console . log ( country ) ;
@@ -43,7 +43,7 @@ const updateWeatherInfo = (result) => {
43
43
condition2 . innerText = current . condition . text ;
44
44
icon . src = current . condition . icon ;
45
45
46
- const isDay = current . is_day === 1 ? " day" : " night" ;
46
+ const isDay = current . is_day === 1 ? ' day' : ' night' ;
47
47
const codes = [
48
48
[ 1000 , 10000 , 10001 , 1100 , 11001 , 11000 , 51190 , 60030 ] , // clear
49
49
[
@@ -78,38 +78,37 @@ const updateWeatherInfo = (result) => {
78
78
const getData = async ( cityName ) => {
79
79
try {
80
80
const result = await fetchData (
81
- `https://api.weatherapi.com/v1/current.json?key=${ apiKey } &q=${ cityName } &aqi=no`
81
+ `https://api.weatherapi.com/v1/current.json?key=${ apiKey } &q=${ cityName } &aqi=no` ,
82
82
) ;
83
83
return result ;
84
84
} catch ( error ) {
85
85
return {
86
- error : { message : " Failed to fetch data. Please try again later." } ,
86
+ error : { message : ' Failed to fetch data. Please try again later.' } ,
87
87
} ;
88
88
}
89
89
} ;
90
- const getlocation = async ( lat , long ) =>
91
- fetchData (
92
- `https://api.weatherapi.com/v1/current.json?key=${ apiKey } &q=${ lat } ,${ long } &aqi=no`
93
- ) ;
90
+ const getlocation = async ( lat , long ) => fetchData (
91
+ `https://api.weatherapi.com/v1/current.json?key=${ apiKey } &q=${ lat } ,${ long } &aqi=no` ,
92
+ ) ;
94
93
95
94
const gotlocation = async ( position ) => {
96
95
try {
97
96
const result = await getlocation (
98
97
position . coords . latitude ,
99
- position . coords . longitude
98
+ position . coords . longitude ,
100
99
) ;
101
100
console . log ( result ) ;
102
101
updateWeatherInfo ( result ) ;
103
102
} catch ( error ) {
104
- cityName . innerText = " Error fetching weather based on location" ;
103
+ cityName . innerText = ' Error fetching weather based on location' ;
105
104
}
106
105
} ;
107
- const failedlocation = ( ) => console . log ( " failed to locate location" ) ;
106
+ const failedlocation = ( ) => console . log ( ' failed to locate location' ) ;
108
107
109
- btn . addEventListener ( " click" , async ( e ) => {
108
+ btn . addEventListener ( ' click' , async ( e ) => {
110
109
try {
111
110
if ( input . value . length === 0 ) {
112
- alert ( " Please type a city name" ) ;
111
+ alert ( ' Please type a city name' ) ;
113
112
} else {
114
113
const { value } = input ;
115
114
const result = await getData ( value ) ;
@@ -118,23 +117,21 @@ btn.addEventListener("click", async (e) => {
118
117
console . log ( result ) ;
119
118
}
120
119
} catch ( error ) {
121
- cityName . innerText = " Error to fetch weather" ;
120
+ cityName . innerText = ' Error to fetch weather' ;
122
121
}
123
122
e . preventDefault ( ) ;
124
123
} ) ;
125
124
126
- locat . addEventListener ( "click" , ( ) =>
127
- navigator . geolocation . getCurrentPosition ( gotlocation , failedlocation )
128
- ) ;
125
+ locat . addEventListener ( 'click' , ( ) => navigator . geolocation . getCurrentPosition ( gotlocation , failedlocation ) ) ;
129
126
const citiesArray = [ ...cities ] ;
130
127
citiesArray . forEach ( ( element ) => {
131
- element . addEventListener ( " click" , async ( ) => {
128
+ element . addEventListener ( ' click' , async ( ) => {
132
129
const cityName = element . innerText ;
133
130
const result = await getData ( cityName ) ;
134
131
updateWeatherInfo ( result ) ;
135
132
} ) ;
136
133
} ) ;
137
134
138
- window . addEventListener ( " load" , async ( ) => {
135
+ window . addEventListener ( ' load' , async ( ) => {
139
136
navigator . geolocation . getCurrentPosition ( gotlocation , failedlocation ) ;
140
137
} ) ;
0 commit comments