diff options
| author | Xe Iaso <me@christine.website> | 2022-09-13 00:45:56 +0000 |
|---|---|---|
| committer | Xe Iaso <me@christine.website> | 2022-09-13 00:45:56 +0000 |
| commit | 67c3de61cb69aab382f9a11e9cbef926ad26d03d (patch) | |
| tree | 73e0c3ca5b236d703113498ecb3706528d1a8285 /frontend/src | |
| parent | eb77e4b7c02511463a871ab5eb27c5503026f17b (diff) | |
| download | xesite-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.js | 15 | ||||
| -rw-r--r-- | frontend/src/xeact/xeact.js | 88 | ||||
| -rw-r--r-- | frontend/src/xeact/xeact.ts | 9 |
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; + } + } +} |
