aboutsummaryrefslogtreecommitdiff
path: root/src/frontend/xeact/xeact.js
blob: 7be9a1cc079b6299583048ff40ae88e048893416 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
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 };