Reverse info_text vertically

info_text's latest messages now appear at the top instead of at the
bottom.

front_end/index.html

@@ -22,6 +22,8 @@
         overflow-x: hidden;
         overflow-y: auto;
         word-wrap: break-word;
+        display: flex;
+        flex-direction: column-reverse;
       }
       button.slot {
         width: 50px;

front_end/src/main.rs

@@ -1,10 +1,10 @@
+mod constants;
 mod state;
 mod yew_components;
-mod constants;
 
 use state::SharedState;
-use yew_components::Wrapper;
 use yew::prelude::*;
+use yew_components::Wrapper;
 
 #[function_component(App)]
 pub fn app() -> Html {

front_end/src/state.rs

@@ -1,9 +1,9 @@
-use std::collections::VecDeque;
 use std::cell::{Cell, RefCell};
+use std::collections::VecDeque;
 use std::rc::Rc;
 use yew::prelude::*;
 
-#[derive(Clone, Debug, PartialEq, Eq)]
+#[derive(Clone, Debug, PartialEq, Eq, Default)]
 pub struct MessageBus {
     queued: VecDeque<String>,
 }
@@ -19,14 +19,6 @@ impl MessageBus {
     }
 }
 
-impl Default for MessageBus {
-    fn default() -> Self {
-        Self {
-            queued: VecDeque::new(),
-        }
-    }
-}
-
 #[derive(Copy, Clone, Debug, PartialEq, Eq)]
 pub enum BoardState {
     Empty,

front_end/src/yew_components.rs

@@ -1,8 +1,8 @@
-use crate::state::{MessageBus, BoardState, Turn, SharedState};
 use crate::constants::{COLS, INFO_TEXT_HEIGHT, INFO_TEXT_MAX_ITEMS};
-use yew::prelude::*;
+use crate::state::{BoardState, MessageBus, SharedState, Turn};
 use std::cell::{Cell, RefCell};
 use std::rc::Rc;
+use yew::prelude::*;
 
 pub struct Slot {}
 
@@ -155,8 +155,7 @@ impl Component for Wrapper {
             .context::<SharedState>(Callback::noop())
             .expect("state to be set");
 
-        loop {
+        while let Some(msg) = shared.bus.borrow_mut().get_next_msg() {
-            if let Some(msg) = shared.bus.borrow_mut().get_next_msg() {
             let split_str: Vec<&str> = msg.split_whitespace().collect();
             if split_str.len() == 2 {
                 if split_str[0] == "pressed" {
@@ -176,9 +175,16 @@ impl Component for Wrapper {
                                 .expect("document should be able to create <p>");
                             p.set_text_content(Some(&output_str));
 
-                                // check if scrolled to bottom
+                            // check if scrolled to top
-                                let at_bottom: bool = info_text.scroll_top() + INFO_TEXT_HEIGHT
+
-                                    >= info_text.scroll_height();
+                            // DEBUG
+                            //log::info!(
+                            //    "pre: scroll top is {}, scroll height is {}",
+                            //    info_text.scroll_top(),
+                            //    info_text.scroll_height()
+                            //);
+                            let at_top: bool = info_text.scroll_top()
+                                <= INFO_TEXT_HEIGHT - info_text.scroll_height();
 
                             // append text to output
                             info_text
@@ -191,18 +197,27 @@ impl Component for Wrapper {
                             }
 
                             // scroll to bottom only if at bottom
-                                if at_bottom {
+
-                                    info_text.set_scroll_top(info_text.scroll_height());
+                            // DEBUG
+                            //log::info!("at_top is {}", if at_top { "true" } else { "false" });
+
+                            if at_top {
+                                info_text
+                                    .set_scroll_top(INFO_TEXT_HEIGHT - info_text.scroll_height());
                             }
+
+                            // DEBUG
+                            //log::info!(
+                            //    "post: scroll top is {}, scroll height is {}",
+                            //    info_text.scroll_top(),
+                            //    info_text.scroll_height()
+                            //);
                         } else {
                             log::warn!("Failed to get \"info_text\"");
                         }
                     }
                 }
             }
-            } else {
-                break;
-            }
         }
     }