stephenseo/EN605.607.81.SP22_ASDM_Project
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Reverse info_text vertically

Browse source 
info_text's latest messages now appear at the top instead of at the
bottom.
This commit is contained in:
Stephen Seo 2022-03-02 15:38:24 +09:00
parent 15c7dc7654
commit 45e2c88745
4 changed files with 63 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
front_end/index.html
View file

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

4
front_end/src/main.rs
View file

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

12
front_end/src/state.rs
View file

@ -1,9 +1,9 @@
use std::collections::VecDeque;
use std::cell::{Cell, RefCell}; use std::cell::{Cell, RefCell};
use std::collections::VecDeque;
use std::rc::Rc; use std::rc::Rc;
use yew::prelude::*; use yew::prelude::*;
#[derive(Clone, Debug, PartialEq, Eq)] #[derive(Clone, Debug, PartialEq, Eq, Default)]
pub struct MessageBus { pub struct MessageBus {
queued: VecDeque<String>, 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)] #[derive(Copy, Clone, Debug, PartialEq, Eq)]
pub enum BoardState { pub enum BoardState {
Empty, Empty,

99
front_end/src/yew_components.rs
View file

@ -1,8 +1,8 @@
use crate::state::{MessageBus, BoardState, Turn, SharedState};
use crate::constants::{COLS, INFO_TEXT_HEIGHT, INFO_TEXT_MAX_ITEMS}; 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::cell::{Cell, RefCell};
use std::rc::Rc; use std::rc::Rc;
use yew::prelude::*;
pub struct Slot {} pub struct Slot {}
@ -155,53 +155,68 @@ impl Component for Wrapper {
.context::<SharedState>(Callback::noop()) .context::<SharedState>(Callback::noop())
.expect("state to be set"); .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();
let split_str: Vec<&str> = msg.split_whitespace().collect(); if split_str.len() == 2 {
if split_str.len() == 2 { if split_str[0] == "pressed" {
if split_str[0] == "pressed" { if let Ok(idx) = split_str[1].parse::<u8>() {
if let Ok(idx) = split_str[1].parse::<u8>() { let output_str: String = format!("Got {idx} pressed.");
let output_str: String = format!("Got {idx} pressed."); // DEBUG
//log::info!("{}", &output_str);
if let Some(info_text) =
shared.info_text_ref.cast::<web_sys::HtmlParagraphElement>()
{
// create the new text to be appended in the output
let window = web_sys::window().expect("no window exists");
let document =
window.document().expect("window should have a document");
let p = document
.create_element("p")
.expect("document should be able to create <p>");
p.set_text_content(Some(&output_str));
// check if scrolled to top
// DEBUG // DEBUG
//log::info!("{}", &output_str); //log::info!(
if let Some(info_text) = // "pre: scroll top is {}, scroll height is {}",
shared.info_text_ref.cast::<web_sys::HtmlParagraphElement>() // info_text.scroll_top(),
{ // info_text.scroll_height()
// create the new text to be appended in the output //);
let window = web_sys::window().expect("no window exists"); let at_top: bool = info_text.scroll_top()
let document = <= INFO_TEXT_HEIGHT - info_text.scroll_height();
window.document().expect("window should have a document");
let p = document
.create_element("p")
.expect("document should be able to create <p>");
p.set_text_content(Some(&output_str));
// check if scrolled to bottom // append text to output
let at_bottom: bool = info_text.scroll_top() + INFO_TEXT_HEIGHT info_text
>= info_text.scroll_height(); .append_with_node_1(&p)
.expect("should be able to append to info_text");
// append text to output while info_text.child_element_count() > INFO_TEXT_MAX_ITEMS {
info_text info_text
.append_with_node_1(&p) .remove_child(&info_text.first_child().unwrap())
.expect("should be able to append to info_text"); .expect("should be able to limit items in info_text");
while info_text.child_element_count() > INFO_TEXT_MAX_ITEMS {
info_text
.remove_child(&info_text.first_child().unwrap())
.expect("should be able to limit items in info_text");
}
// scroll to bottom only if at bottom
if at_bottom {
info_text.set_scroll_top(info_text.scroll_height());
}
} else {
log::warn!("Failed to get \"info_text\"");
} }
// scroll to bottom only if at bottom
// 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;
} }
} }
} }