feat: setup a typescript build
This commit is contained in:
Jonathan Kelley committed
1 parent
6771ead13e
commit
5bf6c96f9f
6 files changed
+1111
-449
No files matched your search
@@ -0,0 +1,461 @@
|
||||
"use strict";
|
||||
exports.__esModule = true;
|
||||
function serialize_event(event) {
|
||||
var _a, _b;
|
||||
switch (event.type) {
|
||||
case "copy":
|
||||
case "cut":
|
||||
case "past":
|
||||
return {};
|
||||
case "compositionend":
|
||||
case "compositionstart":
|
||||
case "compositionupdate":
|
||||
var data = event.data;
|
||||
return {
|
||||
data: data
|
||||
};
|
||||
case "keydown":
|
||||
case "keypress":
|
||||
case "keyup":
|
||||
var _c = event, charCode = _c.charCode, key = _c.key, altKey = _c.altKey, ctrlKey = _c.ctrlKey, metaKey = _c.metaKey, keyCode = _c.keyCode, shiftKey = _c.shiftKey, location_1 = _c.location, repeat = _c.repeat, which = _c.which;
|
||||
return {
|
||||
char_code: charCode,
|
||||
key: key,
|
||||
alt_key: altKey,
|
||||
ctrl_key: ctrlKey,
|
||||
meta_key: metaKey,
|
||||
key_code: keyCode,
|
||||
shift_key: shiftKey,
|
||||
location: location_1,
|
||||
repeat: repeat,
|
||||
which: which,
|
||||
locale: "locale"
|
||||
};
|
||||
case "focus":
|
||||
case "blur":
|
||||
return {};
|
||||
case "change":
|
||||
var target = event.target;
|
||||
var value = void 0;
|
||||
if (target.type === "checkbox" || target.type === "radio") {
|
||||
value = target.checked ? "true" : "false";
|
||||
}
|
||||
else {
|
||||
value = (_a = target.value) !== null && _a !== void 0 ? _a : target.textContent;
|
||||
}
|
||||
return {
|
||||
value: value
|
||||
};
|
||||
case "input":
|
||||
case "invalid":
|
||||
case "reset":
|
||||
case "submit": {
|
||||
var target_1 = event.target;
|
||||
var value_1 = (_b = target_1.value) !== null && _b !== void 0 ? _b : target_1.textContent;
|
||||
if (target_1.type == "checkbox") {
|
||||
value_1 = target_1.checked ? "true" : "false";
|
||||
}
|
||||
return {
|
||||
value: value_1
|
||||
};
|
||||
}
|
||||
case "click":
|
||||
case "contextmenu":
|
||||
case "doubleclick":
|
||||
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": {
|
||||
var _d = event, altKey_1 = _d.altKey, button = _d.button, buttons = _d.buttons, clientX = _d.clientX, clientY = _d.clientY, ctrlKey_1 = _d.ctrlKey, metaKey_1 = _d.metaKey, pageX = _d.pageX, pageY = _d.pageY, screenX_1 = _d.screenX, screenY_1 = _d.screenY, shiftKey_1 = _d.shiftKey;
|
||||
return {
|
||||
alt_key: altKey_1,
|
||||
button: button,
|
||||
buttons: buttons,
|
||||
client_x: clientX,
|
||||
client_y: clientY,
|
||||
ctrl_key: ctrlKey_1,
|
||||
meta_key: metaKey_1,
|
||||
page_x: pageX,
|
||||
page_y: pageY,
|
||||
screen_x: screenX_1,
|
||||
screen_y: screenY_1,
|
||||
shift_key: shiftKey_1
|
||||
};
|
||||
}
|
||||
case "pointerdown":
|
||||
case "pointermove":
|
||||
case "pointerup":
|
||||
case "pointercancel":
|
||||
case "gotpointercapture":
|
||||
case "lostpointercapture":
|
||||
case "pointerenter":
|
||||
case "pointerleave":
|
||||
case "pointerover":
|
||||
case "pointerout": {
|
||||
var _e = event, altKey_2 = _e.altKey, button = _e.button, buttons = _e.buttons, clientX = _e.clientX, clientY = _e.clientY, ctrlKey_2 = _e.ctrlKey, metaKey_2 = _e.metaKey, pageX = _e.pageX, pageY = _e.pageY, screenX_2 = _e.screenX, screenY_2 = _e.screenY, shiftKey_2 = _e.shiftKey, pointerId = _e.pointerId, width = _e.width, height = _e.height, pressure = _e.pressure, tangentialPressure = _e.tangentialPressure, tiltX = _e.tiltX, tiltY = _e.tiltY, twist = _e.twist, pointerType = _e.pointerType, isPrimary = _e.isPrimary;
|
||||
return {
|
||||
alt_key: altKey_2,
|
||||
button: button,
|
||||
buttons: buttons,
|
||||
client_x: clientX,
|
||||
client_y: clientY,
|
||||
ctrl_key: ctrlKey_2,
|
||||
meta_key: metaKey_2,
|
||||
page_x: pageX,
|
||||
page_y: pageY,
|
||||
screen_x: screenX_2,
|
||||
screen_y: screenY_2,
|
||||
shift_key: shiftKey_2,
|
||||
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": {
|
||||
var _f = event, altKey_3 = _f.altKey, ctrlKey_3 = _f.ctrlKey, metaKey_3 = _f.metaKey, shiftKey_3 = _f.shiftKey;
|
||||
return {
|
||||
// changed_touches: event.changedTouches,
|
||||
// target_touches: event.targetTouches,
|
||||
// touches: event.touches,
|
||||
alt_key: altKey_3,
|
||||
ctrl_key: ctrlKey_3,
|
||||
meta_key: metaKey_3,
|
||||
shift_key: shiftKey_3
|
||||
};
|
||||
}
|
||||
case "scroll":
|
||||
return {};
|
||||
case "wheel": {
|
||||
var _g = event, deltaX = _g.deltaX, deltaY = _g.deltaY, deltaZ = _g.deltaZ, deltaMode = _g.deltaMode;
|
||||
return {
|
||||
delta_x: deltaX,
|
||||
delta_y: deltaY,
|
||||
delta_z: deltaZ,
|
||||
delta_mode: deltaMode
|
||||
};
|
||||
}
|
||||
case "animationstart":
|
||||
case "animationend":
|
||||
case "animationiteration": {
|
||||
var _h = event, animationName = _h.animationName, elapsedTime = _h.elapsedTime, pseudoElement = _h.pseudoElement;
|
||||
return {
|
||||
animation_name: animationName,
|
||||
elapsed_time: elapsedTime,
|
||||
pseudo_element: pseudoElement
|
||||
};
|
||||
}
|
||||
case "transitionend": {
|
||||
var _j = event, propertyName = _j.propertyName, elapsedTime = _j.elapsedTime, pseudoElement = _j.pseudoElement;
|
||||
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 {};
|
||||
}
|
||||
}
|
||||
var 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
|
||||
};
|
||||
var Interpreter = /** @class */ (function () {
|
||||
function Interpreter(root) {
|
||||
this.root = root;
|
||||
this.stack = [root];
|
||||
this.listeners = {};
|
||||
this.lastNodeWasText = false;
|
||||
this.nodes = [root];
|
||||
}
|
||||
Interpreter.prototype.top = function () {
|
||||
return this.stack[this.stack.length - 1];
|
||||
};
|
||||
Interpreter.prototype.pop = function () {
|
||||
return this.stack.pop();
|
||||
};
|
||||
Interpreter.prototype.PushRoot = function (edit) {
|
||||
var id = edit.root;
|
||||
var node = this.nodes[id];
|
||||
this.stack.push(node);
|
||||
};
|
||||
Interpreter.prototype.AppendChildren = function (edit) {
|
||||
var root = this.stack[this.stack.length - (1 + edit.many)];
|
||||
var to_add = this.stack.splice(this.stack.length - edit.many);
|
||||
for (var i = 0; i < edit.many; i++) {
|
||||
root.appendChild(to_add[i]);
|
||||
}
|
||||
};
|
||||
Interpreter.prototype.ReplaceWith = function (edit) {
|
||||
var root = this.nodes[edit.root];
|
||||
var els = this.stack.splice(this.stack.length - edit.m);
|
||||
root.replaceWith.apply(root, els);
|
||||
};
|
||||
Interpreter.prototype.InsertAfter = function (edit) {
|
||||
var old = this.nodes[edit.root];
|
||||
var new_nodes = this.stack.splice(this.stack.length - edit.n);
|
||||
old.after.apply(old, new_nodes);
|
||||
};
|
||||
Interpreter.prototype.InsertBefore = function (edit) {
|
||||
var old = this.nodes[edit.root];
|
||||
var new_nodes = this.stack.splice(this.stack.length - edit.n);
|
||||
old.before.apply(old, new_nodes);
|
||||
};
|
||||
Interpreter.prototype.Remove = function (edit) {
|
||||
var node = this.nodes[edit.root];
|
||||
if (node !== undefined) {
|
||||
node.remove();
|
||||
}
|
||||
};
|
||||
Interpreter.prototype.CreateTextNode = function (edit) {
|
||||
// todo: make it so the types are okay
|
||||
var node = document.createTextNode(edit.text);
|
||||
this.nodes[edit.root] = node;
|
||||
this.stack.push(node);
|
||||
};
|
||||
Interpreter.prototype.CreateElement = function (edit) {
|
||||
var el = document.createElement(edit.tag);
|
||||
el.setAttribute("dioxus-id", "".concat(edit.root));
|
||||
this.nodes[edit.root] = el;
|
||||
this.stack.push(el);
|
||||
};
|
||||
Interpreter.prototype.CreateElementNs = function (edit) {
|
||||
var el = document.createElementNS(edit.ns, edit.tag);
|
||||
this.stack.push(el);
|
||||
this.nodes[edit.root] = el;
|
||||
};
|
||||
Interpreter.prototype.CreatePlaceholder = function (edit) {
|
||||
var el = document.createElement("pre");
|
||||
el.hidden = true;
|
||||
this.stack.push(el);
|
||||
this.nodes[edit.root] = el;
|
||||
};
|
||||
Interpreter.prototype.RemoveEventListener = function (edit) { };
|
||||
Interpreter.prototype.NewEventListener = function (edit, handler) {
|
||||
var event_name = edit.event_name;
|
||||
var mounted_node_id = edit.root;
|
||||
var scope = edit.scope;
|
||||
console.log('new event listener', event_name, mounted_node_id, scope);
|
||||
var element = this.nodes[edit.root];
|
||||
element.setAttribute("dioxus-event-".concat(event_name), "".concat(scope, ".").concat(mounted_node_id));
|
||||
if (!this.listeners[event_name]) {
|
||||
this.listeners[event_name] = handler;
|
||||
this.root.addEventListener(event_name, handler);
|
||||
}
|
||||
};
|
||||
Interpreter.prototype.SetText = function (edit) {
|
||||
this.nodes[edit.root].textContent = edit.text;
|
||||
};
|
||||
Interpreter.prototype.SetAttribute = function (edit) {
|
||||
// console.log("setting attr", edit);
|
||||
var name = edit.field;
|
||||
var value = edit.value;
|
||||
var ns = edit.ns;
|
||||
var node = this.nodes[edit.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);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
Interpreter.prototype.RemoveAttribute = function (edit) {
|
||||
var name = edit.name;
|
||||
var node = this.nodes[edit.root];
|
||||
node.removeAttribute(name);
|
||||
if (name === "value") {
|
||||
node.value = "";
|
||||
}
|
||||
if (name === "checked") {
|
||||
node.checked = false;
|
||||
}
|
||||
if (name === "selected") {
|
||||
node.selected = false;
|
||||
}
|
||||
};
|
||||
Interpreter.prototype.handleEdits = function (edits) {
|
||||
console.log("handling edits ", edits);
|
||||
this.stack.push(this.root);
|
||||
var _loop_1 = function (edit) {
|
||||
switch (edit.type) {
|
||||
case "AppendChildren":
|
||||
this_1.AppendChildren(edit);
|
||||
break;
|
||||
case "ReplaceWith":
|
||||
this_1.ReplaceWith(edit);
|
||||
break;
|
||||
case "InsertAfter":
|
||||
this_1.InsertAfter(edit);
|
||||
break;
|
||||
case "InsertBefore":
|
||||
this_1.InsertBefore(edit);
|
||||
break;
|
||||
case "Remove":
|
||||
this_1.Remove(edit);
|
||||
break;
|
||||
case "CreateTextNode":
|
||||
this_1.CreateTextNode(edit);
|
||||
break;
|
||||
case "CreateElement":
|
||||
this_1.CreateElement(edit);
|
||||
break;
|
||||
case "CreateElementNs":
|
||||
this_1.CreateElementNs(edit);
|
||||
break;
|
||||
case "CreatePlaceholder":
|
||||
this_1.CreatePlaceholder(edit);
|
||||
break;
|
||||
case "RemoveEventListener":
|
||||
this_1.RemoveEventListener(edit);
|
||||
break;
|
||||
case "NewEventListener":
|
||||
// todo: only on desktop should we make our own handler
|
||||
var handler = function (event) {
|
||||
var target = event.target;
|
||||
console.log("event", event);
|
||||
if (target != null) {
|
||||
var real_id = target.getAttribute("dioxus-id");
|
||||
var should_prevent_default = target.getAttribute("dioxus-prevent-default");
|
||||
var contents = serialize_event(event);
|
||||
if (should_prevent_default === "on".concat(event.type)) {
|
||||
event.preventDefault();
|
||||
}
|
||||
if (real_id == null) {
|
||||
return;
|
||||
}
|
||||
window.rpc.call("user_event", {
|
||||
event: edit.event_name,
|
||||
mounted_dom_id: parseInt(real_id),
|
||||
contents: contents
|
||||
});
|
||||
}
|
||||
};
|
||||
this_1.NewEventListener(edit, handler);
|
||||
break;
|
||||
case "SetText":
|
||||
this_1.SetText(edit);
|
||||
break;
|
||||
case "SetAttribute":
|
||||
this_1.SetAttribute(edit);
|
||||
break;
|
||||
case "RemoveAttribute":
|
||||
this_1.RemoveAttribute(edit);
|
||||
break;
|
||||
}
|
||||
};
|
||||
var this_1 = this;
|
||||
for (var _i = 0, edits_1 = edits; _i < edits_1.length; _i++) {
|
||||
var edit = edits_1[_i];
|
||||
_loop_1(edit);
|
||||
}
|
||||
};
|
||||
return Interpreter;
|
||||
}());
|
||||
function main() {
|
||||
var root = window.document.getElementById("main");
|
||||
if (root != null) {
|
||||
window.interpreter = new Interpreter(root);
|
||||
window.rpc.call("initialize");
|
||||
}
|
||||
}
|
||||
main();
|
||||
Reference in new issue
Block a user