From a026acbc3117a30b9ee78e16eac526863ef977f3 Mon Sep 17 00:00:00 2001 From: tiye Date: Tue, 7 Jun 2022 01:03:09 +0800 Subject: [PATCH] handle blur event; support optional attribute; alpha tag 0.0.11-a2 --- Cargo.lock | 2 +- Cargo.toml | 3 ++- src/respo/patch.rs | 29 +++++++++++++++++++++++++++-- src/respo/primes.rs | 24 +++++++++++++++++++++++- 4 files changed, 53 insertions(+), 5 deletions(-) diff --git a/Cargo.lock b/Cargo.lock index 377d629..1e9c274 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -99,7 +99,7 @@ dependencies = [ [[package]] name = "respo" -version = "0.0.11-a1" +version = "0.0.11-a2" dependencies = [ "cirru_parser", "console_error_panic_hook", diff --git a/Cargo.toml b/Cargo.toml index 37f837d..f4ec225 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -1,6 +1,6 @@ [package] name = "respo" -version = "0.0.11-a1" +version = "0.0.11-a2" edition = "2021" description = "a tiny virtual DOM library migrated from ClojureScript" license = "Apache-2.0" @@ -43,4 +43,5 @@ features = [ "Element", "HtmlCollection", "CssStyleDeclaration", + "FocusEvent", ] diff --git a/src/respo/patch.rs b/src/respo/patch.rs index 574b6c0..46af73f 100644 --- a/src/respo/patch.rs +++ b/src/respo/patch.rs @@ -1,7 +1,7 @@ use std::fmt::Debug; use wasm_bindgen::prelude::Closure; -use web_sys::{Element, HtmlElement, HtmlInputElement, InputEvent, KeyboardEvent, MouseEvent, Node}; +use web_sys::{Element, FocusEvent, HtmlElement, HtmlInputElement, InputEvent, KeyboardEvent, MouseEvent, Node}; use wasm_bindgen::JsCast; use web_sys::console::warn_1; @@ -227,7 +227,7 @@ fn find_coord_dom_target(mount_target: &Node, coord: &[u32]) -> Result Result<(), String> { let coord = coord.to_owned(); - // util::log!("attach event {}", key); + // crate::util::log!("attach event {}", key); match key { "click" => { let handler = Closure::wrap(Box::new(move |e: MouseEvent| { @@ -308,6 +308,7 @@ pub fn attach_event(element: &Element, key: &str, coord: &[RespoCoord], handle_e } "keydown" => { let handler = Closure::wrap(Box::new(move |e: KeyboardEvent| { + // crate::util::log!("calling handler"); let wrap_event = RespoEvent::Keyboard { key: e.key(), key_code: e.key_code(), @@ -372,6 +373,30 @@ pub fn attach_event(element: &Element, key: &str, coord: &[RespoCoord], handle_e .set_onkeypress(Some(handler.as_ref().unchecked_ref())); handler.forget(); } + "focus" => { + let handler = Closure::wrap(Box::new(move |e: FocusEvent| { + handle_event + .run(RespoEventMark::new("focus", &coord, RespoEvent::Focus(e))) + .expect("handle focus event"); + }) as Box); + element + .dyn_ref::() + .expect("convert to html input element") + .set_onfocus(Some(handler.as_ref().unchecked_ref())); + handler.forget(); + } + "blur" => { + let handler = Closure::wrap(Box::new(move |e: FocusEvent| { + handle_event + .run(RespoEventMark::new("blur", &coord, RespoEvent::Focus(e))) + .expect("handle blur event"); + }) as Box); + element + .dyn_ref::() + .expect("convert to html input element") + .set_onblur(Some(handler.as_ref().unchecked_ref())); + handler.forget(); + } _ => { warn_1(&format!("unhandled event: {}", key).into()); } diff --git a/src/respo/primes.rs b/src/respo/primes.rs index df04024..1636315 100644 --- a/src/respo/primes.rs +++ b/src/respo/primes.rs @@ -8,7 +8,7 @@ use cirru_parser::{Cirru, CirruWriterOptions}; use serde::de::DeserializeOwned; use serde::{Deserialize, Serialize}; use serde_json::Value; -use web_sys::{InputEvent, KeyboardEvent, MouseEvent, Node}; +use web_sys::{FocusEvent, InputEvent, KeyboardEvent, MouseEvent, Node}; use crate::{MaybeState, StatesTree}; @@ -138,6 +138,26 @@ where } self } + pub fn maybe_insert_attr(&mut self, property: U, value: Option) -> &mut Self + where + U: Into + ToOwned, + V: Into + ToOwned, + { + if let Some(v) = value { + match self { + RespoNode::Component(_, _, node) => { + node.insert_attr(property, v); + } + RespoNode::Element { ref mut attrs, .. } => { + attrs.insert(property.into(), v.into()); + } + RespoNode::Referenced(_) => { + unreachable!("should not be called on a referenced node"); + } + } + } + self + } pub fn add_attrs(&mut self, more: U) -> &mut Self where U: IntoIterator, @@ -406,6 +426,8 @@ pub enum RespoEvent { value: String, original_event: InputEvent, }, + Focus(FocusEvent), + Blur(FocusEvent), } /// effects that attached to components