diff --git a/examples/download_progress/Cargo.toml b/examples/download_progress/Cargo.toml
index 18a49f6649..afc1550dc6 100644
--- a/examples/download_progress/Cargo.toml
+++ b/examples/download_progress/Cargo.toml
@@ -6,10 +6,18 @@ edition = "2021"
publish = false
[dependencies]
+[target.'cfg(not(target_arch = "wasm32"))'.dependencies]
iced.workspace = true
iced.features = ["tokio"]
+[target.'cfg(target_arch = "wasm32")'.dependencies]
+iced.workspace = true
+iced.features = ["tokio", "webgl"]
+
+bytes = "1.6"
+futures = "0.3"
+
[dependencies.reqwest]
-version = "0.11"
+version = "0.12"
default-features = false
-features = ["rustls-tls"]
+features = ["rustls-tls", "stream"]
diff --git a/examples/download_progress/index.html b/examples/download_progress/index.html
new file mode 100644
index 0000000000..c79e32c109
--- /dev/null
+++ b/examples/download_progress/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+ Download_Progress - Iced
+
+
+
+
+
+
diff --git a/examples/download_progress/src/download.rs b/examples/download_progress/src/download.rs
index d6cc1e2434..9f99c3a0ff 100644
--- a/examples/download_progress/src/download.rs
+++ b/examples/download_progress/src/download.rs
@@ -2,6 +2,10 @@ use iced::subscription;
use std::hash::Hash;
+#[cfg(target_arch = "wasm32")]
+use futures::{Stream, StreamExt};
+#[cfg(target_arch = "wasm32")]
+use std::pin::Pin;
// Just a little utility function
pub fn file(
id: I,
@@ -16,14 +20,16 @@ async fn download(id: I, state: State) -> ((I, Progress), State) {
match state {
State::Ready(url) => {
let response = reqwest::get(&url).await;
-
match response {
Ok(response) => {
if let Some(total) = response.content_length() {
(
(id, Progress::Started),
State::Downloading {
- response,
+ #[cfg(target_arch = "wasm32")]
+ stream: response.bytes_stream().boxed_local(),
+ #[cfg(not(target_arch = "wasm32"))]
+ stream: response,
total,
downloaded: 0,
},
@@ -36,27 +42,33 @@ async fn download(id: I, state: State) -> ((I, Progress), State) {
}
}
State::Downloading {
- mut response,
+ mut stream,
total,
downloaded,
- } => match response.chunk().await {
- Ok(Some(chunk)) => {
- let downloaded = downloaded + chunk.len() as u64;
+ } => {
+ #[cfg(target_arch = "wasm32")]
+ let chunk = stream.next().await.map_or(Ok(None), |v| v.map(Some));
+ #[cfg(not(target_arch = "wasm32"))]
+ let chunk = stream.chunk().await;
+ match chunk {
+ Ok(Some(chunk)) => {
+ let downloaded = downloaded + chunk.len() as u64;
- let percentage = (downloaded as f32 / total as f32) * 100.0;
+ let percentage = (downloaded as f32 / total as f32) * 100.0;
- (
- (id, Progress::Advanced(percentage)),
- State::Downloading {
- response,
- total,
- downloaded,
- },
- )
+ (
+ (id, Progress::Advanced(percentage)),
+ State::Downloading {
+ stream,
+ total,
+ downloaded,
+ },
+ )
+ }
+ Ok(None) => ((id, Progress::Finished), State::Finished),
+ Err(_) => ((id, Progress::Errored), State::Finished),
}
- Ok(None) => ((id, Progress::Finished), State::Finished),
- Err(_) => ((id, Progress::Errored), State::Finished),
- },
+ }
State::Finished => {
// We do not let the stream die, as it would start a
// new download repeatedly if the user is not careful
@@ -77,7 +89,11 @@ pub enum Progress {
pub enum State {
Ready(String),
Downloading {
- response: reqwest::Response,
+ #[cfg(target_arch = "wasm32")]
+ stream:
+ Pin>>>,
+ #[cfg(not(target_arch = "wasm32"))]
+ stream: reqwest::Response,
total: u64,
downloaded: u64,
},