web: more accurate reading progress bar

web/src/view/desktop.rs

@@ -16,11 +16,11 @@ pub(super) fn view(model: &Model) -> Node<Msg> {
         Context::ThreadResult {
             thread: ShowThreadQueryThread::EmailThread(thread),
             open_messages,
-        } => view::thread(thread, open_messages, show_icon_text),
+        } => view::thread(thread, open_messages, show_icon_text, &model.content_el),
         Context::ThreadResult {
             thread: ShowThreadQueryThread::NewsPost(post),
             ..
-        } => view::news_post(post, show_icon_text),
+        } => view::news_post(post, show_icon_text, &model.content_el),
         Context::SearchResult {
             query,
             results,

web/src/view/mobile.rs

@@ -19,11 +19,11 @@ pub(super) fn view(model: &Model) -> Node<Msg> {
         Context::ThreadResult {
             thread: ShowThreadQueryThread::EmailThread(thread),
             open_messages,
-        } => view::thread(thread, open_messages, show_icon_text),
+        } => view::thread(thread, open_messages, show_icon_text, &model.content_el),
         Context::ThreadResult {
             thread: ShowThreadQueryThread::NewsPost(post),
             ..
-        } => view::news_post(post, show_icon_text),
+        } => view::news_post(post, show_icon_text, &model.content_el),
         Context::SearchResult {
             query,
             results,

web/src/view/mod.rs

@@ -6,9 +6,10 @@ use std::{
 use chrono::{DateTime, Datelike, Duration, Local, Utc};
 use human_format::{Formatter, Scales};
 use itertools::Itertools;
-use log::{error, info};
+use log::{debug, error, info};
 use seed::{prelude::*, *};
 use seed_hooks::{state_access::CloneState, topo, use_state};
+use web_sys::HtmlElement;
 
 use crate::{
     api::urls,
@@ -795,6 +796,7 @@ fn thread(
     thread: &ShowThreadQueryThreadOnEmailThread,
     open_messages: &HashSet<String>,
     show_icon_text: bool,
+    content_el: &ElRef<HtmlElement>,
 ) -> Node<Msg> {
     // TODO(wathiede): show per-message subject if it changes significantly from top-level subject
     let subject = if thread.subject.is_empty() {
@@ -867,13 +869,12 @@ fn thread(
                 ],
             ],
         ],
-        messages,
-        /* TODO(wathiede): plumb in orignal id
-        a![
-        attrs! {At::Href=>api::original(&thread_node.0.as_ref().expect("message missing").id)},
-        "Original"
-        ],
-        */
+        div![el_ref(content_el), messages] /* TODO(wathiede): plumb in orignal id
+                                           a![
+                                           attrs! {At::Href=>api::original(&thread_node.0.as_ref().expect("message missing").id)},
+                                           "Original"
+                                           ],
+                                           */
     ]
 }
 
@@ -1074,7 +1075,11 @@ pub fn tags(model: &Model) -> Node<Msg> {
         ]
     ]
 }
-fn news_post(post: &ShowThreadQueryThreadOnNewsPost, show_icon_text: bool) -> Node<Msg> {
+fn news_post(
+    post: &ShowThreadQueryThreadOnNewsPost,
+    show_icon_text: bool,
+    content_el: &ElRef<HtmlElement>,
+) -> Node<Msg> {
     // TODO(wathiede): show per-message subject if it changes significantly from top-level subject
     let subject = &post.title;
     set_title(subject);
@@ -1114,6 +1119,7 @@ fn news_post(post: &ShowThreadQueryThreadOnNewsPost, show_icon_text: bool) -> No
             div![C!["header"], render_news_post_header(&post)],
             div![
                 C!["body", "news-post", format!("site-{}", post.slug)],
+                el_ref(content_el),
                 raw![&post.body]
             ]
         ],
@@ -1190,7 +1196,7 @@ fn reading_progress(ratio: f64) -> Node<Msg> {
             "progress",
             "is-success",
             "is-small",
-            IF!(percent<5. => "is-invisible")
+            IF!(percent<1. => "is-invisible")
         ],
         attrs! {
             At::Value=>percent,
@@ -1200,7 +1206,7 @@ fn reading_progress(ratio: f64) -> Node<Msg> {
     ]
 }
 pub fn versions(versions: &crate::state::Version) -> Node<Msg> {
-    info!("versions {versions:?}");
+    debug!("versions {versions:?}");
     aside![
         C!["tags-menu", "menu"],
         p![C!["menu-label"], "Versions"],

web/src/view/tablet.rs

@@ -14,11 +14,11 @@ pub(super) fn view(model: &Model) -> Node<Msg> {
         Context::ThreadResult {
             thread: ShowThreadQueryThread::EmailThread(thread),
             open_messages,
-        } => view::thread(thread, open_messages, show_icon_text),
+        } => view::thread(thread, open_messages, show_icon_text, &model.content_el),
         Context::ThreadResult {
             thread: ShowThreadQueryThread::NewsPost(post),
             ..
-        } => view::news_post(post, show_icon_text),
+        } => view::news_post(post, show_icon_text, &model.content_el),
         Context::SearchResult {
             query,
             results,