Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[ WIP ] Attempted upgrade to yew 0.20 for mipsy-web, Run does not work #293

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions crates/mipsy_web/Cargo.toml
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ crate-type = ["cdylib", "rlib"]


[dependencies]
yew = "0.19.3"
yew-agent = "0.1.0"
yew = { version = "0.20", features = ["csr"] }
yew-agent = "0.2.0"
gloo-file = "0.2.0"
gloo-utils = { version = "0.1.5", features = ["serde"]}
web-sys = { version="0.3.55", features=["Element", "EventTarget", "HtmlElement", "HtmlSelectElement"] }
Expand All @@ -26,7 +26,7 @@ wasm-logger = "0.2.0"
git-version = "0.3.5"
derivative = "2.2.0"
gloo-console = "0.2.1"
bounce = "0.3.0"
bounce = "0.7.0"
serde_json = "1.0.82"

# [profile.release]
Expand Down
37 changes: 31 additions & 6 deletions crates/mipsy_web/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,15 +12,40 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />

<script>
function split_setup() {
Split(["#file_data", "#information"], {
sizes: [70, 30],
});
Split(["#regs", "#output"], {
direction: "vertical",
function waitForElm(selector) {
return new Promise(resolve => {
if (document.querySelector(selector)) {
return resolve(document.querySelector(selector));
}

const observer = new MutationObserver(mutations => {
if (document.querySelector(selector)) {
observer.disconnect();
resolve(document.querySelector(selector));
}
});

observer.observe(document.body, {
childList: true,
subtree: true
});
});
};

function split_setup() {
// wait for the elements to be created
// then split them
waitForElm("#file_data").then(() => {
Split(["#file_data", "#information"], {
sizes: [70, 30],
});
Split(["#regs", "#output"], {
direction: "vertical",
});

})
};

function alarm() {
console.error("AHHHHHHHHHHH");
};
Expand Down
3 changes: 2 additions & 1 deletion crates/mipsy_web/src/bin/app.rs
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@ pub fn app_wrapper() -> Html {
fn main() {
let document = web_sys::window().unwrap().document().unwrap();
let entry_point = document.get_element_by_id("yew_app").unwrap();
yew::start_app_in_element::<AppWrapper>(entry_point);

yew::Renderer::<AppWrapper>::with_root(entry_point).render();

wasm_logger::init(wasm_logger::Config::default());

Expand Down
7 changes: 4 additions & 3 deletions crates/mipsy_web/src/bin/worker.rs
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
use mipsy_web::worker::Worker;
use mipsy_web::worker::MipsyWebWorker;
use wasm_logger::Config;
use yew_agent::Threaded;
use yew_agent::PublicWorker;

fn main() {
wasm_logger::init(Config::default());
Worker::register();
MipsyWebWorker::register();
}
6 changes: 3 additions & 3 deletions crates/mipsy_web/src/components/decompiled.rs
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
use crate::{
state::state::{ErrorType::RuntimeError, State},
worker::{Worker, WorkerRequest},
worker::{MipsyWebWorker, WorkerRequest},
};
use derivative::Derivative;
use yew::{classes, function_component, html, Callback, Properties, UseStateHandle};
use yew::{classes, function_component, html, Html, Callback, Properties, UseStateHandle};
use yew_agent::UseBridgeHandle;

#[derive(Properties, Derivative)]
Expand All @@ -14,7 +14,7 @@ pub struct DecompiledProps {
pub state: UseStateHandle<State>,

#[derivative(PartialEq = "ignore")]
pub worker: UseBridgeHandle<Worker>,
pub worker: UseBridgeHandle<MipsyWebWorker>,
}

#[function_component(DecompiledCode)]
Expand Down
16 changes: 8 additions & 8 deletions crates/mipsy_web/src/components/navbar.rs
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
use crate::{
pages::main::app::NUM_INSTR_BEFORE_RESPONSE,
state::state::{DisplayedCodeTab, ErrorType, MipsState, RunningState, State},
worker::{FileInformation, Worker, WorkerRequest},
worker::{FileInformation, MipsyWebWorker, WorkerRequest},
};
use derivative::Derivative;
use log::info;
use yew::{prelude::*, Html};
use yew_agent::{Agent, UseBridgeHandle};
use yew_agent::{Worker, UseBridgeHandle};

#[derive(Properties, Derivative)]
#[derivative(PartialEq)]
Expand All @@ -20,7 +20,7 @@ pub struct NavBarProps {
pub state: UseStateHandle<State>,
pub is_saved: UseStateHandle<bool>,
#[derivative(PartialEq = "ignore")]
pub worker: UseBridgeHandle<Worker>,
pub worker: UseBridgeHandle<MipsyWebWorker>,
pub filename: UseStateHandle<Option<String>>,
pub file: UseStateHandle<Option<String>>,
pub show_tab: UseStateHandle<DisplayedCodeTab>,
Expand Down Expand Up @@ -94,7 +94,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
filename: filename.as_deref().unwrap_or("Untitled").to_string(),
file: file.as_deref().unwrap_or("").to_string(),
};
let input = <Worker as Agent>::Input::Run(
let input = <MipsyWebWorker as Worker>::Input::Run(
MipsState {
is_stepping: false,
..curr.mips_state.clone()
Expand Down Expand Up @@ -134,7 +134,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
..curr.clone()
}));
let input =
<Worker as Agent>::Input::ResetRuntime(curr.mips_state.clone());
<MipsyWebWorker as Worker>::Input::ResetRuntime(curr.mips_state.clone());
worker.send(input);
}
State::Error(ErrorType::RuntimeError(curr)) => {
Expand All @@ -145,7 +145,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
input_needed: None,
}));
let input =
<Worker as Agent>::Input::ResetRuntime(curr.mips_state.clone());
<MipsyWebWorker as Worker>::Input::ResetRuntime(curr.mips_state.clone());
worker.send(input);
}

Expand Down Expand Up @@ -219,7 +219,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
file: file.as_deref().unwrap_or("").to_string(),
};
let input =
<Worker as Agent>::Input::Run(new_mips_state, -1, file_information);
<MipsyWebWorker as Worker>::Input::Run(new_mips_state, -1, file_information);
worker.send(input);
} else {
info!("No File loaded, cannot step");
Expand Down Expand Up @@ -258,7 +258,7 @@ fn icons(props: &NavBarProps) -> Vec<Icon> {
file: file.as_deref().unwrap_or("").to_string(),
};
let input =
<Worker as Agent>::Input::Run(new_mips_state, 1, file_information);
<MipsyWebWorker as Worker>::Input::Run(new_mips_state, 1, file_information);
worker.send(input);
} else {
info!("No File loaded, cannot step");
Expand Down
33 changes: 14 additions & 19 deletions crates/mipsy_web/src/components/registers.rs
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@ use crate::components::data_segment::{FP_COLOR, SP_COLOR};
use crate::components::decompiled::{StopIconFilled, StopIconOutline};
use crate::state::config::{MipsyWebConfig, RegisterBase};
use crate::state::state::{ErrorType, RegisterTab, State};
use crate::worker::{Worker, WorkerRequest};
use crate::worker::{MipsyWebWorker, WorkerRequest};
use bounce::use_atom;
use derivative::Derivative;
use mipsy_lib::compile::breakpoints::{TargetAction, WatchpointTarget};
use mipsy_lib::{Register, Safe, KDATA_BOT, TEXT_BOT};
use yew::{function_component, html, Callback, Properties, UseStateHandle};
use yew::{function_component, html, Html, Callback, Properties, UseStateHandle};
use yew_agent::UseBridgeHandle;

const MIXED_BASE_MIN_ADDRESS: u32 = TEXT_BOT - 1024;
Expand All @@ -20,7 +20,13 @@ pub struct RegisterProps {
pub tab: UseStateHandle<RegisterTab>,

#[derivative(PartialEq = "ignore")]
pub worker: UseBridgeHandle<Worker>,
pub worker: UseBridgeHandle<MipsyWebWorker>,
}

pub fn register_is_uncommon(index: usize) -> bool {
index == usize::from(Register::K0.to_number()) ||
index == usize::from(Register::K1.to_number()) ||
index == usize::from(Register::Gp.to_number())
}

#[function_component(Registers)]
Expand All @@ -33,18 +39,15 @@ pub fn render_running_registers(props: &RegisterProps) -> Html {

let config = use_atom::<MipsyWebConfig>();

let show_uninitialised_registers = match &*props.tab {
RegisterTab::AllRegisters => true,
_ => false,
};
let show_uninitialised_registers = matches!(&*props.tab, RegisterTab::AllRegisters);

let registers = mips_state
.clone()
.map(|state| state.register_values.clone())
.map(|state| state.register_values)
.unwrap_or_else(|| vec![Safe::Uninitialised; 32]);

let previous_registers = mips_state
.map(|state| state.previous_registers.clone())
.map(|state| state.previous_registers)
.unwrap_or_else(|| vec![Safe::Uninitialised; 32]);

html! {
Expand All @@ -68,16 +71,8 @@ pub fn render_running_registers(props: &RegisterProps) -> Html {
<tbody>
{
for registers.iter().enumerate().map(|(index, item)| {
if !show_uninitialised_registers &&
config.hide_uncommon_registers &&
(index == usize::from(Register::K0.to_number()) ||
index == usize::from(Register::K1.to_number()) ||
index == usize::from(Register::Gp.to_number())
)
{
html!{}
}
else if !show_uninitialised_registers && item == &Safe::Uninitialised {
// dont' show uninit registers, or uncommon K0, K1, GP
if !show_uninitialised_registers && !register_is_uncommon(index) && item.as_option().is_some() {
html!{}
}
else {
Expand Down
14 changes: 7 additions & 7 deletions crates/mipsy_web/src/components/settings_modal.rs
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
label={"font size"}
hide_label={true}
// TODO - config selected, min max and font step
selected_value={(*config).font_size.to_string()}
selected_value={config.font_size.to_string()}
options={
(10..=70_i32)
.step_by(2)
Expand Down Expand Up @@ -132,7 +132,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
})}
label={"tab size"}
hide_label={true}
selected_value={(*config).tab_size.to_string()}
selected_value={config.tab_size.to_string()}
// TODO - config selected, min max and font step
options={
(2..=8_i32)
Expand Down Expand Up @@ -162,7 +162,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
})}
label={"register base"}
hide_label={true}
selected_value={(*config).register_base.to_string()}
selected_value={config.register_base.to_string()}
options={
vec!["Hexadecimal".to_string(), "Decimal".to_string(), "Binary".to_string(), "Mixed".to_string()]
}
Expand Down Expand Up @@ -198,7 +198,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
})}}
label={"monaco theme"}
hide_label={true}
selected_value={(*config).monaco_theme.clone()}
selected_value={config.monaco_theme.clone()}
options={
vec![
"vs".to_string(),
Expand Down Expand Up @@ -226,7 +226,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
})

}
color={(&*config.font_color.0).to_string()}
color={(*config.font_color.0).to_string()}
/>
<button
type="button"
Expand All @@ -238,7 +238,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
font_color: FontColor::default(),
..(*config).clone()
});
crate::update_font_color(&*FontColor::default().0);
crate::update_font_color(&FontColor::default().0);
})
}
>
Expand Down Expand Up @@ -267,7 +267,7 @@ pub fn render_modal(props: &ModalProps) -> Html {
crate::update_primary_color(&val);
})
}
color={(&*config.primary_color.0).to_string()}
color={(*config.primary_color.0).to_string()}
/>

<button
Expand Down
Loading
Loading