From 43d0566db9ba33c4348d288385171468a15ed5df Mon Sep 17 00:00:00 2001 From: Johannes Heuel Date: Wed, 17 Aug 2022 20:16:52 +0200 Subject: [PATCH] implement justified layout --- Cargo.lock | 309 ++++++++++++-- Cargo.toml | 4 +- backend/Cargo.toml | 3 +- backend/src/lib.rs | 2 +- backend/src/main.rs | 25 +- common/Cargo.toml | 4 +- common/src/lib.rs | 2 +- frontend/Cargo.lock | 711 -------------------------------- frontend/Cargo.toml | 16 +- frontend/index.html | 4 +- frontend/src/gallery/grid.rs | 137 ++++++ frontend/src/gallery/mod.rs | 5 + frontend/src/gallery/picture.rs | 27 ++ frontend/src/main.rs | 201 ++------- 14 files changed, 521 insertions(+), 929 deletions(-) delete mode 100644 frontend/Cargo.lock create mode 100644 frontend/src/gallery/grid.rs create mode 100644 frontend/src/gallery/mod.rs create mode 100644 frontend/src/gallery/picture.rs diff --git a/Cargo.lock b/Cargo.lock index a1b39ea..f57fdd8 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -706,6 +706,36 @@ dependencies = [ "percent-encoding", ] +[[package]] +name = "frontend" +version = "0.1.0" +dependencies = [ + "anyhow", + "common", + "console_error_panic_hook", + "gloo-net", + "pathfinding", + "serde", + "serde_json", + "wasm-bindgen", + "wasm-bindgen-futures", + "weblog", + "wee_alloc", + "ybc", + "yew 0.19.3", + "yew-hooks", + "yewtil", +] + +[[package]] +name = "futures-channel" +version = "0.3.21" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "c3083ce4b914124575708913bca19bfe887522d6e2e6d0952943f5eac4a74010" +dependencies = [ + "futures-core", +] + [[package]] name = "futures-core" version = "0.3.21" @@ -766,10 +796,38 @@ checksum = "68ce6f2dfa9f57f15b848efa2aade5e1850dc72986b87a2b0752d44ca08f4967" dependencies = [ "gloo-console-timer", "gloo-events", - "gloo-file", + "gloo-file 0.1.0", "gloo-timers", ] +[[package]] +name = "gloo" +version = "0.4.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "23947965eee55e3e97a5cd142dd4c10631cc349b48cecca0ed230fd296f568cd" +dependencies = [ + "gloo-console", + "gloo-dialogs", + "gloo-events", + "gloo-file 0.2.3", + "gloo-render", + "gloo-storage", + "gloo-timers", + "gloo-utils", +] + +[[package]] +name = "gloo-console" +version = "0.2.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "3907f786f65bbb4f419e918b0c5674175ef1c231ecda93b2dbd65fd1e8882637" +dependencies = [ + "js-sys", + "serde", + "wasm-bindgen", + "web-sys", +] + [[package]] name = "gloo-console-timer" version = "0.1.0" @@ -779,6 +837,16 @@ dependencies = [ "web-sys", ] +[[package]] +name = "gloo-dialogs" +version = "0.1.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "67062364ac72d27f08445a46cab428188e2e224ec9e37efdba48ae8c289002e6" +dependencies = [ + "wasm-bindgen", + "web-sys", +] + [[package]] name = "gloo-events" version = "0.1.2" @@ -801,6 +869,63 @@ dependencies = [ "web-sys", ] +[[package]] +name = "gloo-file" +version = "0.2.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "a8d5564e570a38b43d78bdc063374a0c3098c4f0d64005b12f9bbe87e869b6d7" +dependencies = [ + "gloo-events", + "js-sys", + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-net" +version = "0.2.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "351e6f94c76579cc9f9323a15f209086fc7bd428bff4288723d3a417851757b2" +dependencies = [ + "futures-channel", + "futures-core", + "futures-sink", + "gloo-utils", + "js-sys", + "pin-project", + "serde", + "serde_json", + "thiserror", + "wasm-bindgen", + "wasm-bindgen-futures", + "web-sys", +] + +[[package]] +name = "gloo-render" +version = "0.1.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "2fd9306aef67cfd4449823aadcd14e3958e0800aa2183955a309112a84ec7764" +dependencies = [ + "wasm-bindgen", + "web-sys", +] + +[[package]] +name = "gloo-storage" +version = "0.2.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1caa4ba51c99de680dee3ad99c32ca45e9f13311be72079154d222c3f9a6b6f5" +dependencies = [ + "gloo-utils", + "js-sys", + "serde", + "serde_json", + "thiserror", + "wasm-bindgen", + "web-sys", +] + [[package]] name = "gloo-timers" version = "0.2.4" @@ -811,6 +936,17 @@ dependencies = [ "wasm-bindgen", ] +[[package]] +name = "gloo-utils" +version = "0.1.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "929c53c913bb7a88d75d9dc3e9705f963d8c2b9001510b25ddaf671b9fb7049d" +dependencies = [ + "js-sys", + "wasm-bindgen", + "web-sys", +] + [[package]] name = "h2" version = "0.3.13" @@ -960,9 +1096,9 @@ dependencies = [ [[package]] name = "js-sys" -version = "0.3.58" +version = "0.3.59" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "c3fac17f7123a73ca62df411b1bf727ccc805daa070338fda671c86dac1bdc27" +checksum = "258451ab10b34f8af53416d1fdab72c22e805f0c92a1136d59470ec0b11138b2" dependencies = [ "wasm-bindgen", ] @@ -1235,6 +1371,26 @@ checksum = "d4fd5641d01c8f18a23da7b6fe29298ff4b55afcccdf78973b24cf3175fee32e" name = "photos" version = "0.1.0" +[[package]] +name = "pin-project" +version = "1.0.12" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ad29a609b6bcd67fee905812e544992d216af9d755757c05ed2d0e15a74c6ecc" +dependencies = [ + "pin-project-internal", +] + +[[package]] +name = "pin-project-internal" +version = "1.0.12" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "069bdb1e05adc7a8990dce9cc75370895fbe4e3d58b9b73bf1aee56359344a55" +dependencies = [ + "proc-macro2", + "quote", + "syn", +] + [[package]] name = "pin-project-lite" version = "0.2.9" @@ -1262,6 +1418,30 @@ dependencies = [ "vcpkg", ] +[[package]] +name = "proc-macro-error" +version = "1.0.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "da25490ff9892aab3fcf7c36f08cfb902dd3e71ca0f9f9517bea02a73a5ce38c" +dependencies = [ + "proc-macro-error-attr", + "proc-macro2", + "quote", + "syn", + "version_check", +] + +[[package]] +name = "proc-macro-error-attr" +version = "1.0.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "a1be40180e52ecc98ad80b184934baf3d0d29f979574e439af5a55274b35f869" +dependencies = [ + "proc-macro2", + "quote", + "version_check", +] + [[package]] name = "proc-macro2" version = "1.0.40" @@ -1392,6 +1572,12 @@ dependencies = [ "parking_lot 0.12.1", ] +[[package]] +name = "scoped-tls-hkt" +version = "0.1.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "c2e9d7eaddb227e8fbaaa71136ae0e1e913ca159b86c7da82f3e8f0044ad3a63" + [[package]] name = "scopeguard" version = "1.1.0" @@ -1743,9 +1929,9 @@ checksum = "9c8d87e72b64a3b4db28d11ce29237c246188f4f51057d65a7eab63b7987e423" [[package]] name = "wasm-bindgen" -version = "0.2.81" +version = "0.2.82" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "7c53b543413a17a202f4be280a7e5c62a1c69345f5de525ee64f8cfdbc954994" +checksum = "fc7652e3f6c4706c8d9cd54832c4a4ccb9b5336e2c3bd154d5cccfbf1c1f5f7d" dependencies = [ "cfg-if 1.0.0", "serde", @@ -1755,13 +1941,13 @@ dependencies = [ [[package]] name = "wasm-bindgen-backend" -version = "0.2.81" +version = "0.2.82" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5491a68ab4500fa6b4d726bd67408630c3dbe9c4fe7bda16d5c82a1fd8c7340a" +checksum = "662cd44805586bd52971b9586b1df85cdbbd9112e4ef4d8f41559c334dc6ac3f" dependencies = [ "bumpalo", - "lazy_static", "log", + "once_cell", "proc-macro2", "quote", "syn", @@ -1770,9 +1956,9 @@ dependencies = [ [[package]] name = "wasm-bindgen-futures" -version = "0.4.31" +version = "0.4.32" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "de9a9cec1733468a8c657e57fa2413d2ae2c0129b95e87c5b72b8ace4d13f31f" +checksum = "fa76fb221a1f8acddf5b54ace85912606980ad661ac7a503b4570ffd3a624dad" dependencies = [ "cfg-if 1.0.0", "js-sys", @@ -1782,9 +1968,9 @@ dependencies = [ [[package]] name = "wasm-bindgen-macro" -version = "0.2.81" +version = "0.2.82" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "c441e177922bc58f1e12c022624b6216378e5febc2f0533e41ba443d505b80aa" +checksum = "b260f13d3012071dfb1512849c033b1925038373aea48ced3012c09df952c602" dependencies = [ "quote", "wasm-bindgen-macro-support", @@ -1792,9 +1978,9 @@ dependencies = [ [[package]] name = "wasm-bindgen-macro-support" -version = "0.2.81" +version = "0.2.82" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "7d94ac45fcf608c1f45ef53e748d35660f168490c10b23704c7779ab8f5c3048" +checksum = "5be8e654bdd9b79216c2929ab90721aa82faf65c48cdf08bdc4e7f51357b80da" dependencies = [ "proc-macro2", "quote", @@ -1805,20 +1991,42 @@ dependencies = [ [[package]] name = "wasm-bindgen-shared" -version = "0.2.81" +version = "0.2.82" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "6a89911bd99e5f3659ec4acf9c4d93b0a90fe4a2a11f15328472058edc5261be" +checksum = "6598dd0bd3c7d51095ff6531a5b23e02acdc81804e30d8f07afb77b7215a140a" [[package]] name = "web-sys" -version = "0.3.58" +version = "0.3.59" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "2fed94beee57daf8dd7d51f2b15dc2bcde92d7a72304cdf662a4371008b71b90" +checksum = "ed055ab27f941423197eb86b2035720b1a3ce40504df082cac2ecc6ed73335a1" dependencies = [ "js-sys", "wasm-bindgen", ] +[[package]] +name = "weblog" +version = "0.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "6eec0958e0181982bc8b4577b1363f21300a670603615c58643f172c92c47357" +dependencies = [ + "wasm-bindgen", + "web-sys", + "weblog-proc-macro", +] + +[[package]] +name = "weblog-proc-macro" +version = "0.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "9d9abb8ee84ede5408a346721d72fb216a27f53a539ff3c83ed1bf7625af7104" +dependencies = [ + "proc-macro2", + "quote", + "syn", +] + [[package]] name = "wee_alloc" version = "0.4.5" @@ -1913,7 +2121,7 @@ checksum = "b0c409d21870c31cc3beb3b5ba8447306ecfac198876fa73bdce861b23299121" dependencies = [ "derive_more", "web-sys", - "yew", + "yew 0.18.0", "yew-router", "yewtil", ] @@ -1930,7 +2138,7 @@ dependencies = [ "cfg-if 1.0.0", "cfg-match", "console_error_panic_hook", - "gloo", + "gloo 0.2.1", "http", "indexmap", "js-sys", @@ -1943,23 +2151,42 @@ dependencies = [ "wasm-bindgen", "wasm-bindgen-futures", "web-sys", - "yew-macro", + "yew-macro 0.18.0", ] [[package]] -name = "yew-example" -version = "0.1.0" +name = "yew" +version = "0.19.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "2a1ccb53e57d3f7d847338cf5758befa811cabe207df07f543c06f502f9998cd" dependencies = [ - "anyhow", - "common", "console_error_panic_hook", - "pathfinding", - "serde", - "serde_json", + "gloo 0.4.2", + "gloo-utils", + "indexmap", + "js-sys", + "scoped-tls-hkt", + "slab", "wasm-bindgen", - "wee_alloc", - "ybc", - "yew", + "wasm-bindgen-futures", + "web-sys", + "yew-macro 0.19.3", +] + +[[package]] +name = "yew-hooks" +version = "0.1.56" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1807cd5bf44c34255534fc8a824b0d6c1022147affecbb7f10c6753f336e7309" +dependencies = [ + "gloo 0.4.2", + "js-sys", + "log", + "serde", + "wasm-bindgen", + "wasm-bindgen-futures", + "web-sys", + "yew 0.19.3", ] [[package]] @@ -1975,6 +2202,20 @@ dependencies = [ "syn", ] +[[package]] +name = "yew-macro" +version = "0.19.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "5fab79082b556d768d6e21811869c761893f0450e1d550a67892b9bce303b7bb" +dependencies = [ + "boolinator", + "lazy_static", + "proc-macro-error", + "proc-macro2", + "quote", + "syn", +] + [[package]] name = "yew-router" version = "0.15.0" @@ -1983,7 +2224,7 @@ checksum = "27666236d9597eac9be560e841e415e20ba67020bc8cd081076be178e159c8bc" dependencies = [ "cfg-if 1.0.0", "cfg-match", - "gloo", + "gloo 0.2.1", "js-sys", "log", "nom", @@ -1991,7 +2232,7 @@ dependencies = [ "serde_json", "wasm-bindgen", "web-sys", - "yew", + "yew 0.18.0", "yew-router-macro", "yew-router-route-parser", ] @@ -2027,7 +2268,7 @@ dependencies = [ "wasm-bindgen", "wasm-bindgen-futures", "web-sys", - "yew", + "yew 0.18.0", ] [[package]] diff --git a/Cargo.toml b/Cargo.toml index 5c489a8..6db92db 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -1,11 +1,9 @@ [package] name = "photos" version = "0.1.0" +authors = ["Johannes Heuel "] edition = "2021" license = "MIT" -description = " " - -# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html [dependencies] diff --git a/backend/Cargo.toml b/backend/Cargo.toml index 39f88a7..0a5a1e1 100644 --- a/backend/Cargo.toml +++ b/backend/Cargo.toml @@ -1,13 +1,12 @@ [package] name = "backend" version = "0.1.0" +authors = ["Johannes Heuel "] edition = "2021" license = "MIT" description = " " default-run = "backend" -# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html - [dependencies] actix-web = "4" actix-web-lab = "^0" diff --git a/backend/src/lib.rs b/backend/src/lib.rs index bea57a7..4890174 100644 --- a/backend/src/lib.rs +++ b/backend/src/lib.rs @@ -27,4 +27,4 @@ pub fn create_picture<'a>(conn: &PgConnection, new_picture: NewPicture) -> usize .values(&new_picture) .execute(conn) .expect("Error saving new picture") -} \ No newline at end of file +} diff --git a/backend/src/main.rs b/backend/src/main.rs index b6e9fac..db18daf 100644 --- a/backend/src/main.rs +++ b/backend/src/main.rs @@ -4,10 +4,9 @@ extern crate diesel; #[macro_use] extern crate diesel_migrations; +use std::mem::swap; + use actix_files as fs; -use actix_web::{Responder, Result}; -use actix_web_lab::web::spa; -use backend::establish_connection; use actix_web::{ // get, middleware, post, web, App, Error, HttpRequest, HttpResponse, HttpServer, get, @@ -16,6 +15,9 @@ use actix_web::{ App, HttpServer, }; +use actix_web::{Responder, Result}; +use actix_web_lab::web::spa; +use backend::establish_connection; use diesel::prelude::*; use diesel::r2d2::{self, ConnectionManager}; @@ -42,10 +44,19 @@ async fn get_pictures(pool: web::Data) -> Result { let pics: Vec = pics .iter() - .map(|x| OutputPicture { - thumbnail: x.thumbnail.clone(), - width: x.width.try_into().unwrap(), - height: x.height.try_into().unwrap(), + .map(|x| { + let mut w: u32 = x.width.try_into().unwrap(); + let mut h: u32 = x.height.try_into().unwrap(); + if let Some(o) = &x.orientation { + if o == "Rotate 270 CW" { + swap(&mut w, &mut h); + } + } + OutputPicture { + thumbnail: x.thumbnail.clone(), + width: w, + height: h, + } }) .collect(); diff --git a/common/Cargo.toml b/common/Cargo.toml index 7764851..108e5ea 100644 --- a/common/Cargo.toml +++ b/common/Cargo.toml @@ -1,9 +1,9 @@ [package] name = "common" version = "0.1.0" +authors = ["Johannes Heuel "] edition = "2021" - -# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html +license = "MIT" [dependencies] serde = { version = "1.0", features = ["derive"] } diff --git a/common/src/lib.rs b/common/src/lib.rs index 7aed4ac..17e3884 100644 --- a/common/src/lib.rs +++ b/common/src/lib.rs @@ -1,6 +1,6 @@ use serde::{Serialize, Deserialize}; -#[derive(Serialize,Deserialize)] +#[derive(Serialize,Deserialize,Debug,Clone,PartialEq)] pub struct OutputPicture { pub thumbnail: Option, pub width: u32, diff --git a/frontend/Cargo.lock b/frontend/Cargo.lock deleted file mode 100644 index 7a37e27..0000000 --- a/frontend/Cargo.lock +++ /dev/null @@ -1,711 +0,0 @@ -# This file is automatically @generated by Cargo. -# It is not intended for manual editing. -version = 3 - -[[package]] -name = "anyhow" -version = "1.0.42" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "595d3cfa7a60d4555cb5067b99f07142a08ea778de5cf993f7b75c7d8fabc486" - -[[package]] -name = "anymap" -version = "0.12.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "33954243bd79057c2de7338850b85983a44588021f8a5fee574a8888c6de4344" - -[[package]] -name = "arrayvec" -version = "0.5.2" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "23b62fc65de8e4e7f52534fb52b0f3ed04746ae267519eef2a83941e8085068b" - -[[package]] -name = "autocfg" -version = "1.0.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "cdb031dd78e28731d87d56cc8ffef4a8f36ca26c38fe2de700543e627f8a464a" - -[[package]] -name = "bincode" -version = "1.3.3" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b1f45e9417d87227c7a56d22e471c6206462cba514c7590c09aff4cf6d1ddcad" -dependencies = [ - "serde", -] - -[[package]] -name = "bitflags" -version = "1.2.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "cf1de2fe8c75bc145a2f577add951f8134889b4795d47466a54a5c846d691693" - -[[package]] -name = "boolinator" -version = "2.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "cfa8873f51c92e232f9bac4065cddef41b714152812bfc5f7672ba16d6ef8cd9" - -[[package]] -name = "bumpalo" -version = "3.7.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "9c59e7af012c713f529e7a3ee57ce9b31ddd858d4b512923602f74608b009631" - -[[package]] -name = "bytes" -version = "1.0.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b700ce4376041dcd0a327fd0097c41095743c4c8af8887265942faf1100bd040" - -[[package]] -name = "cfg-if" -version = "0.1.10" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "4785bdd1c96b2a846b2bd7cc02e86b6b3dbf14e7e53446c4f54c92a361040822" - -[[package]] -name = "cfg-if" -version = "1.0.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "baf1de4339761588bc0619e3cbc0120ee582ebb74b53b4efbf79117bd2da40fd" - -[[package]] -name = "cfg-match" -version = "0.2.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8100e46ff92eb85bf6dc2930c73f2a4f7176393c84a9446b3d501e1b354e7b34" - -[[package]] -name = "console_error_panic_hook" -version = "0.1.6" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b8d976903543e0c48546a91908f21588a680a8c8f984df9a5d69feccb2b2a211" -dependencies = [ - "cfg-if 0.1.10", - "wasm-bindgen", -] - -[[package]] -name = "convert_case" -version = "0.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "6245d59a3e82a7fc217c5828a6692dbc6dfb63a0c8c90495621f7b9d79704a0e" - -[[package]] -name = "derive_more" -version = "0.99.16" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "40eebddd2156ce1bb37b20bbe5151340a31828b1f2d22ba4141f3531710e38df" -dependencies = [ - "convert_case", - "proc-macro2", - "quote", - "rustc_version", - "syn", -] - -[[package]] -name = "either" -version = "1.6.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "e78d4f1cc4ae33bbfc157ed5d5a5ef3bc29227303d595861deb238fcec4e9457" - -[[package]] -name = "fixedbitset" -version = "0.4.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "279fb028e20b3c4c320317955b77c5e0c9701f05a1d309905d6fc702cdc5053e" - -[[package]] -name = "fnv" -version = "1.0.7" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "3f9eec918d3f24069decb9af1554cad7c880e2da24a9afd88aca000531ab82c1" - -[[package]] -name = "gloo" -version = "0.2.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "68ce6f2dfa9f57f15b848efa2aade5e1850dc72986b87a2b0752d44ca08f4967" -dependencies = [ - "gloo-console-timer", - "gloo-events", - "gloo-file", - "gloo-timers", -] - -[[package]] -name = "gloo-console-timer" -version = "0.1.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b48675544b29ac03402c6dffc31a912f716e38d19f7e74b78b7e900ec3c941ea" -dependencies = [ - "web-sys", -] - -[[package]] -name = "gloo-events" -version = "0.1.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "088514ec8ef284891c762c88a66b639b3a730134714692ee31829765c5bc814f" -dependencies = [ - "wasm-bindgen", - "web-sys", -] - -[[package]] -name = "gloo-file" -version = "0.1.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8f9fecfe46b5dc3cc46f58e98ba580cc714f2c93860796d002eb3527a465ef49" -dependencies = [ - "gloo-events", - "js-sys", - "wasm-bindgen", - "web-sys", -] - -[[package]] -name = "gloo-timers" -version = "0.2.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "47204a46aaff920a1ea58b11d03dec6f704287d27561724a4631e450654a891f" -dependencies = [ - "js-sys", - "wasm-bindgen", - "web-sys", -] - -[[package]] -name = "hashbrown" -version = "0.11.2" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ab5ef0d4909ef3724cc8cce6ccc8572c5c817592e9285f5464f8e86f8bd3726e" - -[[package]] -name = "http" -version = "0.2.4" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "527e8c9ac747e28542699a951517aa9a6945af506cd1f2e1b53a576c17b6cc11" -dependencies = [ - "bytes", - "fnv", - "itoa", -] - -[[package]] -name = "indexmap" -version = "1.7.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "bc633605454125dec4b66843673f01c7df2b89479b32e0ed634e43a91cff62a5" -dependencies = [ - "autocfg", - "hashbrown", -] - -[[package]] -name = "integer-sqrt" -version = "0.1.5" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "276ec31bcb4a9ee45f58bec6f9ec700ae4cf4f4f8f2fa7e06cb406bd5ffdd770" -dependencies = [ - "num-traits", -] - -[[package]] -name = "itertools" -version = "0.10.3" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "a9a9d19fa1e79b6215ff29b9d6880b706147f16e9b1dbb1e4e5947b5b02bc5e3" -dependencies = [ - "either", -] - -[[package]] -name = "itoa" -version = "0.4.7" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "dd25036021b0de88a0aff6b850051563c6516d0bf53f8638938edbb9de732736" - -[[package]] -name = "js-sys" -version = "0.3.51" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "83bdfbace3a0e81a4253f73b49e960b053e396a11012cbd49b9b74d6a2b67062" -dependencies = [ - "wasm-bindgen", -] - -[[package]] -name = "lazy_static" -version = "1.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "e2abad23fbc42b3700f2f279844dc832adb2b2eb069b2df918f455c4e18cc646" - -[[package]] -name = "lexical-core" -version = "0.7.6" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "6607c62aa161d23d17a9072cc5da0be67cdfc89d3afb1e8d9c842bebc2525ffe" -dependencies = [ - "arrayvec", - "bitflags", - "cfg-if 1.0.0", - "ryu", - "static_assertions", -] - -[[package]] -name = "libc" -version = "0.2.98" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "320cfe77175da3a483efed4bc0adc1968ca050b098ce4f2f1c13a56626128790" - -[[package]] -name = "log" -version = "0.4.14" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "51b9bbe6c47d51fc3e1a9b945965946b4c44142ab8792c50835a980d362c2710" -dependencies = [ - "cfg-if 1.0.0", -] - -[[package]] -name = "memchr" -version = "2.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b16bd47d9e329435e309c58469fe0791c2d0d1ba96ec0954152a5ae2b04387dc" - -[[package]] -name = "memory_units" -version = "0.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8452105ba047068f40ff7093dd1d9da90898e63dd61736462e9cdda6a90ad3c3" - -[[package]] -name = "nom" -version = "5.1.2" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ffb4262d26ed83a1c0a33a38fe2bb15797329c85770da05e6b828ddb782627af" -dependencies = [ - "lexical-core", - "memchr", - "version_check", -] - -[[package]] -name = "num-traits" -version = "0.2.15" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "578ede34cf02f8924ab9447f50c28075b4d3e5b269972345e7e0372b38c6cdcd" -dependencies = [ - "autocfg", -] - -[[package]] -name = "pathfinding" -version = "3.0.13" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "84da3eab6c7638931f4876ebb03455be74db8eab1e344cd5a90daba8b3ad2f22" -dependencies = [ - "fixedbitset", - "indexmap", - "integer-sqrt", - "itertools", - "num-traits", - "rustc-hash", - "thiserror", -] - -[[package]] -name = "pest" -version = "2.1.3" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "10f4872ae94d7b90ae48754df22fd42ad52ce740b8f370b03da4835417403e53" -dependencies = [ - "ucd-trie", -] - -[[package]] -name = "proc-macro2" -version = "1.0.28" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5c7ed8b8c7b886ea3ed7dde405212185f423ab44682667c8c6dd14aa1d9f6612" -dependencies = [ - "unicode-xid", -] - -[[package]] -name = "quote" -version = "1.0.9" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "c3d0b9745dc2debf507c8422de05d7226cc1f0644216dfdfead988f9b1ab32a7" -dependencies = [ - "proc-macro2", -] - -[[package]] -name = "rustc-hash" -version = "1.1.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "08d43f7aa6b08d49f382cde6a7982047c3426db949b1424bc4b7ec9ae12c6ce2" - -[[package]] -name = "rustc_version" -version = "0.3.3" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "f0dfe2087c51c460008730de8b57e6a320782fbfb312e1f4d520e6c6fae155ee" -dependencies = [ - "semver", -] - -[[package]] -name = "ryu" -version = "1.0.5" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "71d301d4193d031abdd79ff7e3dd721168a9572ef3fe51a1517aba235bd8f86e" - -[[package]] -name = "semver" -version = "0.11.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "f301af10236f6df4160f7c3f04eec6dbc70ace82d23326abad5edee88801c6b6" -dependencies = [ - "semver-parser", -] - -[[package]] -name = "semver-parser" -version = "0.10.2" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "00b0bef5b7f9e0df16536d3961cfb6e84331c065b4066afb39768d0e319411f7" -dependencies = [ - "pest", -] - -[[package]] -name = "serde" -version = "1.0.126" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ec7505abeacaec74ae4778d9d9328fe5a5d04253220a85c4ee022239fc996d03" -dependencies = [ - "serde_derive", -] - -[[package]] -name = "serde_derive" -version = "1.0.126" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "963a7dbc9895aeac7ac90e74f34a5d5261828f79df35cbed41e10189d3804d43" -dependencies = [ - "proc-macro2", - "quote", - "syn", -] - -[[package]] -name = "serde_json" -version = "1.0.64" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "799e97dc9fdae36a5c8b8f2cae9ce2ee9fdce2058c57a93e6099d919fd982f79" -dependencies = [ - "itoa", - "ryu", - "serde", -] - -[[package]] -name = "slab" -version = "0.4.3" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "f173ac3d1a7e3b28003f40de0b5ce7fe2710f9b9dc3fc38664cebee46b3b6527" - -[[package]] -name = "static_assertions" -version = "1.1.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "a2eb9349b6444b326872e140eb1cf5e7c522154d69e7a0ffb0fb81c06b37543f" - -[[package]] -name = "syn" -version = "1.0.74" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1873d832550d4588c3dbc20f01361ab00bfe741048f71e3fecf145a7cc18b29c" -dependencies = [ - "proc-macro2", - "quote", - "unicode-xid", -] - -[[package]] -name = "thiserror" -version = "1.0.31" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "bd829fe32373d27f76265620b5309d0340cb8550f523c1dda251d6298069069a" -dependencies = [ - "thiserror-impl", -] - -[[package]] -name = "thiserror-impl" -version = "1.0.31" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "0396bc89e626244658bef819e22d0cc459e795a5ebe878e6ec336d1674a8d79a" -dependencies = [ - "proc-macro2", - "quote", - "syn", -] - -[[package]] -name = "ucd-trie" -version = "0.1.3" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "56dee185309b50d1f11bfedef0fe6d036842e3fb77413abef29f8f8d1c5d4c1c" - -[[package]] -name = "unicode-xid" -version = "0.2.2" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8ccb82d61f80a663efe1f787a51b16b5a51e3314d6ac365b08639f52387b33f3" - -[[package]] -name = "version_check" -version = "0.9.3" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5fecdca9a5291cc2b8dcf7dc02453fee791a280f3743cb0905f8822ae463b3fe" - -[[package]] -name = "wasm-bindgen" -version = "0.2.81" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "7c53b543413a17a202f4be280a7e5c62a1c69345f5de525ee64f8cfdbc954994" -dependencies = [ - "cfg-if 1.0.0", - "serde", - "serde_json", - "wasm-bindgen-macro", -] - -[[package]] -name = "wasm-bindgen-backend" -version = "0.2.81" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5491a68ab4500fa6b4d726bd67408630c3dbe9c4fe7bda16d5c82a1fd8c7340a" -dependencies = [ - "bumpalo", - "lazy_static", - "log", - "proc-macro2", - "quote", - "syn", - "wasm-bindgen-shared", -] - -[[package]] -name = "wasm-bindgen-futures" -version = "0.4.24" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5fba7978c679d53ce2d0ac80c8c175840feb849a161664365d1287b41f2e67f1" -dependencies = [ - "cfg-if 1.0.0", - "js-sys", - "wasm-bindgen", - "web-sys", -] - -[[package]] -name = "wasm-bindgen-macro" -version = "0.2.81" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "c441e177922bc58f1e12c022624b6216378e5febc2f0533e41ba443d505b80aa" -dependencies = [ - "quote", - "wasm-bindgen-macro-support", -] - -[[package]] -name = "wasm-bindgen-macro-support" -version = "0.2.81" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "7d94ac45fcf608c1f45ef53e748d35660f168490c10b23704c7779ab8f5c3048" -dependencies = [ - "proc-macro2", - "quote", - "syn", - "wasm-bindgen-backend", - "wasm-bindgen-shared", -] - -[[package]] -name = "wasm-bindgen-shared" -version = "0.2.81" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "6a89911bd99e5f3659ec4acf9c4d93b0a90fe4a2a11f15328472058edc5261be" - -[[package]] -name = "web-sys" -version = "0.3.51" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "e828417b379f3df7111d3a2a9e5753706cae29c41f7c4029ee9fd77f3e09e582" -dependencies = [ - "js-sys", - "wasm-bindgen", -] - -[[package]] -name = "wee_alloc" -version = "0.4.5" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "dbb3b5a6b2bb17cb6ad44a2e68a43e8d2722c997da10e928665c72ec6c0a0b8e" -dependencies = [ - "cfg-if 0.1.10", - "libc", - "memory_units", - "winapi", -] - -[[package]] -name = "winapi" -version = "0.3.9" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5c839a674fcd7a98952e593242ea400abe93992746761e38641405d28b00f419" -dependencies = [ - "winapi-i686-pc-windows-gnu", - "winapi-x86_64-pc-windows-gnu", -] - -[[package]] -name = "winapi-i686-pc-windows-gnu" -version = "0.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ac3b87c63620426dd9b991e5ce0329eff545bccbbb34f3be09ff6fb6ab51b7b6" - -[[package]] -name = "winapi-x86_64-pc-windows-gnu" -version = "0.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f" - -[[package]] -name = "ybc" -version = "0.2.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "b0c409d21870c31cc3beb3b5ba8447306ecfac198876fa73bdce861b23299121" -dependencies = [ - "derive_more", - "web-sys", - "yew", - "yew-router", - "yewtil", -] - -[[package]] -name = "yew" -version = "0.18.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "e4d5154faef86dddd2eb333d4755ea5643787d20aca683e58759b0e53351409f" -dependencies = [ - "anyhow", - "anymap", - "bincode", - "cfg-if 1.0.0", - "cfg-match", - "console_error_panic_hook", - "gloo", - "http", - "indexmap", - "js-sys", - "log", - "ryu", - "serde", - "serde_json", - "slab", - "thiserror", - "wasm-bindgen", - "wasm-bindgen-futures", - "web-sys", - "yew-macro", -] - -[[package]] -name = "yew-example" -version = "0.1.0" -dependencies = [ - "console_error_panic_hook", - "pathfinding", - "wasm-bindgen", - "wee_alloc", - "ybc", - "yew", -] - -[[package]] -name = "yew-macro" -version = "0.18.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d6e23bfe3dc3933fbe9592d149c9985f3047d08c637a884b9344c21e56e092ef" -dependencies = [ - "boolinator", - "lazy_static", - "proc-macro2", - "quote", - "syn", -] - -[[package]] -name = "yew-router" -version = "0.15.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "27666236d9597eac9be560e841e415e20ba67020bc8cd081076be178e159c8bc" -dependencies = [ - "cfg-if 1.0.0", - "cfg-match", - "gloo", - "js-sys", - "log", - "nom", - "serde", - "serde_json", - "wasm-bindgen", - "web-sys", - "yew", - "yew-router-macro", - "yew-router-route-parser", -] - -[[package]] -name = "yew-router-macro" -version = "0.15.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "4c0ace2924b7a175e2d1c0e62ee7022a5ad840040dcd52414ce5f410ab322dba" -dependencies = [ - "proc-macro2", - "quote", - "syn", - "yew-router-route-parser", -] - -[[package]] -name = "yew-router-route-parser" -version = "0.15.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "de4a67208fb46b900af18a7397938b01f379dfc18da34799cfa8347eec715697" -dependencies = [ - "nom", -] - -[[package]] -name = "yewtil" -version = "0.4.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "8543663ac49cd613df079282a1d8bdbdebdad6e02bac229f870fd4237b5d9aaa" -dependencies = [ - "log", - "wasm-bindgen", - "wasm-bindgen-futures", - "web-sys", - "yew", -] diff --git a/frontend/Cargo.toml b/frontend/Cargo.toml index b402c19..6680546 100644 --- a/frontend/Cargo.toml +++ b/frontend/Cargo.toml @@ -1,20 +1,26 @@ [package] -name = "yew-example" +name = "frontend" version = "0.1.0" -authors = ["Anthony Dodd "] -edition = "2018" +authors = ["Johannes Heuel "] +edition = "2021" +license = "MIT" [dependencies] console_error_panic_hook = "0.1.6" -wasm-bindgen = "=0.2.81" +wasm-bindgen = "=0.2.82" +wasm-bindgen-futures = "0.4.32" +gloo-net = "0.2.3" +weblog = "0.3.0" wee_alloc = "0.4.5" ybc = "0.2" -yew = "0.18" +yew = "0.19" +yew-hooks = "0.1.56" pathfinding = "3.0.13" common = { path = "../common" } serde = { version = "1.0", features = ["derive"] } serde_json = "1.0" anyhow = "1.0.58" +yewtil = { version = "0.4.0", features = ["neq"] } [features] default = [] diff --git a/frontend/index.html b/frontend/index.html index 95464b1..8db8090 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -3,7 +3,7 @@ - Trunk | Yew | YBC + Photos @@ -14,6 +14,6 @@ - + diff --git a/frontend/src/gallery/grid.rs b/frontend/src/gallery/grid.rs new file mode 100644 index 0000000..cd74c29 --- /dev/null +++ b/frontend/src/gallery/grid.rs @@ -0,0 +1,137 @@ +use crate::gallery::Picture; +use common::OutputPicture; +use pathfinding::prelude::dijkstra; +use weblog::console_log; +use yew::prelude::*; + +use yew::{function_component, html}; + +#[derive(Clone, Debug, Properties, PartialEq)] +pub struct GridProps { + #[prop_or_default] + pub pictures: Vec, + #[prop_or_default] + pub width: u32, +} + +fn get_common_height(row: &[OutputPicture], container_width: u32, margin: u32) -> f32 { + let row_width: u32 = container_width - row.len() as u32 * (margin * 2); + let total_aspect_ratio: f32 = row + .iter() + .map(|p| (p.width as f32) / (p.height as f32)) + .sum(); + row_width as f32 / total_aspect_ratio +} + +fn cost( + photos: &[OutputPicture], + i: usize, + j: usize, + width: u32, + target_height: u32, + margin: u32, +) -> u32 { + let common_height = get_common_height(&photos[i..j], width, margin); + (common_height - target_height as f32).powi(2) as u32 +} + +fn make_successors( + target_height: u32, + container_width: u32, + photos: &Vec, + limit_node_search: usize, + margin: u32, +) -> Vec> { + let mut results = vec![Vec::new(); photos.len()]; + (0..photos.len()).for_each(|start| { + for j in start + 1..photos.len() + 1 { + if j - start > limit_node_search { + break; + } + results[start].push(( + j, + cost(photos, start, j, container_width, target_height, margin), + )); + } + }); + results +} + +// guesstimate how many neighboring nodes should be searched based on +// the aspect ratio of the container with images having an avg AR of 1.5 +// as the minimum amount of photos per row, plus some nodes +fn find_ideal_node_search(target_row_height: u32, container_width: u32) -> usize { + let row_aspect_ratio = container_width as f32 / target_row_height as f32; + (row_aspect_ratio / 1.5) as usize + 8 +} + +fn compute_row_layout( + container_width: u32, + limit_node_search: usize, + target_height: u32, + margin: u32, + photos: &Vec, +) -> Option> { + console_log!("compute row layout for width: {}", container_width); + + if photos.is_empty() { + return None; + } + + let successors = make_successors( + target_height, + container_width, + photos, + limit_node_search, + margin, + ); + let path = dijkstra(&0, |p| successors[*p].clone(), |p| *p == photos.len()); + let (path, _cost) = if let Some(p) = path { + p + } else { + (Vec::new(), 0) + }; + let mut dimensions: Vec<(u32, u32)> = Vec::with_capacity(photos.len()); + for i in 1..path.len() { + let row = &photos[path[i - 1]..path[i]]; + let height = get_common_height(row, container_width, margin) as u32; + (path[i - 1]..path[i]).for_each(|j| { + let ratio = photos[j].width as f32 / photos[j].height as f32; + dimensions.push(((height as f32 * ratio) as u32, height)); + }); + } + Some(dimensions) +} + +#[function_component(Grid)] +pub fn grid(props: &GridProps) -> Html { + let target_height = 300; + let container_width = if props.width == 0 { 0 } else { props.width - 4 }; + let limit_node_search = find_ideal_node_search(target_height, container_width); + let margin = 2; + let dimensions = compute_row_layout( + container_width, + limit_node_search, + target_height, + margin, + &props.pictures, + ); + let dimensions = if let Some(d) = dimensions { + d + } else { + props.pictures.iter().map(|p| (p.width, p.height)).collect() + }; + html! { +
+ { props.pictures.iter().zip(dimensions).map(|(p, d)| + html!{} + ).collect::()} +
+ } +} diff --git a/frontend/src/gallery/mod.rs b/frontend/src/gallery/mod.rs new file mode 100644 index 0000000..9e8e28f --- /dev/null +++ b/frontend/src/gallery/mod.rs @@ -0,0 +1,5 @@ +pub mod grid; +pub use grid::Grid; + +pub mod picture; +pub use picture::Picture; \ No newline at end of file diff --git a/frontend/src/gallery/picture.rs b/frontend/src/gallery/picture.rs new file mode 100644 index 0000000..ef841f4 --- /dev/null +++ b/frontend/src/gallery/picture.rs @@ -0,0 +1,27 @@ +use common::OutputPicture; +use yew::prelude::*; + +#[derive(Clone, Debug, Properties, PartialEq)] +pub struct PictureProps { + pub picture: OutputPicture, + pub width: u32, + pub height: u32, + pub margin: u32, +} + +#[function_component(Picture)] +pub fn picture(props: &PictureProps) -> Html { + let thumb = if let Some(thumb) = &props.picture.thumbnail { + format!("/api/pictures/{}", thumb) + } else { + "".into() + }; + let margin = props.margin.to_string(); + let width = props.width.to_string(); + let height = props.height.to_string(); + html! { + <> + + + } +} diff --git a/frontend/src/main.rs b/frontend/src/main.rs index a020f47..48a9d55 100644 --- a/frontend/src/main.rs +++ b/frontend/src/main.rs @@ -3,173 +3,52 @@ #[global_allocator] static ALLOC: wee_alloc::WeeAlloc = wee_alloc::WeeAlloc::INIT; +mod gallery; + use common::OutputPicture; use console_error_panic_hook::set_once as set_panic_hook; +use gloo_net::http::Request; use wasm_bindgen::prelude::*; -use ybc::TileCtx::{Ancestor, Child, Parent}; +use yew_hooks::prelude::*; + +use gallery::Grid; + use yew::prelude::*; -// use pathfinding::directed::dijkstra; -use yew::format::Json; -use yew::format::Nothing; -use yew::services::fetch::FetchService; -use yew::services::ConsoleService; -use yew::services::fetch::FetchTask; -use yew::services::fetch::Request; -use yew::services::fetch::Response; +#[function_component(App)] +fn app() -> Html { + let node = use_node_ref(); + let size = use_size(node.clone()); -pub enum Msg { - GetPictures, - ReceiveResponse(Result, anyhow::Error>), -} - -struct App { - pictures: Option>, - fetch_task: Option, - link: ComponentLink, - error: Option, -} - -impl App { - fn view_fetching(&self) -> Html { - if self.fetch_task.is_some() { - html! {

{ "Fetching data..." }

} - } else { - html! {

} - } - } - fn view_error(&self) -> Html { - if let Some(ref error) = self.error { - html! {

{ error.clone() }

} - } else { - html! {} - } - } -} - -impl Component for App { - type Message = Msg; - type Properties = (); - - fn create(_: Self::Properties, link: ComponentLink) -> Self { - Self { - fetch_task: None, - link, - pictures: None, - error: None, - } + let pictures = use_state(|| vec![]); + { + let pictures = pictures.clone(); + use_effect_with_deps( + move |_| { + let pictures = pictures.clone(); + wasm_bindgen_futures::spawn_local(async move { + let url = "/api/pictures/"; + let fetched_pictures: Vec = Request::get(url) + .send() + .await + .unwrap() + .json() + .await + .unwrap(); + pictures.set(fetched_pictures); + }); + || () + }, + (), + ); } - fn update(&mut self, msg: Self::Message) -> bool { - match msg { - Msg::GetPictures => { - let request = Request::get("/api/pictures/") - .body(Nothing) - .expect("Could not build that request"); - let callback = - self.link - .callback(|response: Response, anyhow::Error>>>| { - let Json(data) = response.into_body(); - Msg::ReceiveResponse(data) - }); - let task = FetchService::fetch(request, callback).expect("failed to start request"); - self.fetch_task = Some(task); - true - } - Msg::ReceiveResponse(response) => { - match response { - Ok(pictures) => { - self.pictures = Some(pictures); - } - Err(error) => { - self.error = Some(error.to_string()); - } - } - self.fetch_task = None; - true - } - } - } - - fn change(&mut self, _: Self::Properties) -> bool { - false - } - - fn view(&self) -> Html { - html! { - <> - - {"Trunk | Yew | YBC"} - - } - navstart=html!{} - navend=html!{ - <> - - - {"Trunk"} - - - - - {"Yew"} - - - - - {"YBC"} - - - - } - /> - - - - <> - - { self.view_fetching() } - { self.view_error() } - - - - - {"Trunk"} -

{"Trunk is a WASM web application bundler for Rust."}

- - - - - - - {"Yew"} - -

{"Yew is a modern Rust framework for creating multi-threaded front-end web apps with WebAssembly."}

- - - - - {"YBC"} -

{"A Yew component library based on the Bulma CSS framework."}

- - - - - - }> - - - } + html! { + <> +
+ +
+ } } @@ -185,11 +64,11 @@ fn main() { // Show off some feature flag enabling patterns. #[cfg(feature = "demo-abc")] { - ConsoleService::log("feature `demo-abc` enabled"); + // ConsoleService::log("feature `demo-abc` enabled"); } #[cfg(feature = "demo-xyz")] { - ConsoleService::log("feature `demo-xyz` enabled"); + // ConsoleService::log("feature `demo-xyz` enabled"); } yew::start_app::();