From 378cbfabd9234892f357b31dc21f972b127a4020 Mon Sep 17 00:00:00 2001 From: Evan Almloff Date: Fri, 20 Oct 2023 08:45:04 -0500 Subject: [PATCH] fix desktop mounted event --- packages/desktop/src/element.rs | 6 +- packages/desktop/src/lib.rs | 2 +- packages/interpreter/src/interpreter.js | 121 +----------------- .../interpreter/src/sledgehammer_bindings.rs | 5 +- packages/liveview/src/element.rs | 9 +- 5 files changed, 17 insertions(+), 126 deletions(-) diff --git a/packages/desktop/src/element.rs b/packages/desktop/src/element.rs index 20ca951bf..b5f12c3f2 100644 --- a/packages/desktop/src/element.rs +++ b/packages/desktop/src/element.rs @@ -30,7 +30,7 @@ impl RenderedElementBacking for DesktopElement { >, >, > { - let script = format!("return window.interpreter.GetClientRect({});", self.id.0); + let script = format!("return window.interpreter.getClientRect({});", self.id.0); let fut = self .query @@ -54,7 +54,7 @@ impl RenderedElementBacking for DesktopElement { behavior: dioxus_html::ScrollBehavior, ) -> std::pin::Pin>>> { let script = format!( - "return window.interpreter.ScrollTo({}, {});", + "return window.interpreter.scrollTo({}, {});", self.id.0, serde_json::to_string(&behavior).expect("Failed to serialize ScrollBehavior") ); @@ -81,7 +81,7 @@ impl RenderedElementBacking for DesktopElement { focus: bool, ) -> std::pin::Pin>>> { let script = format!( - "return window.interpreter.SetFocus({}, {});", + "return window.interpreter.setFocus({}, {});", self.id.0, focus ); diff --git a/packages/desktop/src/lib.rs b/packages/desktop/src/lib.rs index 406d6ffb8..b092ceeec 100644 --- a/packages/desktop/src/lib.rs +++ b/packages/desktop/src/lib.rs @@ -29,7 +29,7 @@ use desktop_context::{EventData, UserWindowEvent, WebviewQueue, WindowEventHandl use dioxus_core::*; use dioxus_html::{event_bubbles, MountedData}; use dioxus_html::{native_bind::NativeFileEngine, FormData, HtmlEvent}; -use dioxus_interpreter_js::Channel; +use dioxus_interpreter_js::binary_protocol::Channel; use element::DesktopElement; use eval::init_eval; use futures_util::{pin_mut, FutureExt}; diff --git a/packages/interpreter/src/interpreter.js b/packages/interpreter/src/interpreter.js index aaeb3a871..b5f80a377 100644 --- a/packages/interpreter/src/interpreter.js +++ b/packages/interpreter/src/interpreter.js @@ -1,5 +1,3 @@ -import { setAttributeInner } from "./common.js"; - class InterpreterConfig { constructor(intercept_link_redirects) { this.intercept_link_redirects = intercept_link_redirects; @@ -215,45 +213,6 @@ class ListenerMap { delete this.local[id]; } } -function SetAttributeInner(node, field, value, ns) { - const name = field; - if (ns === "style") { - // ????? why do we need to do this - if (node.style === undefined) { - node.style = {}; - } - node.style[name] = value; - } else if (ns !== null && ns !== undefined && ns !== "") { - node.setAttributeNS(ns, name, value); - } else { - switch (name) { - case "value": - if (value !== node.value) { - node.value = value; - } - break; - case "initial_value": - node.defaultValue = value; - break; - case "checked": - node.checked = truthy(value); - break; - case "selected": - node.selected = truthy(value); - break; - case "dangerous_inner_html": - node.innerHTML = value; - break; - default: - // https://github.com/facebook/react/blob/8b88ac2592c5f555f315f9440cbb665dd1e7457a/packages/react-dom/src/shared/DOMProperty.js#L352-L364 - if (!truthy(value) && bool_attrs.hasOwnProperty(name)) { - node.removeAttribute(name); - } else { - node.setAttribute(name, value); - } - } - } -} function LoadChild(array) { // iterate through each number and get that child node = stack[stack.length - 1]; @@ -284,41 +243,10 @@ function AppendChildren(id, many) { root.appendChild(els[k]); } } -const bool_attrs = { - allowfullscreen: true, - allowpaymentrequest: true, - async: true, - autofocus: true, - autoplay: true, - checked: true, - controls: true, - default: true, - defer: true, - disabled: true, - formnovalidate: true, - hidden: true, - ismap: true, - itemscope: true, - loop: true, - multiple: true, - muted: true, - nomodule: true, - novalidate: true, - open: true, - playsinline: true, - readonly: true, - required: true, - reversed: true, - selected: true, - truespeed: true, - webkitdirectory: true, -}; -function truthy(val) { - return val === "true" || val === true; -} +window.interpreter = {} -function getClientRect(id) { +window.interpreter.getClientRect = function (id) { const node = nodes[id]; if (!node) { return; @@ -331,7 +259,7 @@ function getClientRect(id) { }; } -function scrollTo(id, behavior) { +window.interpreter.scrollTo = function (id, behavior) { const node = nodes[id]; if (!node) { return false; @@ -343,7 +271,7 @@ function scrollTo(id, behavior) { } /// Set the focus on the element -function setFocus(id, focus) { +window.interpreter.setFocus = function (id, focus) { const node = nodes[id]; if (!node) { return false; @@ -356,47 +284,6 @@ function setFocus(id, focus) { return true; } -function saveTemplate(template) { - let roots = []; - for (let root of template.roots) { - roots.push(this.MakeTemplateNode(root)); - } - this.templates[template.name] = roots; -} - -function makeTemplateNode(node) { - switch (node.type) { - case "Text": - return document.createTextNode(node.text); - case "Dynamic": - let dyn = document.createElement("pre"); - dyn.hidden = true; - return dyn; - case "DynamicText": - return document.createTextNode("placeholder"); - case "Element": - let el; - - if (node.namespace != null) { - el = document.createElementNS(node.namespace, node.tag); - } else { - el = document.createElement(node.tag); - } - - for (let attr of node.attrs) { - if (attr.type == "Static") { - setAttributeInner(el, attr.name, attr.value, attr.namespace); - } - } - - for (let child of node.children) { - el.appendChild(this.MakeTemplateNode(child)); - } - - return el; - } -} - function get_mouse_data(event) { const { altKey, diff --git a/packages/interpreter/src/sledgehammer_bindings.rs b/packages/interpreter/src/sledgehammer_bindings.rs index ac1fbf5f0..4203f4d15 100644 --- a/packages/interpreter/src/sledgehammer_bindings.rs +++ b/packages/interpreter/src/sledgehammer_bindings.rs @@ -296,6 +296,7 @@ pub mod binary_protocol { #[bindgen] mod protocol_js { const JS_FILE: &str = "./packages/interpreter/src/interpreter.js"; + const JS_FILE: &str = "./packages/interpreter/src/common.js"; fn mount_to_root() { "{AppendChildren(root, stack.length-1);}" @@ -382,10 +383,10 @@ pub mod binary_protocol { "{nodes[$id$].textContent = $text$;}" } fn set_attribute(id: u32, field: &str, value: &str, ns: &str) { - "{node = nodes[$id$]; SetAttributeInner(node, $field$, $value$, $ns$);}" + "{node = nodes[$id$]; setAttributeInner(node, $field$, $value$, $ns$);}" } fn set_top_attribute(field: &str, value: &str, ns: &str) { - "{SetAttributeInner(stack[stack.length-1], $field$, $value$, $ns$);}" + "{setAttributeInner(stack[stack.length-1], $field$, $value$, $ns$);}" } fn remove_attribute(id: u32, field: &str, ns: &str) { r#"{ diff --git a/packages/liveview/src/element.rs b/packages/liveview/src/element.rs index 6fb1fb436..600f7f20d 100644 --- a/packages/liveview/src/element.rs +++ b/packages/liveview/src/element.rs @@ -29,7 +29,7 @@ impl RenderedElementBacking for LiveviewElement { >, >, > { - let script = format!("return getClientRect({});", self.id.0); + let script = format!("return window.interpreter.getClientRect({});", self.id.0); let fut = self .query @@ -53,7 +53,7 @@ impl RenderedElementBacking for LiveviewElement { behavior: dioxus_html::ScrollBehavior, ) -> std::pin::Pin>>> { let script = format!( - "return scrollTo({}, {});", + "return window.interpreter.scrollTo({}, {});", self.id.0, serde_json::to_string(&behavior).expect("Failed to serialize ScrollBehavior") ); @@ -76,7 +76,10 @@ impl RenderedElementBacking for LiveviewElement { &self, focus: bool, ) -> std::pin::Pin>>> { - let script = format!("return setFocus({}, {});", self.id.0, focus); + let script = format!( + "return window.interpreter.setFocus({}, {});", + self.id.0, focus + ); let fut = self.query.new_query::(&script).resolve();