- Added rollup-plugin-postcss to handle CSS imports in the project. - Updated rollup.config.js to include PostCSS plugin for CSS injection and minification. - Created a new styles.css file for component styling. - Enhanced OpenViduMeet component to manage iframe loading states and display error messages. - Implemented cleanup method in EventsManager to remove event listeners. - Added TypeScript declaration for CSS module imports.
38 lines
868 B
TypeScript
38 lines
868 B
TypeScript
import { OutboundEventMessage } from '../models/message.type';
|
|
|
|
export class EventsManager {
|
|
private element: HTMLElement;
|
|
|
|
constructor(element: HTMLElement) {
|
|
this.element = element;
|
|
}
|
|
|
|
public listen() {
|
|
window.addEventListener('message', this.handleMessage.bind(this));
|
|
}
|
|
|
|
public cleanup() {
|
|
window.removeEventListener('message', this.handleMessage);
|
|
}
|
|
|
|
private handleMessage(event: MessageEvent) {
|
|
const message: OutboundEventMessage = event.data;
|
|
// Validate message origin (security measure)
|
|
if (!message || !message.event) {
|
|
// console.warn('Invalid message:', message);
|
|
return;
|
|
}
|
|
|
|
this.dispatchEvent(message);
|
|
}
|
|
|
|
private dispatchEvent(message: OutboundEventMessage) {
|
|
const event = new CustomEvent(message.event, {
|
|
detail: message.payload,
|
|
bubbles: true,
|
|
composed: true
|
|
});
|
|
this.element.dispatchEvent(event);
|
|
}
|
|
}
|