https://roycekimmons.com/js/etb/template.js

1let templates = {};
2const uiParam = new URLSearchParams(window.location.search).get('ui');
3const ui = uiParam || 'default';
4
5async function GetTemplate(name) {
6    if (templates[name] == undefined) {
7        let h;
8        try {
9            h = await fetch('/ui/' + ui + '/' + name + '.html');
10        } catch (error) {
11            if (ui === 'default') throw error;
12        }
13        if ((h === undefined || !h.ok) && ui !== 'default') {
14            h = await fetch('/ui/default/' + name + '.html');
15        }
16        if (h === undefined || !h.ok) {
17            throw new Error('Unable to load template: ' + name);
18        }
19        templates[name] = await h.text();
20    }
21    return templates[name];
22}
23
24async function RenderTemplate(name, entity = {}) {
25    let html = await GetTemplate(name);
26    var regex = /{{\s*([^}\s]+)\s*}}/g;
27    let result = html.replace(regex, function (match, variable) {
28        let vs = variable.split('.');
29        let v = '';
30        if (vs.length > 1 && entity[vs[0]] !== undefined && entity[vs[0]][vs[1]] !== undefined) {
31            v = entity[vs[0]][vs[1]];
32        } else if (vs.length == 1 && entity[vs[0]] !== null) {
33            v = entity[vs[0]];
34        }
35        if (typeof v !== 'string' && isNaN(v)) v = '';
36        return v;
37    });
38    const e = $(result)[0];
39    await TranslateUI(e);
40    return e;
41}
42
43async function RenderContentTemplates(container) {
44    console.log('Rendering content templates');
45    $(container).find('[data-template]').each(async (index, element) => {
46        let o = {};
47        for(let attr of element.attributes) {
48            if(attr.name=='data-template') {
49                continue;
50            } else if(attr.name=='data-entity-type') {
51                switch(attr.value) {
52                    case 'author':
53                        o = await GetAuthor($(element).attr('data-entity-id'));
54                    break;
55                    // Other renderers here
56                }
57            } else if (attr.name.startsWith('data-')) {
58                o[attr.name.slice(5)] = attr.value;
59                if(attr.name=='data-iframe-src') o['src'] = attr.value;
60            } else {
61                o[attr.name] = attr.value;
62            }
63        }
64        console.log(o);
65        $(element).replaceWith(await RenderTemplate('content_templates/'+$(element).attr('data-template'), o));
66    });
67    return true;
68}
69
70function RenderImages(element) {
71    $(element).find('img[data-img-src]').each(function() {
72        $(this).attr('src', $(this).attr('data-img-src')).removeAttr('data-img-src');
73    });
74}