tanguy/homepage
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Get live geolocation for weather

Browse source
This commit is contained in:
Tanguy Gérôme 2025-06-21 15:56:29 +03:00
parent 7d73080e30
commit 4ed7513e77
Signed by: tanguy
GPG key ID: 10B2947233740B88
3 changed files with 22 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
Cargo.toml
View file

@ -8,9 +8,9 @@ authors = ["Tanguy Gérôme <tanguy@juustodiilerit.fi>"]
[dependencies] [dependencies]
# leptos = { version = "0.7", features = ["nightly"] } # leptos = { version = "0.7", features = ["nightly"] }
leptos = { version = "0.8", features = ["csr"] } leptos = { version = "0.8", features = ["csr", "nightly"] }
# leptos_router = { version = "0.7", features = ["nightly"] } # leptos_router = { version = "0.7", features = ["nightly"] }
leptos_router = { version = "0.8" } leptos_router = { version = "0.8", features = ["nightly"] }
leptos_meta = { version = "0.8" } leptos_meta = { version = "0.8" }
console_log = "1" console_log = "1"
log = "0.4" log = "0.4"

5
public/styles.scss
View file

@ -107,6 +107,11 @@ body {
} }
.weather { .weather {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
.forecast-per-hours { .forecast-per-hours {
// background: white; // background: white;
// color: black; // color: black;

22
src/lib.rs
View file

@ -1,6 +1,6 @@
use leptos::prelude::*; use leptos::{leptos_dom::logging, prelude::*};
use leptos_meta::*; use leptos_meta::*;
use leptos_use::{use_timestamp}; use leptos_use::{use_geolocation, use_timestamp};
use chrono::{prelude::{DateTime, Local, Timelike}, NaiveDateTime}; use chrono::{prelude::{DateTime, Local, Timelike}, NaiveDateTime};
use calendrier::{DateTime as FRDateTime, Timestamp as FRTimestamp}; use calendrier::{DateTime as FRDateTime, Timestamp as FRTimestamp};
use serde_json::Value; use serde_json::Value;
@ -9,8 +9,15 @@ pub mod wmo;
#[component] #[component]
pub fn Weather() -> impl IntoView { pub fn Weather() -> impl IntoView {
let weather_json = LocalResource::new(async move || { let geolocation = use_geolocation();
let json_response = reqwest::get("https://api.open-meteo.com/v1/forecast?latitude=60.236610&longitude=25.083630&timezone=auto&forecast_hours=17&wind_speed_unit=kn&hourly=temperature_2m,wind_speed_10m,precipitation,precipitation_probability,weather_code,is_day").await
let coords = move || match geolocation.coords.get() {
Some(coords) => (coords.latitude(), coords.longitude()),
_ => (60.23661, 25.08363)
};
let weather_json = LocalResource::new(move || async move {
logging::console_log(&format!("{:?}", &coords()));
let json_response = reqwest::get(format!("https://api.open-meteo.com/v1/forecast?latitude={}&longitude={}&timezone=auto&forecast_hours=17&wind_speed_unit=kn&hourly=temperature_2m,wind_speed_10m,precipitation,precipitation_probability,weather_code,is_day", coords().0, coords().1)).await
.and_then(|response| Ok(response.json::<Value>())); .and_then(|response| Ok(response.json::<Value>()));
match json_response { match json_response {
Ok(result) => Some(result.await.ok()), Ok(result) => Some(result.await.ok()),
@ -64,7 +71,8 @@ pub fn Weather() -> impl IntoView {
view! { view! {
<div class="weather"> <div class="weather">
<Suspense fallback=move || view! { <p>"Loading..."</p> }> <Transition fallback=move || view! { <p>"Loading..."</p> }>
<span>sää @ {move || coords().0};{move || coords().1}</span>
<div class="forecast-per-hours"> <div class="forecast-per-hours">
<table class="forecast-per-hours"> <table class="forecast-per-hours">
<tr class="time"> <tr class="time">
@ -89,7 +97,7 @@ pub fn Weather() -> impl IntoView {
</tr> </tr>
</table> </table>
</div> </div>
</Suspense> </Transition>
</div> </div>
} }
} }
@ -112,7 +120,7 @@ pub fn Times() -> impl IntoView {
let fr_time = format!("{:02}:{:02}:{:02}", fr_hours, fr_minutes, fr_seconds); let fr_time = format!("{:02}:{:02}:{:02}", fr_hours, fr_minutes, fr_seconds);
fr_time fr_time
}); });
let fr_date_time = move || format!("{}, {}", fr_date.get().to_string_default(), fr_time.get()); let fr_date_time = move || format!("{}, {}", fr_date.get().to_string_default().to_lowercase(), fr_time.get());
let fi_date_time = move || local_now.get().format_localized("%A %e %B %Y, %H.%M.%S", chrono::Locale::fi_FI).to_string(); let fi_date_time = move || local_now.get().format_localized("%A %e %B %Y, %H.%M.%S", chrono::Locale::fi_FI).to_string();