diff --git a/packages/desktop/src/lib.rs b/packages/desktop/src/lib.rs index d8a0f8746..deaa93f12 100644 --- a/packages/desktop/src/lib.rs +++ b/packages/desktop/src/lib.rs @@ -240,16 +240,16 @@ fn build_webview( // in release mode, we don't want to show the dev tool or reload menus webview = webview.with_initialization_script( r#" - if (document.addEventListener) { - document.addEventListener('contextmenu', function(e) { - e.preventDefault(); - }, false); - } else { - document.attachEvent('oncontextmenu', function() { - window.event.returnValue = false; - }); - } - "#, + if (document.addEventListener) { + document.addEventListener('contextmenu', function(e) { + e.preventDefault(); + }, false); + } else { + document.attachEvent('oncontextmenu', function() { + window.event.returnValue = false; + }); + } + "#, ) } else { // in debug, we are okay with the reload menu showing and dev tool diff --git a/packages/desktop/src/main.js b/packages/desktop/src/main.js new file mode 100644 index 000000000..c1f0cf9f4 --- /dev/null +++ b/packages/desktop/src/main.js @@ -0,0 +1,7 @@ +export function main() { + let root = window.document.getElementById("main"); + if (root != null) { + window.interpreter = new Interpreter(root); + window.ipc.postMessage(serializeIpcMessage("initialize")); + } +} diff --git a/packages/desktop/src/protocol.rs b/packages/desktop/src/protocol.rs index a544aa305..f9c96cfea 100644 --- a/packages/desktop/src/protocol.rs +++ b/packages/desktop/src/protocol.rs @@ -52,7 +52,14 @@ pub(super) fn desktop_handler( } else if trimmed == "index.js" { Response::builder() .header("Content-Type", "text/javascript") - .body(dioxus_interpreter_js::INTERPRETER_JS.as_bytes().to_vec()) + .body( + format!( + "{} {}", + dioxus_interpreter_js::INTERPRETER_JS, + include_str!("./main.js") + ) + .into_bytes(), + ) .map_err(From::from) } else { let asset_root = asset_root diff --git a/packages/html/src/transit.rs b/packages/html/src/transit.rs index 803869f31..498feaeae 100644 --- a/packages/html/src/transit.rs +++ b/packages/html/src/transit.rs @@ -29,6 +29,12 @@ pub struct HtmlEvent { pub data: EventData, } +impl HtmlEvent { + pub fn bubbles(&self) -> bool { + event_bubbles(&self.name) + } +} + #[derive(Deserialize, Serialize, Debug, Clone)] #[serde(untagged)] pub enum EventData { diff --git a/packages/interpreter/src/interpreter.js b/packages/interpreter/src/interpreter.js index 8e1496eb6..7e5395809 100644 --- a/packages/interpreter/src/interpreter.js +++ b/packages/interpreter/src/interpreter.js @@ -1,11 +1,3 @@ -export function main() { - let root = window.document.getElementById("main"); - if (root != null) { - window.interpreter = new Interpreter(root); - window.ipc.postMessage(serializeIpcMessage("initialize")); - } -} - class ListenerMap { constructor(root) { // bubbling events can listen at the root element @@ -60,7 +52,7 @@ class ListenerMap { } } -export class Interpreter { +class Interpreter { constructor(root) { this.root = root; this.listeners = new ListenerMap(root); @@ -448,7 +440,7 @@ export class Interpreter { } } -export function serialize_event(event) { +function serialize_event(event) { switch (event.type) { case "copy": case "cut": diff --git a/packages/liveview/Cargo.toml b/packages/liveview/Cargo.toml index d01660373..97f616dd8 100644 --- a/packages/liveview/Cargo.toml +++ b/packages/liveview/Cargo.toml @@ -10,7 +10,6 @@ description = "Build server-side apps with Dioxus" license = "MIT/Apache-2.0" - # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html [dependencies] @@ -28,7 +27,7 @@ tokio-util = { version = "0.7.0", features = ["full"] } dioxus-html = { path = "../html", features = ["serialize"], version = "^0.2.1" } dioxus-core = { path = "../core", features = ["serialize"], version = "^0.2.1" } - +dioxus-interpreter-js = { path = "../interpreter" } # warp warp = { version = "0.3", optional = true } diff --git a/packages/liveview/examples/warp.rs b/packages/liveview/examples/warp.rs index d19914446..5c72d2010 100644 --- a/packages/liveview/examples/warp.rs +++ b/packages/liveview/examples/warp.rs @@ -29,20 +29,24 @@ async fn main() { r#" - Dioxus LiveView with Warp -
{glue} + Dioxus LiveView with Warp +
+ {glue} "#, - glue = dioxus_liveview::interpreter_glue(&format!("ws://{addr}/ws/app")) + glue = dioxus_liveview::interpreter_glue(&format!("ws://{addr}/ws/")) )) }); - let view = LiveView::new(addr); + let view = LiveView::new(); let ws = warp::path("ws") .and(warp::ws()) .and(warp::any().map(move || view.clone())) - .map(move |ws: Ws, view: LiveView| ws.on_upgrade(|ws| view.upgrade_warp(ws, app))); + .map(move |ws: Ws, view: LiveView| { + println!("Got a connection!"); + ws.on_upgrade(|ws| view.upgrade_warp(ws, app)) + }); println!("Listening on http://{}", addr); diff --git a/packages/liveview/src/adapters/warp_adapter.rs b/packages/liveview/src/adapters/warp_adapter.rs index 39a167359..2b9870959 100644 --- a/packages/liveview/src/adapters/warp_adapter.rs +++ b/packages/liveview/src/adapters/warp_adapter.rs @@ -1,19 +1,14 @@ -use std::{convert::Infallible, time::Duration}; - -use crate::{ - events::{self, IpcMessage}, - LiveView, LiveViewError, -}; +use crate::{LiveView, LiveViewError}; use dioxus_core::prelude::*; -use dioxus_html::a; -use futures_util::{pin_mut, SinkExt, StreamExt}; -use tokio::sync::mpsc; -use tokio_stream::wrappers::UnboundedReceiverStream; -use tokio_util::task::LocalPoolHandle; +use dioxus_html::HtmlEvent; +use futures_util::{SinkExt, StreamExt}; +use std::time::Duration; use warp::ws::{Message, WebSocket}; impl LiveView { - pub async fn upgrade_warp(self, ws: WebSocket, app: fn(Scope<()>) -> Element) {} + pub async fn upgrade_warp(self, ws: WebSocket, app: fn(Scope<()>) -> Element) { + self.upgrade_warp_with_props(ws, app, ()).await + } pub async fn upgrade_warp_with_props( self, @@ -48,18 +43,24 @@ where match evt { Some(Ok(evt)) => { if let Ok(evt) = evt.to_str() { - let IpcMessage { name, element, bubbles, data } = serde_json::from_str(evt).unwrap(); + // desktop uses this wrapper struct thing + #[derive(serde::Deserialize)] + struct IpcMessage { + params: HtmlEvent + } - vdom.handle_event(&name, data, element, bubbles); + let event: IpcMessage = serde_json::from_str(evt).unwrap(); + let event = event.params; + let bubbles = event.bubbles(); + vdom.handle_event(&event.name, event.data.into_any(), event.element, bubbles); } } - Some(Err(e)) => { + Some(Err(_e)) => { // log this I guess? // when would we get an error here? } - None => break, + None => return Ok(()), } - } } @@ -68,8 +69,6 @@ where .await; ws.send(Message::text(serde_json::to_string(&edits).unwrap())) - .await - .unwrap(); + .await?; } - Ok(()) as Result<(), LiveViewError> } diff --git a/packages/liveview/src/events.rs b/packages/liveview/src/events.rs deleted file mode 100644 index a8bf4d6ca..000000000 --- a/packages/liveview/src/events.rs +++ /dev/null @@ -1,202 +0,0 @@ -#![allow(dead_code)] - -//! Convert a serialized event to an event trigger - -use std::any::Any; -use std::sync::Arc; - -use dioxus_core::ElementId; -// use dioxus_html::event_bubbles; -use dioxus_html::events::*; - -#[derive(serde::Serialize, serde::Deserialize)] -pub(crate) struct IpcMessage { - pub name: String, - pub element: ElementId, - pub bubbles: bool, - pub data: serde_json::Value, -} - -#[derive(serde::Serialize, serde::Deserialize)] -struct ImEvent { - event: String, - mounted_dom_id: ElementId, - contents: serde_json::Value, -} - -pub fn trigger_from_serialized(_val: serde_json::Value) { - todo!() - // let ImEvent { - // event, - // mounted_dom_id, - // contents, - // } = serde_json::from_value(val).unwrap(); - - // let mounted_dom_id = Some(mounted_dom_id); - - // let name = event_name_from_type(&event); - // let event = make_synthetic_event(&event, contents); - - // UserEvent { - // name, - // scope_id: None, - // element: mounted_dom_id, - // data: event, - // bubbles: event_bubbles(name), - // } -} - -fn make_synthetic_event(name: &str, val: serde_json::Value) -> Arc { - match name { - "copy" | "cut" | "paste" => { - // - Arc::new(ClipboardData {}) - } - "compositionend" | "compositionstart" | "compositionupdate" => { - Arc::new(serde_json::from_value::(val).unwrap()) - } - "keydown" | "keypress" | "keyup" => { - let evt = serde_json::from_value::(val).unwrap(); - Arc::new(evt) - } - "focus" | "blur" | "focusout" | "focusin" => { - // - Arc::new(FocusData {}) - } - - // todo: these handlers might get really slow if the input box gets large and allocation pressure is heavy - // don't have a good solution with the serialized event problem - "change" | "input" | "invalid" | "reset" | "submit" => { - Arc::new(serde_json::from_value::(val).unwrap()) - } - - "click" | "contextmenu" | "doubleclick" | "drag" | "dragend" | "dragenter" | "dragexit" - | "dragleave" | "dragover" | "dragstart" | "drop" | "mousedown" | "mouseenter" - | "mouseleave" | "mousemove" | "mouseout" | "mouseover" | "mouseup" => { - Arc::new(serde_json::from_value::(val).unwrap()) - } - "pointerdown" | "pointermove" | "pointerup" | "pointercancel" | "gotpointercapture" - | "lostpointercapture" | "pointerenter" | "pointerleave" | "pointerover" | "pointerout" => { - Arc::new(serde_json::from_value::(val).unwrap()) - } - "select" => { - // - Arc::new(serde_json::from_value::(val).unwrap()) - } - - "touchcancel" | "touchend" | "touchmove" | "touchstart" => { - Arc::new(serde_json::from_value::(val).unwrap()) - } - - "scroll" => Arc::new(()), - - "wheel" => Arc::new(serde_json::from_value::(val).unwrap()), - - "animationstart" | "animationend" | "animationiteration" => { - Arc::new(serde_json::from_value::(val).unwrap()) - } - - "transitionend" => Arc::new(serde_json::from_value::(val).unwrap()), - - "abort" | "canplay" | "canplaythrough" | "durationchange" | "emptied" | "encrypted" - | "ended" | "error" | "loadeddata" | "loadedmetadata" | "loadstart" | "pause" | "play" - | "playing" | "progress" | "ratechange" | "seeked" | "seeking" | "stalled" | "suspend" - | "timeupdate" | "volumechange" | "waiting" => { - // - Arc::new(MediaData {}) - } - - "toggle" => Arc::new(ToggleData {}), - - _ => Arc::new(()), - } -} - -fn event_name_from_type(typ: &str) -> &'static str { - match typ { - "copy" => "copy", - "cut" => "cut", - "paste" => "paste", - "compositionend" => "compositionend", - "compositionstart" => "compositionstart", - "compositionupdate" => "compositionupdate", - "keydown" => "keydown", - "keypress" => "keypress", - "keyup" => "keyup", - "focus" => "focus", - "focusout" => "focusout", - "focusin" => "focusin", - "blur" => "blur", - "change" => "change", - "input" => "input", - "invalid" => "invalid", - "reset" => "reset", - "submit" => "submit", - "click" => "click", - "contextmenu" => "contextmenu", - "doubleclick" => "doubleclick", - "drag" => "drag", - "dragend" => "dragend", - "dragenter" => "dragenter", - "dragexit" => "dragexit", - "dragleave" => "dragleave", - "dragover" => "dragover", - "dragstart" => "dragstart", - "drop" => "drop", - "mousedown" => "mousedown", - "mouseenter" => "mouseenter", - "mouseleave" => "mouseleave", - "mousemove" => "mousemove", - "mouseout" => "mouseout", - "mouseover" => "mouseover", - "mouseup" => "mouseup", - "pointerdown" => "pointerdown", - "pointermove" => "pointermove", - "pointerup" => "pointerup", - "pointercancel" => "pointercancel", - "gotpointercapture" => "gotpointercapture", - "lostpointercapture" => "lostpointercapture", - "pointerenter" => "pointerenter", - "pointerleave" => "pointerleave", - "pointerover" => "pointerover", - "pointerout" => "pointerout", - "select" => "select", - "touchcancel" => "touchcancel", - "touchend" => "touchend", - "touchmove" => "touchmove", - "touchstart" => "touchstart", - "scroll" => "scroll", - "wheel" => "wheel", - "animationstart" => "animationstart", - "animationend" => "animationend", - "animationiteration" => "animationiteration", - "transitionend" => "transitionend", - "abort" => "abort", - "canplay" => "canplay", - "canplaythrough" => "canplaythrough", - "durationchange" => "durationchange", - "emptied" => "emptied", - "encrypted" => "encrypted", - "ended" => "ended", - "error" => "error", - "loadeddata" => "loadeddata", - "loadedmetadata" => "loadedmetadata", - "loadstart" => "loadstart", - "pause" => "pause", - "play" => "play", - "playing" => "playing", - "progress" => "progress", - "ratechange" => "ratechange", - "seeked" => "seeked", - "seeking" => "seeking", - "stalled" => "stalled", - "suspend" => "suspend", - "timeupdate" => "timeupdate", - "volumechange" => "volumechange", - "waiting" => "waiting", - "toggle" => "toggle", - _ => { - panic!("unsupported event type") - } - } -} diff --git a/packages/liveview/src/index.html b/packages/liveview/src/index.html deleted file mode 100644 index 292a1ae6a..000000000 --- a/packages/liveview/src/index.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - Dioxus app - - - -
- - - diff --git a/packages/liveview/src/interpreter.js b/packages/liveview/src/interpreter.js deleted file mode 100644 index ee82a61e1..000000000 --- a/packages/liveview/src/interpreter.js +++ /dev/null @@ -1,972 +0,0 @@ -function main() { - let root = window.document.getElementById("main"); - - if (root != null) { - // create a new ipc - window.ipc = new IPC(root); - window.ipc.send(serializeIpcMessage("initialize")); - } -} - -class IPC { - constructor(root) { - // connect to the websocket - window.interpreter = new Interpreter(root); - - this.ws = new WebSocket(WS_ADDR); - - this.ws.onopen = () => { - console.log("Connected to the websocket"); - }; - - this.ws.onerror = (err) => { - console.error("Error: ", err); - }; - - this.ws.onmessage = (event) => { - let edits = JSON.parse(event.data); - window.interpreter.handleEdits(edits); - }; - } - - send(msg) { - this.ws.send(msg); - } -} - -class ListenerMap { - constructor(root) { - // bubbling events can listen at the root element - this.global = {}; - // non bubbling events listen at the element the listener was created at - this.local = {}; - this.root = root; - } - - create(event_name, element, handler, bubbles) { - if (bubbles) { - if (this.global[event_name] === undefined) { - this.global[event_name] = {}; - this.global[event_name].active = 1; - this.global[event_name].callback = handler; - this.root.addEventListener(event_name, handler); - } else { - this.global[event_name].active++; - } - } - else { - const id = element.getAttribute("data-dioxus-id"); - if (!this.local[id]) { - this.local[id] = {}; - } - this.local[id][event_name] = handler; - element.addEventListener(event_name, handler); - } - } - - remove(element, event_name, bubbles) { - if (bubbles) { - this.global[event_name].active--; - if (this.global[event_name].active === 0) { - this.root.removeEventListener(event_name, this.global[event_name].callback); - delete this.global[event_name]; - } - } - else { - const id = element.getAttribute("data-dioxus-id"); - delete this.local[id][event_name]; - if (this.local[id].length === 0) { - delete this.local[id]; - } - element.removeEventListener(event_name, handler); - } - } -} - -class Interpreter { - constructor(root) { - this.root = root; - this.lastNode = root; - this.listeners = new ListenerMap(root); - this.handlers = {}; - this.nodes = [root]; - this.parents = []; - } - checkAppendParent() { - if (this.parents.length > 0) { - const lastParent = this.parents[this.parents.length - 1]; - lastParent[1]--; - if (lastParent[1] === 0) { - this.parents.pop(); - } - lastParent[0].appendChild(this.lastNode); - } - } - AppendChildren(root, children) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - for (let i = 0; i < children.length; i++) { - node.appendChild(this.nodes[children[i]]); - } - } - ReplaceWith(root, nodes) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - let els = []; - for (let i = 0; i < nodes.length; i++) { - els.push(this.nodes[nodes[i]]) - } - node.replaceWith(...els); - } - InsertAfter(root, nodes) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - let els = []; - for (let i = 0; i < nodes.length; i++) { - els.push(this.nodes[nodes[i]]) - } - node.after(...els); - } - InsertBefore(root, nodes) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - let els = []; - for (let i = 0; i < nodes.length; i++) { - els.push(this.nodes[nodes[i]]) - } - node.before(...els); - } - Remove(root) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - if (node !== undefined) { - node.remove(); - } - } - CreateTextNode(text, root) { - this.lastNode = document.createTextNode(text); - this.checkAppendParent(); - if (root != null) { - this.nodes[root] = this.lastNode; - } - } - CreateElement(tag, root, children) { - this.lastNode = document.createElement(tag); - this.checkAppendParent(); - if (root != null) { - this.nodes[root] = this.lastNode; - } - if (children > 0) { - this.parents.push([this.lastNode, children]); - } - } - CreateElementNs(tag, root, ns, children) { - this.lastNode = document.createElementNS(ns, tag); - this.checkAppendParent(); - if (root != null) { - this.nodes[root] = this.lastNode; - } - if (children > 0) { - this.parents.push([this.lastNode, children]); - } - } - CreatePlaceholder(root) { - this.lastNode = document.createElement("pre"); - this.lastNode.hidden = true; - this.checkAppendParent(); - if (root != null) { - this.nodes[root] = this.lastNode; - } - } - NewEventListener(event_name, root, handler, bubbles) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - node.setAttribute("data-dioxus-id", `${root}`); - this.listeners.create(event_name, node, handler, bubbles); - } - RemoveEventListener(root, event_name, bubbles) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - node.removeAttribute(`data-dioxus-id`); - this.listeners.remove(node, event_name, bubbles); - } - SetText(root, text) { - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - node.data = text; - } - SetAttribute(root, field, value, ns) { - const name = field; - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - if (ns === "style") { - // @ts-ignore - node.style[name] = value; - } else if (ns != null || ns != undefined) { - node.setAttributeNS(ns, name, value); - } else { - switch (name) { - case "value": - if (value !== node.value) { - node.value = value; - } - break; - case "checked": - node.checked = value === "true"; - break; - case "selected": - node.selected = value === "true"; - 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 (value === "false" && bool_attrs.hasOwnProperty(name)) { - node.removeAttribute(name); - } else { - node.setAttribute(name, value); - } - } - } - } - RemoveAttribute(root, field, ns) { - const name = field; - let node; - if (root == null) { - node = this.lastNode; - } else { - node = this.nodes[root]; - } - if (ns == "style") { - node.style.removeProperty(name); - } else if (ns !== null || ns !== undefined) { - node.removeAttributeNS(ns, name); - } else if (name === "value") { - node.value = ""; - } else if (name === "checked") { - node.checked = false; - } else if (name === "selected") { - node.selected = false; - } else if (name === "dangerous_inner_html") { - node.innerHTML = ""; - } else { - node.removeAttribute(name); - } - } - CloneNode(old, new_id) { - let node; - if (old === null) { - node = this.lastNode; - } else { - node = this.nodes[old]; - } - this.nodes[new_id] = node.cloneNode(true); - } - CloneNodeChildren(old, new_ids) { - let node; - if (old === null) { - node = this.lastNode; - } else { - node = this.nodes[old]; - } - const old_node = node.cloneNode(true); - let i = 0; - for (let node = old_node.firstChild; i < new_ids.length; node = node.nextSibling) { - this.nodes[new_ids[i++]] = node; - } - } - FirstChild() { - this.lastNode = this.lastNode.firstChild; - } - NextSibling() { - this.lastNode = this.lastNode.nextSibling; - } - ParentNode() { - this.lastNode = this.lastNode.parentNode; - } - StoreWithId(id) { - this.nodes[id] = this.lastNode; - } - SetLastNode(root) { - this.lastNode = this.nodes[root]; - } - handleEdits(edits) { - for (let edit of edits) { - this.handleEdit(edit); - } - } - handleEdit(edit) { - switch (edit.type) { - case "PushRoot": - this.PushRoot(edit.root); - break; - case "AppendChildren": - this.AppendChildren(edit.root, edit.children); - break; - case "ReplaceWith": - this.ReplaceWith(edit.root, edit.nodes); - break; - case "InsertAfter": - this.InsertAfter(edit.root, edit.nodes); - break; - case "InsertBefore": - this.InsertBefore(edit.root, edit.nodes); - break; - case "Remove": - this.Remove(edit.root); - break; - case "CreateTextNode": - this.CreateTextNode(edit.text, edit.root); - break; - case "CreateElement": - this.CreateElement(edit.tag, edit.root, edit.children); - break; - case "CreateElementNs": - this.CreateElementNs(edit.tag, edit.root, edit.ns, edit.children); - break; - case "CreatePlaceholder": - this.CreatePlaceholder(edit.root); - break; - case "RemoveEventListener": - this.RemoveEventListener(edit.root, edit.event_name); - break; - case "NewEventListener": - // this handler is only provided on desktop implementations since this - // method is not used by the web implementation - let handler = (event) => { - let target = event.target; - if (target != null) { - let realId = target.getAttribute(`data-dioxus-id`); - let shouldPreventDefault = target.getAttribute( - `dioxus-prevent-default` - ); - - if (event.type === "click") { - // todo call prevent default if it's the right type of event - if (shouldPreventDefault !== `onclick`) { - if (target.tagName === "A") { - event.preventDefault(); - const href = target.getAttribute("href"); - if (href !== "" && href !== null && href !== undefined) { - window.ipc.postMessage( - serializeIpcMessage("browser_open", { href }) - ); - } - } - } - - // also prevent buttons from submitting - if (target.tagName === "BUTTON" && event.type == "submit") { - event.preventDefault(); - } - } - // walk the tree to find the real element - while (realId == null) { - // we've reached the root we don't want to send an event - if (target.parentElement === null) { - return; - } - - target = target.parentElement; - realId = target.getAttribute(`data-dioxus-id`); - } - - shouldPreventDefault = target.getAttribute( - `dioxus-prevent-default` - ); - - let contents = serialize_event(event); - - if (shouldPreventDefault === `on${event.type}`) { - event.preventDefault(); - } - - if (event.type === "submit") { - event.preventDefault(); - } - - if ( - target.tagName === "FORM" && - (event.type === "submit" || event.type === "input") - ) { - for (let x = 0; x < target.elements.length; x++) { - let element = target.elements[x]; - let name = element.getAttribute("name"); - if (name != null) { - if (element.getAttribute("type") === "checkbox") { - // @ts-ignore - contents.values[name] = element.checked ? "true" : "false"; - } else if (element.getAttribute("type") === "radio") { - if (element.checked) { - contents.values[name] = element.value; - } - } else { - // @ts-ignore - contents.values[name] = - element.value ?? element.textContent; - } - } - } - } - - if (realId === null) { - return; - } - realId = parseInt(realId); - window.ipc.send( - serializeIpcMessage("user_event", { - event: edit.event_name, - mounted_dom_id: realId, - contents: contents, - }) - ); - } - }; - this.NewEventListener(edit.event_name, edit.root, handler, event_bubbles(edit.event_name)); - - break; - case "SetText": - this.SetText(edit.root, edit.text); - break; - case "SetAttribute": - this.SetAttribute(edit.root, edit.field, edit.value, edit.ns); - break; - case "RemoveAttribute": - this.RemoveAttribute(edit.root, edit.name, edit.ns); - break; - case "CloneNode": - this.CloneNode(edit.id, edit.new_id); - break; - case "CloneNodeChildren": - this.CloneNodeChildren(edit.id, edit.new_ids); - break; - case "FirstChild": - this.FirstChild(); - break; - case "NextSibling": - this.NextSibling(); - break; - case "ParentNode": - this.ParentNode(); - break; - case "StoreWithId": - this.StoreWithId(BigInt(edit.id)); - break; - case "SetLastNode": - this.SetLastNode(BigInt(edit.id)); - break; - } - } -} - -function serialize_event(event) { - switch (event.type) { - case "copy": - case "cut": - case "past": { - return {}; - } - case "compositionend": - case "compositionstart": - case "compositionupdate": { - let { data } = event; - return { - data, - }; - } - case "keydown": - case "keypress": - case "keyup": { - let { - charCode, - key, - altKey, - ctrlKey, - metaKey, - keyCode, - shiftKey, - location, - repeat, - which, - code, - } = event; - return { - char_code: charCode, - key: key, - alt_key: altKey, - ctrl_key: ctrlKey, - meta_key: metaKey, - key_code: keyCode, - shift_key: shiftKey, - location: location, - repeat: repeat, - which: which, - code, - }; - } - case "focus": - case "blur": { - return {}; - } - case "change": { - let target = event.target; - let value; - if (target.type === "checkbox" || target.type === "radio") { - value = target.checked ? "true" : "false"; - } else { - value = target.value ?? target.textContent; - } - return { - value: value, - values: {}, - }; - } - case "input": - case "invalid": - case "reset": - case "submit": { - let target = event.target; - let value = target.value ?? target.textContent; - - if (target.type === "checkbox") { - value = target.checked ? "true" : "false"; - } - - return { - value: value, - values: {}, - }; - } - case "click": - case "contextmenu": - case "doubleclick": - case "dblclick": - case "drag": - case "dragend": - case "dragenter": - case "dragexit": - case "dragleave": - case "dragover": - case "dragstart": - case "drop": - case "mousedown": - case "mouseenter": - case "mouseleave": - case "mousemove": - case "mouseout": - case "mouseover": - case "mouseup": { - const { - altKey, - button, - buttons, - clientX, - clientY, - ctrlKey, - metaKey, - offsetX, - offsetY, - pageX, - pageY, - screenX, - screenY, - shiftKey, - } = event; - return { - alt_key: altKey, - button: button, - buttons: buttons, - client_x: clientX, - client_y: clientY, - ctrl_key: ctrlKey, - meta_key: metaKey, - offset_x: offsetX, - offset_y: offsetY, - page_x: pageX, - page_y: pageY, - screen_x: screenX, - screen_y: screenY, - shift_key: shiftKey, - }; - } - case "pointerdown": - case "pointermove": - case "pointerup": - case "pointercancel": - case "gotpointercapture": - case "lostpointercapture": - case "pointerenter": - case "pointerleave": - case "pointerover": - case "pointerout": { - const { - altKey, - button, - buttons, - clientX, - clientY, - ctrlKey, - metaKey, - pageX, - pageY, - screenX, - screenY, - shiftKey, - pointerId, - width, - height, - pressure, - tangentialPressure, - tiltX, - tiltY, - twist, - pointerType, - isPrimary, - } = event; - return { - alt_key: altKey, - button: button, - buttons: buttons, - client_x: clientX, - client_y: clientY, - ctrl_key: ctrlKey, - meta_key: metaKey, - page_x: pageX, - page_y: pageY, - screen_x: screenX, - screen_y: screenY, - shift_key: shiftKey, - pointer_id: pointerId, - width: width, - height: height, - pressure: pressure, - tangential_pressure: tangentialPressure, - tilt_x: tiltX, - tilt_y: tiltY, - twist: twist, - pointer_type: pointerType, - is_primary: isPrimary, - }; - } - case "select": { - return {}; - } - case "touchcancel": - case "touchend": - case "touchmove": - case "touchstart": { - const { altKey, ctrlKey, metaKey, shiftKey } = event; - return { - // changed_touches: event.changedTouches, - // target_touches: event.targetTouches, - // touches: event.touches, - alt_key: altKey, - ctrl_key: ctrlKey, - meta_key: metaKey, - shift_key: shiftKey, - }; - } - case "scroll": { - return {}; - } - case "wheel": { - const { deltaX, deltaY, deltaZ, deltaMode } = event; - return { - delta_x: deltaX, - delta_y: deltaY, - delta_z: deltaZ, - delta_mode: deltaMode, - }; - } - case "animationstart": - case "animationend": - case "animationiteration": { - const { animationName, elapsedTime, pseudoElement } = event; - return { - animation_name: animationName, - elapsed_time: elapsedTime, - pseudo_element: pseudoElement, - }; - } - case "transitionend": { - const { propertyName, elapsedTime, pseudoElement } = event; - return { - property_name: propertyName, - elapsed_time: elapsedTime, - pseudo_element: pseudoElement, - }; - } - case "abort": - case "canplay": - case "canplaythrough": - case "durationchange": - case "emptied": - case "encrypted": - case "ended": - case "error": - case "loadeddata": - case "loadedmetadata": - case "loadstart": - case "pause": - case "play": - case "playing": - case "progress": - case "ratechange": - case "seeked": - case "seeking": - case "stalled": - case "suspend": - case "timeupdate": - case "volumechange": - case "waiting": { - return {}; - } - case "toggle": { - return {}; - } - default: { - return {}; - } - } -} -function serializeIpcMessage(method, params = {}) { - return JSON.stringify({ method, params }); -} -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, -}; - -function is_element_node(node) { - return node.nodeType == 1; -} - -function event_bubbles(event) { - switch (event) { - case "copy": - return true; - case "cut": - return true; - case "paste": - return true; - case "compositionend": - return true; - case "compositionstart": - return true; - case "compositionupdate": - return true; - case "keydown": - return true; - case "keypress": - return true; - case "keyup": - return true; - case "focus": - return false; - case "focusout": - return true; - case "focusin": - return true; - case "blur": - return false; - case "change": - return true; - case "input": - return true; - case "invalid": - return true; - case "reset": - return true; - case "submit": - return true; - case "click": - return true; - case "contextmenu": - return true; - case "doubleclick": - return true; - case "dblclick": - return true; - case "drag": - return true; - case "dragend": - return true; - case "dragenter": - return false; - case "dragexit": - return false; - case "dragleave": - return true; - case "dragover": - return true; - case "dragstart": - return true; - case "drop": - return true; - case "mousedown": - return true; - case "mouseenter": - return false; - case "mouseleave": - return false; - case "mousemove": - return true; - case "mouseout": - return true; - case "scroll": - return false; - case "mouseover": - return true; - case "mouseup": - return true; - case "pointerdown": - return true; - case "pointermove": - return true; - case "pointerup": - return true; - case "pointercancel": - return true; - case "gotpointercapture": - return true; - case "lostpointercapture": - return true; - case "pointerenter": - return false; - case "pointerleave": - return false; - case "pointerover": - return true; - case "pointerout": - return true; - case "select": - return true; - case "touchcancel": - return true; - case "touchend": - return true; - case "touchmove": - return true; - case "touchstart": - return true; - case "wheel": - return true; - case "abort": - return false; - case "canplay": - return false; - case "canplaythrough": - return false; - case "durationchange": - return false; - case "emptied": - return false; - case "encrypted": - return true; - case "ended": - return false; - case "error": - return false; - case "loadeddata": - return false; - case "loadedmetadata": - return false; - case "loadstart": - return false; - case "pause": - return false; - case "play": - return false; - case "playing": - return false; - case "progress": - return false; - case "ratechange": - return false; - case "seeked": - return false; - case "seeking": - return false; - case "stalled": - return false; - case "suspend": - return false; - case "timeupdate": - return false; - case "volumechange": - return false; - case "waiting": - return false; - case "animationstart": - return true; - case "animationend": - return true; - case "animationiteration": - return true; - case "transitionend": - return true; - case "toggle": - return true; - } -} diff --git a/packages/liveview/src/lib.rs b/packages/liveview/src/lib.rs index 01a84c245..5d111e319 100644 --- a/packages/liveview/src/lib.rs +++ b/packages/liveview/src/lib.rs @@ -1,21 +1,19 @@ -#![allow(dead_code)] - -pub static INTERPRETER: &str = include_str!("interpreter.js"); +use dioxus_interpreter_js::INTERPRETER_JS; +static MAIN_JS: &str = include_str!("./main.js"); pub fn interpreter_glue(url: &str) -> String { format!( r#" "# ) } -pub(crate) mod events; - pub mod adapters { #[cfg(feature = "warp")] pub mod warp_adapter; @@ -27,12 +25,11 @@ pub mod adapters { pub mod salvo_adapter; } -use std::net::SocketAddr; - -use tokio_util::task::LocalPoolHandle; - pub mod pool; pub use pool::*; -#[derive(Debug, Clone, PartialEq, thiserror::Error)] -pub enum LiveViewError {} +#[derive(Debug, thiserror::Error)] +pub enum LiveViewError { + #[error("Connection Failed")] + Warp(#[from] warp::Error), +} diff --git a/packages/liveview/src/main.js b/packages/liveview/src/main.js new file mode 100644 index 000000000..9b0cf5c38 --- /dev/null +++ b/packages/liveview/src/main.js @@ -0,0 +1,35 @@ +function main() { + let root = window.document.getElementById("main"); + + if (root != null) { + // create a new ipc + window.ipc = new IPC(root); + window.ipc.send(serializeIpcMessage("initialize")); + } +} + +class IPC { + constructor(root) { + // connect to the websocket + window.interpreter = new Interpreter(root); + + this.ws = new WebSocket(WS_ADDR); + + this.ws.onopen = () => { + console.log("Connected to the websocket"); + }; + + this.ws.onerror = (err) => { + console.error("Error: ", err); + }; + + this.ws.onmessage = (event) => { + let edits = JSON.parse(event.data); + window.interpreter.handleEdits(edits); + }; + } + + postMessage(msg) { + this.ws.send(msg); + } +} diff --git a/packages/liveview/src/pool.rs b/packages/liveview/src/pool.rs index c743df05c..05d7fe98e 100644 --- a/packages/liveview/src/pool.rs +++ b/packages/liveview/src/pool.rs @@ -1,46 +1,20 @@ -use std::net::SocketAddr; - use tokio_util::task::LocalPoolHandle; #[derive(Clone)] pub struct LiveView { pub(crate) pool: LocalPoolHandle, - pub(crate) addr: String, +} + +impl Default for LiveView { + fn default() -> Self { + Self::new() + } } impl LiveView { - pub fn body(&self, header: &str) -> String { - format!( - r#" - - - - {header} - - -
- - -"#, - addr = self.addr, - interpreter = include_str!("../src/interpreter.js") - ) - } - - pub fn interpreter_code(&self) -> String { - include_str!("../src/interpreter.js").to_string() - } - - pub fn new(addr: impl Into) -> Self { - let addr: SocketAddr = addr.into(); - + pub fn new() -> Self { LiveView { pool: LocalPoolHandle::new(16), - addr: addr.to_string(), } } } diff --git a/packages/web/dist/assets/dioxus/dioxus.js b/packages/web/dist/assets/dioxus/dioxus.js new file mode 100644 index 000000000..b8f5250ca --- /dev/null +++ b/packages/web/dist/assets/dioxus/dioxus.js @@ -0,0 +1,1143 @@ +import { create, update_memory, save_template, initilize } from './snippets/dioxus-interpreter-js-459fb15b86d869f7/inline0.js'; +import * as __wbg_star0 from './snippets/dioxus-interpreter-js-459fb15b86d869f7/inline0.js'; + +let wasm; + +const heap = new Array(32).fill(undefined); + +heap.push(undefined, null, true, false); + +function getObject(idx) { return heap[idx]; } + +let heap_next = heap.length; + +function dropObject(idx) { + if (idx < 36) return; + heap[idx] = heap_next; + heap_next = idx; +} + +function takeObject(idx) { + const ret = getObject(idx); + dropObject(idx); + return ret; +} + +function _assertBoolean(n) { + if (typeof(n) !== 'boolean') { + throw new Error('expected a boolean argument'); + } +} + +const cachedTextDecoder = new TextDecoder('utf-8', { ignoreBOM: true, fatal: true }); + +cachedTextDecoder.decode(); + +let cachedUint8Memory0 = new Uint8Array(); + +function getUint8Memory0() { + if (cachedUint8Memory0.byteLength === 0) { + cachedUint8Memory0 = new Uint8Array(wasm.memory.buffer); + } + return cachedUint8Memory0; +} + +function getStringFromWasm0(ptr, len) { + return cachedTextDecoder.decode(getUint8Memory0().subarray(ptr, ptr + len)); +} + +function addHeapObject(obj) { + if (heap_next === heap.length) heap.push(heap.length + 1); + const idx = heap_next; + heap_next = heap[idx]; + + if (typeof(heap_next) !== 'number') throw new Error('corrupt heap'); + + heap[idx] = obj; + return idx; +} + +let WASM_VECTOR_LEN = 0; + +const cachedTextEncoder = new TextEncoder('utf-8'); + +const encodeString = (typeof cachedTextEncoder.encodeInto === 'function' + ? function (arg, view) { + return cachedTextEncoder.encodeInto(arg, view); +} + : function (arg, view) { + const buf = cachedTextEncoder.encode(arg); + view.set(buf); + return { + read: arg.length, + written: buf.length + }; +}); + +function passStringToWasm0(arg, malloc, realloc) { + + if (typeof(arg) !== 'string') throw new Error('expected a string argument'); + + if (realloc === undefined) { + const buf = cachedTextEncoder.encode(arg); + const ptr = malloc(buf.length); + getUint8Memory0().subarray(ptr, ptr + buf.length).set(buf); + WASM_VECTOR_LEN = buf.length; + return ptr; + } + + let len = arg.length; + let ptr = malloc(len); + + const mem = getUint8Memory0(); + + let offset = 0; + + for (; offset < len; offset++) { + const code = arg.charCodeAt(offset); + if (code > 0x7F) break; + mem[ptr + offset] = code; + } + + if (offset !== len) { + if (offset !== 0) { + arg = arg.slice(offset); + } + ptr = realloc(ptr, len, len = offset + arg.length * 3); + const view = getUint8Memory0().subarray(ptr + offset, ptr + len); + const ret = encodeString(arg, view); + if (ret.read !== arg.length) throw new Error('failed to pass whole string'); + offset += ret.written; + } + + WASM_VECTOR_LEN = offset; + return ptr; +} + +function isLikeNone(x) { + return x === undefined || x === null; +} + +let cachedInt32Memory0 = new Int32Array(); + +function getInt32Memory0() { + if (cachedInt32Memory0.byteLength === 0) { + cachedInt32Memory0 = new Int32Array(wasm.memory.buffer); + } + return cachedInt32Memory0; +} + +function debugString(val) { + // primitive types + const type = typeof val; + if (type == 'number' || type == 'boolean' || val == null) { + return `${val}`; + } + if (type == 'string') { + return `"${val}"`; + } + if (type == 'symbol') { + const description = val.description; + if (description == null) { + return 'Symbol'; + } else { + return `Symbol(${description})`; + } + } + if (type == 'function') { + const name = val.name; + if (typeof name == 'string' && name.length > 0) { + return `Function(${name})`; + } else { + return 'Function'; + } + } + // objects + if (Array.isArray(val)) { + const length = val.length; + let debug = '['; + if (length > 0) { + debug += debugString(val[0]); + } + for(let i = 1; i < length; i++) { + debug += ', ' + debugString(val[i]); + } + debug += ']'; + return debug; + } + // Test for built-in + const builtInMatches = /\[object ([^\]]+)\]/.exec(toString.call(val)); + let className; + if (builtInMatches.length > 1) { + className = builtInMatches[1]; + } else { + // Failed to match the standard '[object ClassName]' + return toString.call(val); + } + if (className == 'Object') { + // we're a user defined class or Object + // JSON.stringify avoids problems with cycles, and is generally much + // easier than looping through ownProperties of `val`. + try { + return 'Object(' + JSON.stringify(val) + ')'; + } catch (_) { + return 'Object'; + } + } + // errors + if (val instanceof Error) { + return `${val.name}: ${val.message}\n${val.stack}`; + } + // TODO we could test for more things here, like `Set`s and `Map`s. + return className; +} + +function makeMutClosure(arg0, arg1, dtor, f) { + const state = { a: arg0, b: arg1, cnt: 1, dtor }; + const real = (...args) => { + // First up with a closure we increment the internal reference + // count. This ensures that the Rust closure environment won't + // be deallocated while we're invoking it. + state.cnt++; + const a = state.a; + state.a = 0; + try { + return f(a, state.b, ...args); + } finally { + if (--state.cnt === 0) { + wasm.__wbindgen_export_2.get(state.dtor)(a, state.b); + + } else { + state.a = a; + } + } + }; + real.original = state; + + return real; +} + +function logError(f, args) { + try { + return f.apply(this, args); + } catch (e) { + let error = (function () { + try { + return e instanceof Error ? `${e.message}\n\nStack:\n${e.stack}` : e.toString(); + } catch(_) { + return ""; + } + }()); + console.error("wasm-bindgen: imported JS function that was not marked as `catch` threw an error:", error); + throw e; + } +} + +function _assertNum(n) { + if (typeof(n) !== 'number') throw new Error('expected a number argument'); +} +function __wbg_adapter_22(arg0, arg1, arg2) { + _assertNum(arg0); + _assertNum(arg1); + wasm._dyn_core__ops__function__FnMut__A____Output___R_as_wasm_bindgen__closure__WasmClosure___describe__invoke__hc67c0adeead8d38c(arg0, arg1, addHeapObject(arg2)); +} + +let stack_pointer = 32; + +function addBorrowedObject(obj) { + if (stack_pointer == 1) throw new Error('out of js stack'); + heap[--stack_pointer] = obj; + return stack_pointer; +} +function __wbg_adapter_25(arg0, arg1, arg2) { + try { + _assertNum(arg0); + _assertNum(arg1); + wasm._dyn_core__ops__function__FnMut___A____Output___R_as_wasm_bindgen__closure__WasmClosure___describe__invoke__hf3d7123c3170f8e5(arg0, arg1, addBorrowedObject(arg2)); + } finally { + heap[stack_pointer++] = undefined; + } +} + +function makeClosure(arg0, arg1, dtor, f) { + const state = { a: arg0, b: arg1, cnt: 1, dtor }; + const real = (...args) => { + // First up with a closure we increment the internal reference + // count. This ensures that the Rust closure environment won't + // be deallocated while we're invoking it. + state.cnt++; + try { + return f(state.a, state.b, ...args); + } finally { + if (--state.cnt === 0) { + wasm.__wbindgen_export_2.get(state.dtor)(state.a, state.b); + state.a = 0; + + } + } + }; + real.original = state; + + return real; +} +function __wbg_adapter_28(arg0, arg1, arg2) { + _assertNum(arg0); + _assertNum(arg1); + wasm._dyn_core__ops__function__Fn__A____Output___R_as_wasm_bindgen__closure__WasmClosure___describe__invoke__heed889d80ba6fff2(arg0, arg1, addHeapObject(arg2)); +} + +function __wbg_adapter_31(arg0, arg1, arg2) { + _assertNum(arg0); + _assertNum(arg1); + wasm._dyn_core__ops__function__FnMut__A____Output___R_as_wasm_bindgen__closure__WasmClosure___describe__invoke__h6c21192190c3cf37(arg0, arg1, addHeapObject(arg2)); +} + +function __wbg_adapter_34(arg0, arg1, arg2) { + try { + _assertNum(arg0); + _assertNum(arg1); + wasm._dyn_core__ops__function__FnMut___A____Output___R_as_wasm_bindgen__closure__WasmClosure___describe__invoke__hd0907e42a697a011(arg0, arg1, addBorrowedObject(arg2)); + } finally { + heap[stack_pointer++] = undefined; + } +} + +function getCachedStringFromWasm0(ptr, len) { + if (ptr === 0) { + return getObject(len); + } else { + return getStringFromWasm0(ptr, len); + } +} + +let cachedUint32Memory0 = new Uint32Array(); + +function getUint32Memory0() { + if (cachedUint32Memory0.byteLength === 0) { + cachedUint32Memory0 = new Uint32Array(wasm.memory.buffer); + } + return cachedUint32Memory0; +} + +function getArrayJsValueFromWasm0(ptr, len) { + const mem = getUint32Memory0(); + const slice = mem.subarray(ptr / 4, ptr / 4 + len); + const result = []; + for (let i = 0; i < slice.length; i++) { + result.push(takeObject(slice[i])); + } + return result; +} + +function handleError(f, args) { + try { + return f.apply(this, args); + } catch (e) { + wasm.__wbindgen_exn_store(addHeapObject(e)); + } +} + +async function load(module, imports) { + if (typeof Response === 'function' && module instanceof Response) { + if (typeof WebAssembly.instantiateStreaming === 'function') { + try { + return await WebAssembly.instantiateStreaming(module, imports); + + } catch (e) { + if (module.headers.get('Content-Type') != 'application/wasm') { + console.warn("`WebAssembly.instantiateStreaming` failed because your server does not serve wasm with `application/wasm` MIME type. Falling back to `WebAssembly.instantiate` which is slower. Original error:\n", e); + + } else { + throw e; + } + } + } + + const bytes = await module.arrayBuffer(); + return await WebAssembly.instantiate(bytes, imports); + + } else { + const instance = await WebAssembly.instantiate(module, imports); + + if (instance instanceof WebAssembly.Instance) { + return { instance, module }; + + } else { + return instance; + } + } +} + +function getImports() { + const imports = {}; + imports.wbg = {}; + imports.wbg.__wbindgen_cb_drop = function(arg0) { + const obj = takeObject(arg0).original; + if (obj.cnt-- == 1) { + obj.a = 0; + return true; + } + const ret = false; + _assertBoolean(ret); + return ret; + }; + imports.wbg.__wbindgen_string_new = function(arg0, arg1) { + const ret = getStringFromWasm0(arg0, arg1); + return addHeapObject(ret); + }; + imports.wbg.__wbindgen_object_clone_ref = function(arg0) { + const ret = getObject(arg0); + return addHeapObject(ret); + }; + imports.wbg.__wbg_error_f851667af71bcfc6 = function() { return logError(function (arg0, arg1) { + var v0 = getCachedStringFromWasm0(arg0, arg1); + if (arg0 !== 0) { wasm.__wbindgen_free(arg0, arg1); } + console.error(v0); +}, arguments) }; +imports.wbg.__wbg_new_abda76e883ba8a5f = function() { return logError(function () { + const ret = new Error(); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_stack_658279fe44541cf6 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).stack; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_create_b45dd9c634b63ea1 = function() { return logError(function (arg0) { + create(arg0 >>> 0); +}, arguments) }; +imports.wbg.__wbg_updatememory_767589cd664161f3 = function() { return logError(function (arg0) { + update_memory(takeObject(arg0)); +}, arguments) }; +imports.wbg.__wbg_savetemplate_630037d6d28cd5d8 = function() { return logError(function (arg0, arg1, arg2) { + var v0 = getArrayJsValueFromWasm0(arg0, arg1).slice(); + wasm.__wbindgen_free(arg0, arg1 * 4); + save_template(v0, arg2 >>> 0); +}, arguments) }; +imports.wbg.__wbg_initilize_7a144c290d5ba790 = function() { return logError(function (arg0, arg1) { + initilize(takeObject(arg0), getObject(arg1)); +}, arguments) }; +imports.wbg.__wbg_instanceof_Window_acc97ff9f5d2c7b4 = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof Window; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_document_3ead31dbcad65886 = function() { return logError(function (arg0) { + const ret = getObject(arg0).document; + return isLikeNone(ret) ? 0 : addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_location_8cc8ccf27e342c0a = function() { return logError(function (arg0) { + const ret = getObject(arg0).location; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_history_2a104346a1208269 = function() { return handleError(function (arg0) { + const ret = getObject(arg0).history; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_title_74f9ffa27e9c750f = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).title; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_createElement_976dbb84fe1661b5 = function() { return handleError(function (arg0, arg1, arg2) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + const ret = getObject(arg0).createElement(v0); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_createElementNS_1561aca8ee3693c0 = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + var v1 = getCachedStringFromWasm0(arg3, arg4); + const ret = getObject(arg0).createElementNS(v0, v1); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_createTextNode_300f845fab76642f = function() { return logError(function (arg0, arg1, arg2) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + const ret = getObject(arg0).createTextNode(v0); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_getElementById_3a708b83e4f034d7 = function() { return logError(function (arg0, arg1, arg2) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + const ret = getObject(arg0).getElementById(v0); + return isLikeNone(ret) ? 0 : addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_instanceof_HtmlTextAreaElement_a091a90ac155d1ab = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof HTMLTextAreaElement; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_value_ccb32485ee1b3928 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).value; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_pointerId_18be034781db46f3 = function() { return logError(function (arg0) { + const ret = getObject(arg0).pointerId; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_width_4fed142776de682f = function() { return logError(function (arg0) { + const ret = getObject(arg0).width; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_height_fb6382c90e010142 = function() { return logError(function (arg0) { + const ret = getObject(arg0).height; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_pressure_c3ba152bf8a3491d = function() { return logError(function (arg0) { + const ret = getObject(arg0).pressure; + return ret; +}, arguments) }; +imports.wbg.__wbg_tangentialPressure_f6bd99bd6df8e15c = function() { return logError(function (arg0) { + const ret = getObject(arg0).tangentialPressure; + return ret; +}, arguments) }; +imports.wbg.__wbg_tiltX_fe39b58f39622392 = function() { return logError(function (arg0) { + const ret = getObject(arg0).tiltX; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_tiltY_6e725ba5a979ae65 = function() { return logError(function (arg0) { + const ret = getObject(arg0).tiltY; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_twist_29056239dbb46cce = function() { return logError(function (arg0) { + const ret = getObject(arg0).twist; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_pointerType_bf6b13edfec8614b = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).pointerType; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_isPrimary_8a1c3caca08ecc33 = function() { return logError(function (arg0) { + const ret = getObject(arg0).isPrimary; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_propertyName_6261bc64663a261b = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).propertyName; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_elapsedTime_f71097509836b2f2 = function() { return logError(function (arg0) { + const ret = getObject(arg0).elapsedTime; + return ret; +}, arguments) }; +imports.wbg.__wbg_pseudoElement_5c39e80f916267a2 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).pseudoElement; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_animationName_52b570bbde323225 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).animationName; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_elapsedTime_a5dcd61ea72b5e93 = function() { return logError(function (arg0) { + const ret = getObject(arg0).elapsedTime; + return ret; +}, arguments) }; +imports.wbg.__wbg_pseudoElement_434c37ac9cf98e15 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).pseudoElement; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_instanceof_HtmlFormElement_1c489ff7e99e43d3 = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof HTMLFormElement; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_elements_e459ba1be1bb71da = function() { return logError(function (arg0) { + const ret = getObject(arg0).elements; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_instanceof_HtmlInputElement_970e4026de0fccff = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof HTMLInputElement; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_checked_f0b666100ef39e44 = function() { return logError(function (arg0) { + const ret = getObject(arg0).checked; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_type_6ce8af5475dcc48f = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).type; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_value_b2a620d34c663701 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).value; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_data_7b1f01f4e6a64fbe = function() { return logError(function (arg0) { + const ret = getObject(arg0).data; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_altKey_8643110400698556 = function() { return logError(function (arg0) { + const ret = getObject(arg0).altKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_metaKey_f0f73554e84cdfb6 = function() { return logError(function (arg0) { + const ret = getObject(arg0).metaKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_ctrlKey_f05ebfd7290f66a9 = function() { return logError(function (arg0) { + const ret = getObject(arg0).ctrlKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_shiftKey_dbede4ad30972b26 = function() { return logError(function (arg0) { + const ret = getObject(arg0).shiftKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_type_a86a71d052709b75 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).type; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_target_bf704b7db7ad1387 = function() { return logError(function (arg0) { + const ret = getObject(arg0).target; + return isLikeNone(ret) ? 0 : addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_preventDefault_3209279b490de583 = function() { return logError(function (arg0) { + getObject(arg0).preventDefault(); +}, arguments) }; +imports.wbg.__wbg_addEventListener_1fc744729ac6dc27 = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + getObject(arg0).addEventListener(v0, getObject(arg3), getObject(arg4)); +}, arguments) }; +imports.wbg.__wbg_removeEventListener_b10f1a66647f3aa0 = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + getObject(arg0).removeEventListener(v0, getObject(arg3), arg4 !== 0); +}, arguments) }; +imports.wbg.__wbg_instanceof_HtmlSelectElement_e8421685c2eaa299 = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof HTMLSelectElement; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_value_2527a85fd5ada680 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).value; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_altKey_6dbe46bf3ae42d67 = function() { return logError(function (arg0) { + const ret = getObject(arg0).altKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_ctrlKey_fd79f035994d9387 = function() { return logError(function (arg0) { + const ret = getObject(arg0).ctrlKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_shiftKey_908ae224b8722a41 = function() { return logError(function (arg0) { + const ret = getObject(arg0).shiftKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_metaKey_cdd15bf44efb510e = function() { return logError(function (arg0) { + const ret = getObject(arg0).metaKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_location_af9a9961ca66ef22 = function() { return logError(function (arg0) { + const ret = getObject(arg0).location; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_repeat_edc4d7c555e257a3 = function() { return logError(function (arg0) { + const ret = getObject(arg0).repeat; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_key_ad4fc49423a94efa = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).key; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_code_06787cd3c7a60600 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).code; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_href_bbb11e0e61ea410e = function() { return handleError(function (arg0, arg1) { + const ret = getObject(arg1).href; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_protocol_70cc72a5ff78dc5f = function() { return handleError(function (arg0, arg1) { + const ret = getObject(arg1).protocol; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_host_f82dbbd8bb5ef24a = function() { return handleError(function (arg0, arg1) { + const ret = getObject(arg1).host; + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_instanceof_Node_b1195878cdeab85c = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof Node; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_parentElement_0cffb3ceb0f107bd = function() { return logError(function (arg0) { + const ret = getObject(arg0).parentElement; + return isLikeNone(ret) ? 0 : addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_textContent_77bd294928962f93 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).textContent; + var ptr0 = isLikeNone(ret) ? 0 : passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + var len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_appendChild_e513ef0e5098dfdd = function() { return handleError(function (arg0, arg1) { + const ret = getObject(arg0).appendChild(getObject(arg1)); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_pageX_829fdc137b743208 = function() { return logError(function (arg0) { + const ret = getObject(arg0).pageX; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_pageY_d67aef101099fd37 = function() { return logError(function (arg0) { + const ret = getObject(arg0).pageY; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_instanceof_Element_33bd126d58f2021b = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof Element; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_getAttribute_3a1f0fb396184372 = function() { return logError(function (arg0, arg1, arg2, arg3) { + var v0 = getCachedStringFromWasm0(arg2, arg3); + const ret = getObject(arg1).getAttribute(v0); + var ptr1 = isLikeNone(ret) ? 0 : passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + var len1 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len1; + getInt32Memory0()[arg0 / 4 + 0] = ptr1; +}, arguments) }; +imports.wbg.__wbg_setAttribute_d8436c14a59ab1af = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + var v1 = getCachedStringFromWasm0(arg3, arg4); + getObject(arg0).setAttribute(v0, v1); +}, arguments) }; +imports.wbg.__wbg_setAttributeNS_cfa0d39367e3e143 = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4, arg5, arg6) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + var v1 = getCachedStringFromWasm0(arg3, arg4); + var v2 = getCachedStringFromWasm0(arg5, arg6); + getObject(arg0).setAttributeNS(v0, v1, v2); +}, arguments) }; +imports.wbg.__wbg_toggleAttribute_061cab5591243f29 = function() { return handleError(function (arg0, arg1, arg2) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + const ret = getObject(arg0).toggleAttribute(v0); + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_instanceof_HtmlElement_eff00d16af7bd6e7 = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof HTMLElement; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_style_e9380748cee29f13 = function() { return logError(function (arg0) { + const ret = getObject(arg0).style; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_setProperty_e489dfd8c0a6bffc = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4) { + var v0 = getCachedStringFromWasm0(arg1, arg2); + var v1 = getCachedStringFromWasm0(arg3, arg4); + getObject(arg0).setProperty(v0, v1); +}, arguments) }; +imports.wbg.__wbg_pushState_38917fb88b4add30 = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4, arg5) { + var v0 = getCachedStringFromWasm0(arg2, arg3); + var v1 = getCachedStringFromWasm0(arg4, arg5); + getObject(arg0).pushState(getObject(arg1), v0, v1); +}, arguments) }; +imports.wbg.__wbg_replaceState_b6d5ce07beb296ed = function() { return handleError(function (arg0, arg1, arg2, arg3, arg4, arg5) { + var v0 = getCachedStringFromWasm0(arg2, arg3); + var v1 = getCachedStringFromWasm0(arg4, arg5); + getObject(arg0).replaceState(getObject(arg1), v0, v1); +}, arguments) }; +imports.wbg.__wbg_length_e015bc7ac630e55b = function() { return logError(function (arg0) { + const ret = getObject(arg0).length; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_item_37cbb972da31ad43 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg0).item(arg1 >>> 0); + return isLikeNone(ret) ? 0 : addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_instanceof_IdleDeadline_4a82da4e4c7002fc = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof IdleDeadline; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_timeRemaining_5c5c26712f275485 = function() { return logError(function (arg0) { + const ret = getObject(arg0).timeRemaining(); + return ret; +}, arguments) }; +imports.wbg.__wbg_setonmessage_c5a806b62a0c5607 = function() { return logError(function (arg0, arg1) { + getObject(arg0).onmessage = getObject(arg1); +}, arguments) }; +imports.wbg.__wbg_new_d29e507f6606de91 = function() { return handleError(function (arg0, arg1) { + var v0 = getCachedStringFromWasm0(arg0, arg1); + const ret = new WebSocket(v0); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_deltaX_6b627fd6f4c19e51 = function() { return logError(function (arg0) { + const ret = getObject(arg0).deltaX; + return ret; +}, arguments) }; +imports.wbg.__wbg_deltaY_a5393ec7ac0f7bb4 = function() { return logError(function (arg0) { + const ret = getObject(arg0).deltaY; + return ret; +}, arguments) }; +imports.wbg.__wbg_deltaZ_8d9e7a1ac88162b3 = function() { return logError(function (arg0) { + const ret = getObject(arg0).deltaZ; + return ret; +}, arguments) }; +imports.wbg.__wbg_deltaMode_a90be314f5c676f1 = function() { return logError(function (arg0) { + const ret = getObject(arg0).deltaMode; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_instanceof_CompositionEvent_c099782c181693d1 = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof CompositionEvent; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_data_8bd9c72cda1424e9 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg1).data; + var ptr0 = isLikeNone(ret) ? 0 : passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + var len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}, arguments) }; +imports.wbg.__wbg_screenX_bda1387744fb6677 = function() { return logError(function (arg0) { + const ret = getObject(arg0).screenX; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_screenY_fa513a5b7d68c34f = function() { return logError(function (arg0) { + const ret = getObject(arg0).screenY; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_clientX_e39206f946859108 = function() { return logError(function (arg0) { + const ret = getObject(arg0).clientX; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_clientY_e376bb2d8f470c88 = function() { return logError(function (arg0) { + const ret = getObject(arg0).clientY; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_offsetX_8891849b36542d53 = function() { return logError(function (arg0) { + const ret = getObject(arg0).offsetX; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_offsetY_1f52082687af467b = function() { return logError(function (arg0) { + const ret = getObject(arg0).offsetY; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_ctrlKey_4795fb55a59f026c = function() { return logError(function (arg0) { + const ret = getObject(arg0).ctrlKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_shiftKey_81014521a7612e6a = function() { return logError(function (arg0) { + const ret = getObject(arg0).shiftKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_altKey_2b8d6d80ead4bad7 = function() { return logError(function (arg0) { + const ret = getObject(arg0).altKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_metaKey_49e49046d8402fb7 = function() { return logError(function (arg0) { + const ret = getObject(arg0).metaKey; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_button_2bb5dc0116d6b89b = function() { return logError(function (arg0) { + const ret = getObject(arg0).button; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_buttons_047716c1296e3d1c = function() { return logError(function (arg0) { + const ret = getObject(arg0).buttons; + _assertNum(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_newnoargs_b5b063fc6c2f0376 = function() { return logError(function (arg0, arg1) { + var v0 = getCachedStringFromWasm0(arg0, arg1); + const ret = new Function(v0); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_call_97ae9d8645dc388b = function() { return handleError(function (arg0, arg1) { + const ret = getObject(arg0).call(getObject(arg1)); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_instanceof_Object_595a1007518cbea3 = function() { return logError(function (arg0) { + let result; + try { + result = getObject(arg0) instanceof Object; + } catch { + result = false; + } + const ret = result; + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_hasOwnProperty_43f5b0861e010743 = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg0).hasOwnProperty(getObject(arg1)); + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbg_new_0b9bfdd97583284e = function() { return logError(function () { + const ret = new Object(); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_resolve_99fe17964f31ffc0 = function() { return logError(function (arg0) { + const ret = Promise.resolve(getObject(arg0)); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_then_11f7a54d67b4bfad = function() { return logError(function (arg0, arg1) { + const ret = getObject(arg0).then(getObject(arg1)); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_globalThis_7f206bda628d5286 = function() { return handleError(function () { + const ret = globalThis.globalThis; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_self_6d479506f72c6a71 = function() { return handleError(function () { + const ret = self.self; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_window_f2557cc78490aceb = function() { return handleError(function () { + const ret = window.window; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbg_global_ba75c50d1cf384f4 = function() { return handleError(function () { + const ret = global.global; + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbindgen_is_undefined = function(arg0) { + const ret = getObject(arg0) === undefined; + _assertBoolean(ret); + return ret; +}; +imports.wbg.__wbindgen_string_get = function(arg0, arg1) { + const obj = getObject(arg1); + const ret = typeof(obj) === 'string' ? obj : undefined; + var ptr0 = isLikeNone(ret) ? 0 : passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + var len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}; +imports.wbg.__wbindgen_is_string = function(arg0) { + const ret = typeof(getObject(arg0)) === 'string'; + _assertBoolean(ret); + return ret; +}; +imports.wbg.__wbg_set_bf3f89b92d5a34bf = function() { return handleError(function (arg0, arg1, arg2) { + const ret = Reflect.set(getObject(arg0), getObject(arg1), getObject(arg2)); + _assertBoolean(ret); + return ret; +}, arguments) }; +imports.wbg.__wbindgen_debug_string = function(arg0, arg1) { + const ret = debugString(getObject(arg1)); + const ptr0 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc); + const len0 = WASM_VECTOR_LEN; + getInt32Memory0()[arg0 / 4 + 1] = len0; + getInt32Memory0()[arg0 / 4 + 0] = ptr0; +}; +imports.wbg.__wbindgen_object_drop_ref = function(arg0) { + takeObject(arg0); +}; +imports.wbg.__wbindgen_throw = function(arg0, arg1) { + throw new Error(getStringFromWasm0(arg0, arg1)); +}; +imports.wbg.__wbindgen_memory = function() { + const ret = wasm.memory; + return addHeapObject(ret); +}; +imports.wbg.__wbindgen_closure_wrapper1047 = function() { return logError(function (arg0, arg1, arg2) { + const ret = makeMutClosure(arg0, arg1, 113, __wbg_adapter_22); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbindgen_closure_wrapper1049 = function() { return logError(function (arg0, arg1, arg2) { + const ret = makeMutClosure(arg0, arg1, 115, __wbg_adapter_25); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbindgen_closure_wrapper1051 = function() { return logError(function (arg0, arg1, arg2) { + const ret = makeClosure(arg0, arg1, 111, __wbg_adapter_28); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbindgen_closure_wrapper1528 = function() { return logError(function (arg0, arg1, arg2) { + const ret = makeMutClosure(arg0, arg1, 180, __wbg_adapter_31); + return addHeapObject(ret); +}, arguments) }; +imports.wbg.__wbindgen_closure_wrapper2812 = function() { return logError(function (arg0, arg1, arg2) { + const ret = makeMutClosure(arg0, arg1, 244, __wbg_adapter_34); + return addHeapObject(ret); +}, arguments) }; +imports['./snippets/dioxus-interpreter-js-459fb15b86d869f7/inline0.js'] = __wbg_star0; + +return imports; +} + +function initMemory(imports, maybe_memory) { + +} + +function finalizeInit(instance, module) { + wasm = instance.exports; + init.__wbindgen_wasm_module = module; + cachedInt32Memory0 = new Int32Array(); + cachedUint32Memory0 = new Uint32Array(); + cachedUint8Memory0 = new Uint8Array(); + + wasm.__wbindgen_start(); + return wasm; +} + +function initSync(module) { + const imports = getImports(); + + initMemory(imports); + + if (!(module instanceof WebAssembly.Module)) { + module = new WebAssembly.Module(module); + } + + const instance = new WebAssembly.Instance(module, imports); + + return finalizeInit(instance, module); +} + +async function init(input) { + + const imports = getImports(); + + if (typeof input === 'string' || (typeof Request === 'function' && input instanceof Request) || (typeof URL === 'function' && input instanceof URL)) { + input = fetch(input); + } + + initMemory(imports); + + const { instance, module } = await load(await input, imports); + + return finalizeInit(instance, module); +} + +export { initSync } +export default init; diff --git a/packages/web/dist/assets/dioxus/dioxus_bg.wasm b/packages/web/dist/assets/dioxus/dioxus_bg.wasm new file mode 100644 index 000000000..2e7773b19 Binary files /dev/null and b/packages/web/dist/assets/dioxus/dioxus_bg.wasm differ diff --git a/packages/web/dist/assets/dioxus/snippets/dioxus-interpreter-js-459fb15b86d869f7/inline0.js b/packages/web/dist/assets/dioxus/snippets/dioxus-interpreter-js-459fb15b86d869f7/inline0.js new file mode 100644 index 000000000..8ee855543 --- /dev/null +++ b/packages/web/dist/assets/dioxus/snippets/dioxus-interpreter-js-459fb15b86d869f7/inline0.js @@ -0,0 +1,152 @@ +let m,p,ls,lss,sp,d,t,c,s,sl,op,i,e,z,len,index,field,tmpl_id,value,n,text,id,event_name,bubbles,ptr,many,root,ns;const ns_cache = [];const evt = [];const attr = []; + class ListenerMap { + constructor(root) { + // bubbling events can listen at the root element + this.global = {}; + // non bubbling events listen at the element the listener was created at + this.local = {}; + this.root = null; + this.handler = null; + } + + create(event_name, element, bubbles) { + if (bubbles) { + if (this.global[event_name] === undefined) { + this.global[event_name] = {}; + this.global[event_name].active = 1; + this.root.addEventListener(event_name, this.handler); + } else { + this.global[event_name].active++; + } + } + else { + const id = element.getAttribute("data-dioxus-id"); + if (!this.local[id]) { + this.local[id] = {}; + } + element.addEventListener(event_name, this.handler); + } + } + + remove(element, event_name, bubbles) { + if (bubbles) { + this.global[event_name].active--; + if (this.global[event_name].active === 0) { + this.root.removeEventListener(event_name, this.global[event_name].callback); + delete this.global[event_name]; + } + } + else { + const id = element.getAttribute("data-dioxus-id"); + delete this.local[id][event_name]; + if (this.local[id].length === 0) { + delete this.local[id]; + } + element.removeEventListener(event_name, this.handler); + } + } + + removeAllNonBubbling(element) { + const id = element.getAttribute("data-dioxus-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 "checked": + node.checked = value === "true"; + break; + case "selected": + node.selected = value === "true"; + 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 (value === "false" && bool_attrs.hasOwnProperty(name)) { + node.removeAttribute(name); + } else { + node.setAttribute(name, value); + } + } + } + } + function LoadChild(ptr, len) { + // iterate through each number and get that child + node = stack[stack.length - 1]; + ptr_end = ptr + len; + for (; ptr < ptr_end; ptr++) { + end = m.getUint8(ptr); + for (node = node.firstChild; end > 0; end--) { + node = node.nextSibling; + } + } + return node; + } + const listeners = new ListenerMap(); + let nodes = []; + let stack = []; + const templates = {}; + let node, els, end, ptr_end, k; + export function save_template(nodes, tmpl_id) { + templates[tmpl_id] = nodes; + } + export function set_node(id, node) { + nodes[id] = node; + } + export function initilize(root, handler) { + listeners.handler = handler; + nodes = [root]; + stack = [root]; + listeners.root = root; + } + function AppendChildren(id, many){ + root = nodes[id]; + els = stack.splice(stack.length-many); + for (k = 0; k < many; k++) { + root.appendChild(els[k]); + } + } + export function create(r){d=r;c=new TextDecoder('utf-8',{fatal:true})}export function update_memory(r){m=new DataView(r.buffer)}export function set_buffer(b){m=new DataView(b)}export function run(){t=m.getUint8(d,true);if(t&1){ls=m.getUint32(d+1,true)}p=ls;if(t&2){lss=m.getUint32(d+5,true)}if(t&4){sl=m.getUint32(d+9,true);if(t&8){sp=lss;s="";e=sp+(sl/4|0)*4;while(sp>8,(t&16711680)>>16,t>>24);sp+=4}while(sp>>8)&255);evt[i&127]=event_name;}else{event_name=evt[i&127];}node = nodes[id]; if(node.listening){node.listening += 1;}else{node.listening = 1;} node.setAttribute('data-dioxus-id', `${id}`); listeners.create(event_name, node, (i>>>16)&255);p+=3;break;case 12:i=m.getUint32(p,true);p += 3;if((i&128)!=0){event_name=s.substring(sp,sp+=(i>>>8)&255);evt[i&127]=event_name;}else{event_name=evt[i&127];}bubbles=(i>>>16)&255;{node = nodes[m.getUint32(p,true)]; node.listening -= 1; node.removeAttribute('data-dioxus-id'); listeners.remove(node, event_name, bubbles);}p+=4;break;case 13:id=m.getUint32(p,true);p += 4;{nodes[id].textContent = s.substring(sp,sp+=m.getUint32(p,true));}p+=4;break;case 14:i=m.getUint32(p,true);p += 4;if((i&128)!=0){ns=s.substring(sp,sp+=(i>>>8)&255);ns_cache[i&127]=ns;}else{ns=ns_cache[i&127];}if((i&8388608)!=0){field=s.substring(sp,sp+=i>>>24);attr[(i>>>16)&127]=field;}else{field=attr[(i>>>16)&127];}id=m.getUint32(p,true);p += 4;{node = nodes[id]; SetAttributeInner(node, field, s.substring(sp,sp+=m.getUint32(p,true)), ns);}p+=4;break;case 15:i=m.getUint32(p,true);p += 4;if((i&128)!=0){ns=s.substring(sp,sp+=(i>>>8)&255);ns_cache[i&127]=ns;}else{ns=ns_cache[i&127];}if((i&8388608)!=0){field=s.substring(sp,sp+=i>>>24);attr[(i>>>16)&127]=field;}else{field=attr[(i>>>16)&127];}{name = field; + node = this.nodes[m.getUint32(p,true)]; + if (ns == "style") { + node.style.removeProperty(name); + } else if (ns !== null && ns !== undefined && ns !== "") { + node.removeAttributeNS(ns, name); + } else if (name === "value") { + node.value = ""; + } else if (name === "checked") { + node.checked = false; + } else if (name === "selected") { + node.selected = false; + } else if (name === "dangerous_inner_html") { + node.innerHTML = ""; + } else { + node.removeAttribute(name); + }}p+=4;break;case 16:len=m.getUint8(p,true);p += 1;ptr=m.getUint32(p,true);p += 4;{nodes[m.getUint32(p,true)] = LoadChild(ptr, len);}p+=4;break;case 17:len=m.getUint8(p,true);p += 1;value=s.substring(sp,sp+=m.getUint32(p,true));p += 4;ptr=m.getUint32(p,true);p += 4;{ + node = LoadChild(ptr, len); + if (node.nodeType == Node.TEXT_NODE) { + node.textContent = value; + } else { + let text = document.createTextNode(value); + node.replaceWith(text); + node = text; + } + nodes[m.getUint32(p,true)] = node; + }p+=4;break;case 18:len=m.getUint8(p,true);p += 1;ptr=m.getUint32(p,true);p += 4;{els = stack.splice(stack.length - m.getUint32(p,true)); node = LoadChild(ptr, len); node.replaceWith(...els);}p+=4;break;case 19:tmpl_id=m.getUint32(p,true);p += 4;index=m.getUint32(p,true);p += 4;{node = templates[tmpl_id][index].cloneNode(true); nodes[m.getUint32(p,true)] = node; stack.push(node);}p+=4;break;case 20:return true;}op>>>=8;}}} \ No newline at end of file diff --git a/packages/web/dist/index.html b/packages/web/dist/index.html new file mode 100644 index 000000000..cb3c4cfb6 --- /dev/null +++ b/packages/web/dist/index.html @@ -0,0 +1,46 @@ + + + + dioxus | ⛺ + + + + + + +
+ + + + \ No newline at end of file