aboutsummaryrefslogtreecommitdiff
path: root/frontend/src
diff options
context:
space:
mode:
authorXe Iaso <me@christine.website>2022-09-13 00:45:56 +0000
committerXe Iaso <me@christine.website>2022-09-13 00:45:56 +0000
commit67c3de61cb69aab382f9a11e9cbef926ad26d03d (patch)
tree73e0c3ca5b236d703113498ecb3706528d1a8285 /frontend/src
parenteb77e4b7c02511463a871ab5eb27c5503026f17b (diff)
downloadxesite-67c3de61cb69aab382f9a11e9cbef926ad26d03d.tar.xz
xesite-67c3de61cb69aab382f9a11e9cbef926ad26d03d.zip
fix site on ios 16
Signed-off-by: Xe Iaso <me@christine.website>
Diffstat (limited to 'frontend/src')
-rw-r--r--frontend/src/xeact/jsx-runtime.js15
-rw-r--r--frontend/src/xeact/xeact.js88
-rw-r--r--frontend/src/xeact/xeact.ts9
3 files changed, 112 insertions, 0 deletions
diff --git a/frontend/src/xeact/jsx-runtime.js b/frontend/src/xeact/jsx-runtime.js
new file mode 100644
index 0000000..b71a99e
--- /dev/null
+++ b/frontend/src/xeact/jsx-runtime.js
@@ -0,0 +1,15 @@
+import { h } from './xeact.js';
+
+/**
+ * Create a DOM element, assign the properties of `data` to it, and append all `data.children`.
+ *
+ * @type{function(string, Object=): HTMLElement}
+ */
+export const jsx = (tag, data) => {
+ let children = data.children;
+ delete data.children;
+ const result = h(tag, data, children);
+ result.classList.value = result.class;
+ return result;
+};
+export const jsxs = jsx;
diff --git a/frontend/src/xeact/xeact.js b/frontend/src/xeact/xeact.js
new file mode 100644
index 0000000..7be9a1c
--- /dev/null
+++ b/frontend/src/xeact/xeact.js
@@ -0,0 +1,88 @@
+/**
+ * Creates a DOM element, assigns the properties of `data` to it, and appends all `children`.
+ *
+ * @type{function(string|Function, Object=, Node|Array.<Node|string>=)}
+ */
+const h = (name, data = {}, children = []) => {
+ const result = typeof name == "function" ? name(data) : Object.assign(document.createElement(name), data);
+ if (!Array.isArray(children)) {
+ children = [children];
+ }
+ result.append(...children);
+ return result;
+};
+
+/**
+ * Create a text node.
+ *
+ * Equivalent to `document.createTextNode(text)`
+ *
+ * @type{function(string): Text}
+ */
+const t = (text) => document.createTextNode(text);
+
+/**
+ * Remove all child nodes from a DOM element.
+ *
+ * @type{function(Node)}
+ */
+const x = (elem) => {
+ while (elem.lastChild) {
+ elem.removeChild(elem.lastChild);
+ }
+};
+
+/**
+ * Get all elements with the given ID.
+ *
+ * Equivalent to `document.getElementById(name)`
+ *
+ * @type{function(string): HTMLElement}
+ */
+const g = (name) => document.getElementById(name);
+
+/**
+ * Get all elements with the given class name.
+ *
+ * Equivalent to `document.getElementsByClassName(name)`
+ *
+ * @type{function(string): HTMLCollectionOf.<Element>}
+ */
+const c = (name) => document.getElementsByClassName(name);
+
+/** @type{function(string): HTMLCollectionOf.<Element>} */
+const n = (name) => document.getElementsByName(name);
+
+/**
+ * Get all elements matching the given HTML selector.
+ *
+ * Matches selectors with `document.querySelectorAll(selector)`
+ *
+ * @type{function(string): Array.<HTMLElement>}
+ */
+const s = (selector) => Array.from(document.querySelectorAll(selector));
+
+/**
+ * Generate a relative URL from `url`, appending all key-value pairs from `params` as URL-encoded parameters.
+ *
+ * @type{function(string=, Object=): string}
+ */
+const u = (url = "", params = {}) => {
+ let result = new URL(url, window.location.href);
+ Object.entries(params).forEach((kv) => {
+ let [k, v] = kv;
+ result.searchParams.set(k, v);
+ });
+ return result.toString();
+};
+
+/**
+ * Takes a callback to run when all DOM content is loaded.
+ *
+ * Equivalent to `window.addEventListener('DOMContentLoaded', callback)`
+ *
+ * @type{function(function())}
+ */
+const r = (callback) => window.addEventListener('DOMContentLoaded', callback);
+
+export { h, t, x, g, c, n, u, s, r };
diff --git a/frontend/src/xeact/xeact.ts b/frontend/src/xeact/xeact.ts
new file mode 100644
index 0000000..8974ec1
--- /dev/null
+++ b/frontend/src/xeact/xeact.ts
@@ -0,0 +1,9 @@
+export * from "./xeact.js";
+
+declare global {
+ export namespace JSX {
+ interface IntrinsicElements {
+ [elemName: string]: any;
+ }
+ }
+}