WeatherApplicationUsingJS/script.js at main · etk18/WeatherApplicationUsingJS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
letbtn=document.querySelector(".searchBtn");
letinp=document.querySelector(".searchBar");
letcity="";
btn.addEventListener("click",function(){
city=inp.value;
getWeather(city).catch((err)=>{
console.log(err);
alert("City not found");
}
);});


asyncfunctiongetWeather(city){
constapiKey="fbe981722e844bb38f4114014252402";

constapiUrl="https://api.weatherapi.com/v1/current.json?key="+apiKey+"&q="+city;

constresponse=awaitfetch(apiUrl);
constdata=awaitresponse.json();
console.log(data);
document.querySelector(".city").innerHTML=data.location.name;
document.querySelector(".temp").innerHTML=data.current.temp_c+"°C";
document.querySelector(".humidity").innerHTML=data.current.humidity+"%";
document.querySelector(".wind").innerHTML=data.current.wind_kph+"km/h";

if(data.current.condition.text=="Sunny"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/6974/6974833.png";}
elseif(data.current.condition.text=="Partly cloudy"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/4814/4814489.png";}
elseif(data.current.condition.text=="Cloudy"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/414/414927.png";}
elseif(data.current.condition.text=="Overcast"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/3075/3075858.png";}
elseif(data.current.condition.text=="Mist"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/1197/1197102.png";}
elseif(data.current.condition.text=="Moderate rain"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/3093/3093390.png";}
elseif(data.current.condition.text=="Rain"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/1146/1146799.png";}
elseif(data.current.condition.text=="Light rain"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/4735/4735072.png";}
elseif(data.current.condition.text=="Snow"){
document.querySelector(".weatherIcon").src="https://cdn-icons-png.flaticon.com/128/2315/2315309.png";}

}