mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-11-23 20:53:06 +00:00
fix desktop mounted event
This commit is contained in:
parent
007aacc247
commit
378cbfabd9
5 changed files with 17 additions and 126 deletions
|
@ -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
|
let fut = self
|
||||||
.query
|
.query
|
||||||
|
@ -54,7 +54,7 @@ impl RenderedElementBacking for DesktopElement {
|
||||||
behavior: dioxus_html::ScrollBehavior,
|
behavior: dioxus_html::ScrollBehavior,
|
||||||
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
||||||
let script = format!(
|
let script = format!(
|
||||||
"return window.interpreter.ScrollTo({}, {});",
|
"return window.interpreter.scrollTo({}, {});",
|
||||||
self.id.0,
|
self.id.0,
|
||||||
serde_json::to_string(&behavior).expect("Failed to serialize ScrollBehavior")
|
serde_json::to_string(&behavior).expect("Failed to serialize ScrollBehavior")
|
||||||
);
|
);
|
||||||
|
@ -81,7 +81,7 @@ impl RenderedElementBacking for DesktopElement {
|
||||||
focus: bool,
|
focus: bool,
|
||||||
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
||||||
let script = format!(
|
let script = format!(
|
||||||
"return window.interpreter.SetFocus({}, {});",
|
"return window.interpreter.setFocus({}, {});",
|
||||||
self.id.0, focus
|
self.id.0, focus
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
|
@ -29,7 +29,7 @@ use desktop_context::{EventData, UserWindowEvent, WebviewQueue, WindowEventHandl
|
||||||
use dioxus_core::*;
|
use dioxus_core::*;
|
||||||
use dioxus_html::{event_bubbles, MountedData};
|
use dioxus_html::{event_bubbles, MountedData};
|
||||||
use dioxus_html::{native_bind::NativeFileEngine, FormData, HtmlEvent};
|
use dioxus_html::{native_bind::NativeFileEngine, FormData, HtmlEvent};
|
||||||
use dioxus_interpreter_js::Channel;
|
use dioxus_interpreter_js::binary_protocol::Channel;
|
||||||
use element::DesktopElement;
|
use element::DesktopElement;
|
||||||
use eval::init_eval;
|
use eval::init_eval;
|
||||||
use futures_util::{pin_mut, FutureExt};
|
use futures_util::{pin_mut, FutureExt};
|
||||||
|
|
|
@ -1,5 +1,3 @@
|
||||||
import { setAttributeInner } from "./common.js";
|
|
||||||
|
|
||||||
class InterpreterConfig {
|
class InterpreterConfig {
|
||||||
constructor(intercept_link_redirects) {
|
constructor(intercept_link_redirects) {
|
||||||
this.intercept_link_redirects = intercept_link_redirects;
|
this.intercept_link_redirects = intercept_link_redirects;
|
||||||
|
@ -215,45 +213,6 @@ class ListenerMap {
|
||||||
delete this.local[id];
|
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) {
|
function LoadChild(array) {
|
||||||
// iterate through each number and get that child
|
// iterate through each number and get that child
|
||||||
node = stack[stack.length - 1];
|
node = stack[stack.length - 1];
|
||||||
|
@ -284,41 +243,10 @@ function AppendChildren(id, many) {
|
||||||
root.appendChild(els[k]);
|
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];
|
const node = nodes[id];
|
||||||
if (!node) {
|
if (!node) {
|
||||||
return;
|
return;
|
||||||
|
@ -331,7 +259,7 @@ function getClientRect(id) {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function scrollTo(id, behavior) {
|
window.interpreter.scrollTo = function (id, behavior) {
|
||||||
const node = nodes[id];
|
const node = nodes[id];
|
||||||
if (!node) {
|
if (!node) {
|
||||||
return false;
|
return false;
|
||||||
|
@ -343,7 +271,7 @@ function scrollTo(id, behavior) {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// Set the focus on the element
|
/// Set the focus on the element
|
||||||
function setFocus(id, focus) {
|
window.interpreter.setFocus = function (id, focus) {
|
||||||
const node = nodes[id];
|
const node = nodes[id];
|
||||||
if (!node) {
|
if (!node) {
|
||||||
return false;
|
return false;
|
||||||
|
@ -356,47 +284,6 @@ function setFocus(id, focus) {
|
||||||
return true;
|
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) {
|
function get_mouse_data(event) {
|
||||||
const {
|
const {
|
||||||
altKey,
|
altKey,
|
||||||
|
|
|
@ -296,6 +296,7 @@ pub mod binary_protocol {
|
||||||
#[bindgen]
|
#[bindgen]
|
||||||
mod protocol_js {
|
mod protocol_js {
|
||||||
const JS_FILE: &str = "./packages/interpreter/src/interpreter.js";
|
const JS_FILE: &str = "./packages/interpreter/src/interpreter.js";
|
||||||
|
const JS_FILE: &str = "./packages/interpreter/src/common.js";
|
||||||
|
|
||||||
fn mount_to_root() {
|
fn mount_to_root() {
|
||||||
"{AppendChildren(root, stack.length-1);}"
|
"{AppendChildren(root, stack.length-1);}"
|
||||||
|
@ -382,10 +383,10 @@ pub mod binary_protocol {
|
||||||
"{nodes[$id$].textContent = $text$;}"
|
"{nodes[$id$].textContent = $text$;}"
|
||||||
}
|
}
|
||||||
fn set_attribute(id: u32, field: &str<u8, attr>, value: &str, ns: &str<u8, ns_cache>) {
|
fn set_attribute(id: u32, field: &str<u8, attr>, value: &str, ns: &str<u8, ns_cache>) {
|
||||||
"{node = nodes[$id$]; SetAttributeInner(node, $field$, $value$, $ns$);}"
|
"{node = nodes[$id$]; setAttributeInner(node, $field$, $value$, $ns$);}"
|
||||||
}
|
}
|
||||||
fn set_top_attribute(field: &str<u8, attr>, value: &str, ns: &str<u8, ns_cache>) {
|
fn set_top_attribute(field: &str<u8, attr>, value: &str, ns: &str<u8, ns_cache>) {
|
||||||
"{SetAttributeInner(stack[stack.length-1], $field$, $value$, $ns$);}"
|
"{setAttributeInner(stack[stack.length-1], $field$, $value$, $ns$);}"
|
||||||
}
|
}
|
||||||
fn remove_attribute(id: u32, field: &str<u8, attr>, ns: &str<u8, ns_cache>) {
|
fn remove_attribute(id: u32, field: &str<u8, attr>, ns: &str<u8, ns_cache>) {
|
||||||
r#"{
|
r#"{
|
||||||
|
|
|
@ -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
|
let fut = self
|
||||||
.query
|
.query
|
||||||
|
@ -53,7 +53,7 @@ impl RenderedElementBacking for LiveviewElement {
|
||||||
behavior: dioxus_html::ScrollBehavior,
|
behavior: dioxus_html::ScrollBehavior,
|
||||||
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
||||||
let script = format!(
|
let script = format!(
|
||||||
"return scrollTo({}, {});",
|
"return window.interpreter.scrollTo({}, {});",
|
||||||
self.id.0,
|
self.id.0,
|
||||||
serde_json::to_string(&behavior).expect("Failed to serialize ScrollBehavior")
|
serde_json::to_string(&behavior).expect("Failed to serialize ScrollBehavior")
|
||||||
);
|
);
|
||||||
|
@ -76,7 +76,10 @@ impl RenderedElementBacking for LiveviewElement {
|
||||||
&self,
|
&self,
|
||||||
focus: bool,
|
focus: bool,
|
||||||
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
) -> std::pin::Pin<Box<dyn futures_util::Future<Output = dioxus_html::MountedResult<()>>>> {
|
||||||
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::<bool>(&script).resolve();
|
let fut = self.query.new_query::<bool>(&script).resolve();
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue