Skip to content

Instantly share code, notes, and snippets.

@JRJurman
Created November 1, 2023 04:39
Show Gist options
  • Save JRJurman/0ab2bf82f0069e35bff998fc20648897 to your computer and use it in GitHub Desktop.
Save JRJurman/0ab2bf82f0069e35bff998fc20648897 to your computer and use it in GitHub Desktop.
Event Rebroadcaster Tram-Lite shadow Root Processor
/**
* TBA
*/
class EventRebroadcaster {
/**
* connect function for EventRebroadcaster - when this is attached to an element, we
* set up a listener to for events and rebroadcast them up or down the DOM
* @param {HTMLElement} newNode
*/
static connect(newNode) {
// attributes that control the behavior of the event rebroadcaster
const triggerString = newNode.getAttribute('tl-trigger') || 'change';
const triggers = triggerString.split(' ');
const eventName = newNode.getAttribute('tl-eventname');
const eventDirection = newNode.getAttribute('tl-direction') || 'up';
const hostElement = newNode.getRootNode().host;
// emit an event whenever these events are triggered
triggers.forEach((trigger) => {
newNode.addEventListener(trigger, () => {
TramLite.dispatchEvent(hostElement, newNode, eventName, eventDirection);
});
});
}
}
// setup shadow root processor so that tl-rebroadcast that are added are processed correctly
TramLite.appendShadowRootProcessor('[tl-rebroadcast]', EventRebroadcaster, TramLite.ComponentInterface);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment