import React from "react";
import "./weatherForecastData.css";
const HistoricalWeatherData = (props) => {
return (
);
function getData() {
const city_text = document.getElementById("city_text").value;
const region_text = document.getElementById("region_text").value;
const country_text = document.getElementById("country_text").value;
const latitude_text = document.getElementById("latitude_text").value;
const longitude_text = document.getElementById("longitude_text").value;
const timezone_text = document.getElementById("timezone_text").value;
//Checkboxes
const latitude = document.getElementById("latitude").checked;
const longitude = document.getElementById("longitude").checked;
const generationtime_ms = document.getElementById("generationtime_ms").checked;
const utc_offset_seconds = document.getElementById("utc_offset_seconds").checked;
const timezone = document.getElementById("timezone").checked;
const timezone_abbreviation = document.getElementById("timezone_abbreviation").checked;
const elevation = document.getElementById("elevation").checked;
const hourly_time = document.getElementById("hourly_time").checked;
const temperature_2m = document.getElementById("temperature_2m").checked;
const relative_humidity_2m = document.getElementById("relative_humidity_2m").checked;
const precipitation = document.getElementById("precipitation").checked;
const surface_pressure = document.getElementById("surface_pressure").checked;
const wind_speed_10m = document.getElementById("wind_speed_10m").checked;
const wind_direction_10m = document.getElementById("wind_direction_10m").checked;
const wind_gusts_10m = document.getElementById("wind_gusts_10m").checked;
const daily_time = document.getElementById("daily_time").checked;
const temperature_2m_max = document.getElementById("temperature_2m_max").checked;
const temperature_2m_min = document.getElementById("temperature_2m_min").checked;
const temperature_2m_mean = document.getElementById("temperature_2m_mean").checked;
const precipitation_sum = document.getElementById("precipitation_sum").checked;
const precipitation_hours = document.getElementById("precipitation_hours").checked;
const wind_speed_10m_max = document.getElementById("wind_speed_10m_max").checked;
const wind_gusts_10m_max = document.getElementById("wind_gusts_10m_max").checked;
const wind_direction_10m_dominant = document.getElementById("wind_direction_10m_dominant").checked;
let filterArray = [];
if (latitude) {
filterArray.push("latitude");
}
if (longitude) {
filterArray.push("longitude");
}
if (generationtime_ms) {
filterArray.push("generationtime_ms");
}
if (utc_offset_seconds) {
filterArray.push("utc_offset_seconds");
}
if (timezone) {
filterArray.push("timezone");
}
if (timezone_abbreviation) {
filterArray.push("timezone_abbreviation");
}
if (elevation) {
filterArray.push("elevation");
}
if (hourly_time) {
filterArray.push("hourly.time");
}
if (temperature_2m) {
filterArray.push("hourly.temperature_2m");
}
if (relative_humidity_2m) {
filterArray.push("hourly.relative_humidity_2m");
}
if (precipitation) {
filterArray.push("hourly.precipitation");
}
if (surface_pressure) {
filterArray.push("hourly.surface_pressure");
}
if (wind_speed_10m) {
filterArray.push("hourly.wind_speed_10m");
}
if (wind_direction_10m) {
filterArray.push("hourly.wind_direction_10m");
}
if (wind_gusts_10m) {
filterArray.push("hourly.wind_gusts_10m");
}
if (daily_time) {
filterArray.push("daily.time");
}
if (temperature_2m_max) {
filterArray.push("daily.temperature_2m_max");
}
if (temperature_2m_min) {
filterArray.push("daily.temperature_2m_min");
}
if (temperature_2m_mean) {
filterArray.push("daily.temperature_2m_mean");
}
if (precipitation_sum) {
filterArray.push("daily.precipitation_sum");
}
if (precipitation_hours) {
filterArray.push("daily.precipitation_hours");
}
if (wind_speed_10m_max) {
filterArray.push("daily.wind_speed_10m_max");
}
if (wind_gusts_10m_max) {
filterArray.push("daily.wind_gusts_10m_max");
}
if (wind_direction_10m_dominant) {
filterArray.push("daily.wind_direction_10m_dominant");
}
let filterString = filterArray.join(",");
console.log("FilterString = " + filterString);
const apiUrl = `http://localhost:8080/currentweather?q=${city_text}&filter=${filterString}`;
fetch(apiUrl)
.then((response) => {
if (!response.ok) {
throw new Error("Network response was not ok");
}
return response.json();
})
.then((data) => {
// Wetterdaten anzeigen
document.getElementById("weatherData").innerText = JSON.stringify(
data,
null,
2
);
document.getElementById("apiUrloutput").value = apiUrl;
})
.catch((error) => {
console.error("There was a problem with the fetch operation:", error);
});
}
function searchAPI() {
const cityInput = document.getElementById("city").value;
const apiKey = "1244099aeaee4b179e6111803241304";
const apiUrl = `https://api.weatherapi.com/v1/search.json?key=${apiKey}&q=${cityInput}`;
fetch(apiUrl)
.then((response) => {
if (!response.ok) {
throw new Error("Network response was not ok");
}
return response.json();
})
.then((data) => {
// Wetterdaten anzeigen
document.getElementById("weatherData").innerText = JSON.stringify(
data,
null,
2
);
})
.catch((error) => {
console.error("There was a problem with the fetch operation:", error);
});
}
function boolToWord(bool) {
return bool ? "yes" : "no";
}
};
export default HistoricalWeatherData;