diff --git a/index.html b/index.html index 03141f9..b50f756 100644 --- a/index.html +++ b/index.html @@ -43,7 +43,6 @@ - diff --git a/src/editor_view.rs b/src/editor_view.rs index 65ef294..1ff5c0a 100644 --- a/src/editor_view.rs +++ b/src/editor_view.rs @@ -4,7 +4,7 @@ use anyhow::Error; use itertools::Itertools; use wasm_bindgen::{closure::Closure, prelude::wasm_bindgen, JsCast}; use wasm_bindgen_futures::js_sys::{Function, Object, Reflect}; -use web_sys::{window, HtmlElement}; +use web_sys::{console, window, HtmlElement, KeyboardEvent}; use yew::{ function_component, html, use_effect_with, use_memo, use_node_ref, use_state, use_state_eq, AttrValue, Callback, Html, Properties, UseStateHandle, @@ -152,13 +152,16 @@ fn editor_nav(props: &EditorViewDetailProps) -> Html { .available_files .iter() .map(|f| { - let mut classes = vec!["list-group-item"]; + let mut classes = vec!["list-group-item", "pe-auto"]; let mut aria_current = None; if *f == props.editor_state.open_file { aria_current = Some("true"); classes.push("active"); } - html! {
  • {f}
  • } + html! {
  • {f}
  • } }) .collect::>() } @@ -366,6 +369,7 @@ fn load_file_contents(file: &str) -> anyhow::Result { fn editor_area(props: &EditorViewDetailProps) -> Html { let node_ref = use_node_ref(); let editor_state = props.editor_state.clone(); + let closures = use_state(|| EditorKeepClosures { change_closure: Closure::new(move |view_update: ViewUpdate| { if view_update.doc_changed() { @@ -506,8 +510,40 @@ pub fn editor_view(props: &EditorViewProps) -> Html { editor_state: editor_state.clone(), }; + let current_script = editor_state.open_file.clone(); + + let set_err_state = editor_state.clone(); + let set_err = Rc::new(move |msg: Option<&str>| { + let mut new_state = (*set_err_state.as_ref()).clone(); + new_state.error_msg = msg.map(|v| AttrValue::from(String::from(v))); + set_err_state.set(new_state.into()); + }); + let editor_ref = use_node_ref(); + let global_layout = props.global_layout.clone(); + let frame = props.frame.clone(); + let editor_closure: UseStateHandle>>> = + use_state(|| None); + let editor_ref_eff = editor_ref.clone(); + let global_memo = props.global_memo.clone(); + use_effect_with((), move |()| { + if let Some(editor_node) = editor_ref_eff.get() { + let closure = Closure::new(move |ev: KeyboardEvent| { + console::log_1(&ev); + if ev.code() == "Enter" && ev.get_modifier_state("Control") { + run_script(¤t_script, &global_memo, set_err.clone()); + ev.prevent_default(); + } else if ev.code() == "Escape" { + close_editor(&frame, &global_layout); + } + }); + let _ = editor_node + .add_event_listener_with_callback("keydown", closure.as_ref().unchecked_ref()); + editor_closure.set(Some(closure.into())); + } + }); + html! { - <> +
    {match editor_state.error_msg.as_ref() { None => { html! { <> }} Some(msg) => { @@ -526,6 +562,6 @@ pub fn editor_view(props: &EditorViewProps) -> Html { first={html!{}} second={html!{}} /> - +
    } }