diff --git a/WeatherApp/kunal-511/Faridabad.js b/WeatherApp/kunal-511/Faridabad.js new file mode 100644 index 000000000..c4796e3d9 --- /dev/null +++ b/WeatherApp/kunal-511/Faridabad.js @@ -0,0 +1,45 @@ +async function fetchData() { + const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Faridabad'; + const options = { + method: 'GET', + headers: { + 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', + 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' + } + }; + + try { + const response = await fetch(url, options); + const result = await response.json(); + console.log(result); + + // cloud_pct.innerHTML = result.cloud_pct; + tempFaridabad.innerHTML = result.temp; + feels_likeFaridabad.innerHTML = result.feels_like; + humidityFaridabad.innerHTML = result.humidity; + min_tempFaridabad.innerHTML = result.min_temp; + max_tempFaridabad.innerHTML = result.max_temp; + wind_speedFaridabad.innerHTML = result.wind_speed; + wind_degreesFaridabad.innerHTML = result.wind_degrees; + sunriseFaridabad.innerHTML = result.sunrise; + sunsetFaridabad.innerHTML = result.sunset; + + // Use the retrieved data as needed + // ... + + } catch (error) { + console.error(error); + } + } + + fetchData(); + + + + + + + + + + \ No newline at end of file diff --git a/WeatherApp/kunal-511/Hyderabad.js b/WeatherApp/kunal-511/Hyderabad.js new file mode 100644 index 000000000..cf343e59f --- /dev/null +++ b/WeatherApp/kunal-511/Hyderabad.js @@ -0,0 +1,45 @@ +async function fetchData() { + const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Hyderabad'; + const options = { + method: 'GET', + headers: { + 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', + 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' + } + }; + + try { + const response = await fetch(url, options); + const result = await response.json(); + console.log(result); + + // cloud_pct.innerHTML = result.cloud_pct; + tempHyderabad.innerHTML = result.temp; + feels_likeHyderabad.innerHTML = result.feels_like; + humidityHyderabad.innerHTML = result.humidity; + min_tempHyderabad.innerHTML = result.min_temp; + max_tempHyderabad.innerHTML = result.max_temp; + wind_speedHyderabad.innerHTML = result.wind_speed; + wind_degreesHyderabad.innerHTML = result.wind_degrees; + sunriseHyderabad.innerHTML = result.sunrise; + sunsetHyderabad.innerHTML = result.sunset; + + // Use the retrieved data as needed + // ... + + } catch (error) { + console.error(error); + } + } + + fetchData(); + + + + + + + + + + \ No newline at end of file diff --git a/WeatherApp/kunal-511/Jaipur.js b/WeatherApp/kunal-511/Jaipur.js new file mode 100644 index 000000000..16b125567 --- /dev/null +++ b/WeatherApp/kunal-511/Jaipur.js @@ -0,0 +1,45 @@ +async function fetchData() { + const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Jaipur'; + const options = { + method: 'GET', + headers: { + 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', + 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' + } + }; + + try { + const response = await fetch(url, options); + const result = await response.json(); + console.log(result); + + // cloud_pct.innerHTML = result.cloud_pct; + tempJaipur.innerHTML = result.temp; + feels_likeJaipur.innerHTML = result.feels_like; + humidityJaipur.innerHTML = result.humidity; + min_tempJaipur.innerHTML = result.min_temp; + max_tempJaipur.innerHTML = result.max_temp; + wind_speedJaipur.innerHTML = result.wind_speed; + wind_degreesJaipur.innerHTML = result.wind_degrees; + sunriseJaipur.innerHTML = result.sunrise; + sunsetJaipur.innerHTML = result.sunset; + + // Use the retrieved data as needed + // ... + + } catch (error) { + console.error(error); + } + } + + fetchData(); + + + + + + + + + + \ No newline at end of file diff --git a/WeatherApp/kunal-511/London.js b/WeatherApp/kunal-511/London.js new file mode 100644 index 000000000..bb6a05a49 --- /dev/null +++ b/WeatherApp/kunal-511/London.js @@ -0,0 +1,45 @@ +async function fetchData() { + const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=London'; + const options = { + method: 'GET', + headers: { + 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', + 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' + } + }; + + try { + const response = await fetch(url, options); + const result = await response.json(); + console.log(result); + + // cloud_pct.innerHTML = result.cloud_pct; + tempLondon.innerHTML = result.temp; + feels_likeLondon.innerHTML = result.feels_like; + humidityLondon.innerHTML = result.humidity; + min_tempLondon.innerHTML = result.min_temp; + max_tempLondon.innerHTML = result.max_temp; + wind_speedLondon.innerHTML = result.wind_speed; + wind_degreesLondon.innerHTML = result.wind_degrees; + sunriseLondon.innerHTML = result.sunrise; + sunsetLondon.innerHTML = result.sunset; + + // Use the retrieved data as needed + // ... + + } catch (error) { + console.error(error); + } + } + + fetchData(); + + + + + + + + + + \ No newline at end of file diff --git a/WeatherApp/kunal-511/Untitled-1.txt b/WeatherApp/kunal-511/Untitled-1.txt new file mode 100644 index 000000000..a63ce5760 --- /dev/null +++ b/WeatherApp/kunal-511/Untitled-1.txt @@ -0,0 +1,39 @@ +{"Cloud_pct": 100, +"Temp": 13, + "Feels_like": 12, + "Humidity": 77, + "Min_temp": 11, + "Wax_temp": 15, + "Wind_speed": 4.63, + "Wind_degrees": 250, + "Sunrise": 1684758254, + "Sunset": 1684813682} + + + + cloud_pct = response.cloud_pct +temp = response.temp + feels_like = response.feels_like + humidity = response.humidity + min_temp = response.min_temp + max_temp = response.max_temp + wind_speed = response.wind_speed + wind_degrees = response.wind_degrees + sunrise = response.sunrise + sunset = response.sunset + + + + + { + "cloud_pct": 0, + "temp": 19, + "feels_like": 19, + "humidity": 69, + "min_temp": 17, + "max_temp": 19, + "wind_speed": 2, + "wind_degrees": 150, + "sunrise": 1684875241, + "sunset": 1684925291 +} \ No newline at end of file diff --git a/WeatherApp/kunal-511/boston.js b/WeatherApp/kunal-511/boston.js new file mode 100644 index 000000000..a8bdb470b --- /dev/null +++ b/WeatherApp/kunal-511/boston.js @@ -0,0 +1,45 @@ +async function fetchData() { + const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Boston'; + const options = { + method: 'GET', + headers: { + 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', + 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' + } + }; + + try { + const response = await fetch(url, options); + const result = await response.json(); + console.log(result); + + // cloud_pct.innerHTML = result.cloud_pct; + tempBoston.innerHTML = result.temp; + feels_likeBoston.innerHTML = result.feels_like; + humidityBoston.innerHTML = result.humidity; + min_tempBoston.innerHTML = result.min_temp; + max_tempBoston.innerHTML = result.max_temp; + wind_speedBoston.innerHTML = result.wind_speed; + wind_degreesBoston.innerHTML = result.wind_degrees; + sunriseBoston.innerHTML = result.sunrise; + sunsetBoston.innerHTML = result.sunset; + + // Use the retrieved data as needed + // ... + + } catch (error) { + console.error(error); + } + } + + fetchData(); + + + + + + + + + + \ No newline at end of file diff --git a/WeatherApp/kunal-511/day-with-clouds-weather-app-screen-mobile-interface-design-forecast-weather-background-time-concept-vector-banner_87946-4137.avif b/WeatherApp/kunal-511/day-with-clouds-weather-app-screen-mobile-interface-design-forecast-weather-background-time-concept-vector-banner_87946-4137.avif new file mode 100644 index 000000000..fa3b8ae00 Binary files /dev/null and b/WeatherApp/kunal-511/day-with-clouds-weather-app-screen-mobile-interface-design-forecast-weather-background-time-concept-vector-banner_87946-4137.avif differ diff --git a/WeatherApp/kunal-511/shanghai.js b/WeatherApp/kunal-511/shanghai.js new file mode 100644 index 000000000..2756f3c36 --- /dev/null +++ b/WeatherApp/kunal-511/shanghai.js @@ -0,0 +1,45 @@ +async function fetchData() { + const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Shanghai'; + const options = { + method: 'GET', + headers: { + 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', + 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' + } + }; + + try { + const response = await fetch(url, options); + const result = await response.json(); + console.log(result); + + // cloud_pct.innerHTML = result.cloud_pct; + tempShanghai.innerHTML = result.temp; + feels_likeShanghai.innerHTML = result.feels_like; + humidityShanghai.innerHTML = result.humidity; + min_tempShanghai.innerHTML = result.min_temp; + max_tempShanghai.innerHTML = result.max_temp; + wind_speedShanghai.innerHTML = result.wind_speed; + wind_degreesShanghai.innerHTML = result.wind_degrees; + sunriseShanghai.innerHTML = result.sunrise; + sunsetShanghai.innerHTML = result.sunset; + + // Use the retrieved data as needed + // ... + + } catch (error) { + console.error(error); + } + } + + fetchData(); + + + + + + + + + + \ No newline at end of file diff --git a/WeatherApp/kunal-511/weather.css b/WeatherApp/kunal-511/weather.css new file mode 100644 index 000000000..6cbe6bd55 --- /dev/null +++ b/WeatherApp/kunal-511/weather.css @@ -0,0 +1,43 @@ +main{ + margin-top: 100px; + +} +body{ + background-color: darkblue; +} + +.invisible{ + display: block; + position: absolute; +} + +/* .card-body{ + height: 191.333px; +} +.mt-3 li { + font-size: 1.3rem; +} */ +.container{ + background-image: url(day-with-clouds-weather-app-screen-mobile-interface-design-forecast-weather-background-time-concept-vector-banner_87946-4137.avif); + background-repeat: no-repeat; + background-size: cover; + color: white; +} +.my-4{ + color: white; + +} +.common{ + font-weight: bolder; +} +.py-3{ + background-color: #0D6EFD; + color: white; + font-weight: bolder; +} +.btn:hover{ + background-color: #0D6EFD; +} +.nav-link:hover{ + color: #0D6EFD; +} diff --git a/WeatherApp/kunal-511/weather.html b/WeatherApp/kunal-511/weather.html new file mode 100644 index 000000000..4681cf05c --- /dev/null +++ b/WeatherApp/kunal-511/weather.html @@ -0,0 +1,227 @@ + + + + + + My Weather App + + + + + + +
+

Weather For

+
+
+
+
+
+

Temperature

+
+
+ +
    +
  • Temperature is °C
    • +
  • Min Temperature is °C
    • +
  • Max Temperature is °C
    • + +
+ +
+
+
+
+
+
+

Humidity Info

+
+
+ +
    +
  • Cloud PCT is +
  • Feels like is +
  • Humidity is +
+ +
+
+
+
+
+
+

Wind Info

+
+
+ +
    +
  • Wind speed is
    • +
  • Sunrise Time is
    • +
  • Sunset Time is
    • +
+ +
+
+
+
+ +

Weather of other common Places

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TempFeels_likeHumidity Min_temp Max_temp Wind_speed Wind_degrees Sunrise Sunset
Shanghai
Boston
Faridabad
Jaipur
London
Hyderabad
+
+
+
+ + + + + + + + + + + + \ No newline at end of file diff --git a/WeatherApp/kunal-511/weather.js b/WeatherApp/kunal-511/weather.js new file mode 100644 index 000000000..2e118c289 --- /dev/null +++ b/WeatherApp/kunal-511/weather.js @@ -0,0 +1,161 @@ +// async function fetchData() { +// const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Seattle'; +// const options = { +// method: 'GET', +// headers: { +// 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', +// 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' +// } +// }; + +// try { +// const response = await fetch(url, options); +// const result = await response.text(); +// console.log(result); +// } catch (error) { +// console.error(error); +// } +// } + +// fetchData(); + + + + +// async function fetchData() { +// const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Seattle'; +// const options = { +// method: 'GET', +// headers: { +// 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', +// 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' +// } +// }; + +// try { +// const response = await fetch(url, options); +// const result = await response.text({ +// console.log(result) + + +// cloud_pct = response.cloud_pct, +// temp = response.temp, +// feels_like = response.feels_like, +// humidity = response.humidity, +// min_temp = response.min_temp, +// max_temp = response.max_temp, +// wind_speed = response.wind_speed +// wind_degrees = response.wind_degrees, +// sunrise = response.sunrise, +// sunset = response.sunset, +// }) + +// } catch (error) { +// console.error(error); +// } +// } + +// fetchData(); + + +// RUNNING PROPERLY + +// async function fetchData() { +// const url = 'https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=Shanghai'; +// const options = { +// method: 'GET', +// headers: { +// 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', +// 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' +// } +// }; + +// try { +// const response = await fetch(url, options); +// const result = await response.json(); +// console.log(result); + +// cloud_pct.innerHTML = result.cloud_pct; +// temp.innerHTML = result.temp; +// feels_like.innerHTML = result.feels_like; +// humidity.innerHTML = result.humidity; +// min_temp.innerHTML = result.min_temp; +// max_temp.innerHTML = result.max_temp; +// wind_speed.innerHTML = result.wind_speed; +// wind_degrees.innerHTML = result.wind_degrees; +// sunrise.innerHTML = result.sunrise; +// sunset.innerHTML = result.sunset; + +// // Use the retrieved data as needed +// // ... + +// } catch (error) { +// console.error(error); +// } +// } + +// fetchData(); + + + + + + +const options = { + method: 'GET', + headers: { + 'X-RapidAPI-Key': '9ae224ae17msh167ad0acab752d5p1d336fjsn4e3fa840bf04', + 'X-RapidAPI-Host': 'weather-by-api-ninjas.p.rapidapi.com' + } + }; + + const getWeather = (city) => { + cityName.innerHTML = city + fetch(`https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city=${city}`, options) + // fetch('https://weather-by-api-ninjas.p.rapidapi.com/v1/weather?city= '+ city, options) + .then(response => { + if (!response.ok) { + throw new Error('Network response was not ok'); + } + return response.json(); + }) + .then(response => { + console.log(response); + + // Update the HTML elements with weather data + cloud_pct.innerHTML = response.cloud_pct; + temp.innerHTML = response.temp; + feels_like.innerHTML = response.feels_like; + humidity.innerHTML = response.humidity; + min_temp.innerHTML = response.min_temp; + max_temp.innerHTML = response.max_temp; + wind_speed.innerHTML = response.wind_speed; + wind_degrees.innerHTML = response.wind_degrees; + sunrise.innerHTML = response.sunrise; + sunset.innerHTML = response.sunset; + }) + .catch(err => console.error(err)); + }; +submit.addEventListener("click", (e)=>{ + e.preventDefault() + getWeather(city.value) +}) + +getWeather("Delhi") + + + + + + + + + + + + + + + + + \ No newline at end of file