ramforth/Overlays
2
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add location storage and hide input to weather overlay

Browse Source
This commit is contained in:
ramforth
2025-10-31 10:26:37 +01:00
parent 1f02269e75
commit 0f56d23d44
2 changed files with 43 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
weather_overlay/weather.html
View File

@@ -21,6 +21,26 @@
height: 50px;
margin-right: 20px;
}
#location-container {
background-color: rgba(0, 0, 0, 0.7);
border: 1px solid white;
padding: 10px;
margin-top: 20px;
z-index: 100;
}
#city-input {
padding: 5px;
border: 1px solid #ccc;
border-radius: 5px;
}
#update-button {
padding: 5px 10px;
border: 1px solid #ccc;
border-radius: 5px;
background-color: #4CAF50;
color: white;
cursor: pointer;
}
</style>
</head>
<body>
@@ -41,6 +61,17 @@
const defaultLatitude = 40.71;
const defaultLongitude = -74.01;
function saveLocation(latitude, longitude) {
localStorage.setItem('weather_latitude', latitude);
localStorage.setItem('weather_longitude', longitude);
}
function loadLocation() {
const latitude = localStorage.getItem('weather_latitude');
const longitude = localStorage.getItem('weather_longitude');
return { latitude, longitude };
}
function fetchWeather(latitude, longitude) {
const apiUrl = `https://api.open-meteo.com/v1/forecast?latitude=${latitude}&longitude=${longitude}&current_weather=true`;
@@ -66,7 +97,9 @@
if (data.results && data.results.length > 0) {
const latitude = data.results[0].latitude;
const longitude = data.results[0].longitude;
saveLocation(latitude, longitude);
fetchWeather(latitude, longitude);
document.getElementById('location-container').style.display = 'none';
} else {
alert("Could not find city. Please try again.");
}
@@ -107,8 +140,13 @@
return "https://openweathermap.org/img/wn/03d@2x.png"; // Cloudy
}
// Initial fetch with default location
fetchWeather(defaultLatitude, defaultLongitude);
// Initial fetch
const storedLocation = loadLocation();
if (storedLocation.latitude && storedLocation.longitude) {
fetchWeather(storedLocation.latitude, storedLocation.longitude);
} else {
fetchWeather(defaultLatitude, defaultLongitude);
}
</script>
</body>
</html>