-
Notifications
You must be signed in to change notification settings - Fork 1
/
utils.js
41 lines (39 loc) · 1.5 KB
/
utils.js
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
/**
* Replaces descendents' `onevent` attributes with an event listener of the same type.
* The event callback will be the `element`'s method as named by the onevent attribute.
* If no method with that name is found, the event listener is not created and the onevent attribute will remain untouched.
*
* If `element` has a shadow DOM, its descendents will be searched instead.
* @param {HTMLElement} element
* @returns void
*/
export function bindTemplateEvents(element) {
for (const el of (element.shadowRoot || element).querySelectorAll('*')) {
for (const attr of el.attributes) {
if (attr.name.startsWith('on')) {
if (!element[attr.value] || typeof element[attr.value] !== 'function') {
console.error(`Failed to add event listener. Template sets event to unsupported method: ${attr.name}="${attr.value}"`);
return
}
attr.ownerElement.addEventListener(attr.name.substring(2), e => element[attr.value](e));
attr.ownerElement[attr.name] = undefined;
}
}
}
}
/**
* Adds all descendents with an id as direct named properties of the returned object.
* @param {HTMLElement} element
* @returns {string|HTMLElement}
*/
export function getTemplateRefs(element) {
return new Proxy({}, {
get(target, refName) {
if (!target[refName]) {
const ref = element.querySelector(`[id=${refName}]`);
target[refName] = ref instanceof HTMLTemplateElement ? ref.content.cloneNode(true) : ref;
}
return target[refName];
}
})
}