dyte-dialog-manager
A component which handles all dialog elements in a component such as:
- dyte-settings
- dyte-leave-meeting
- dyte-permissions-message
- dyte-image-viewer
- dyte-remote-access-manager
- dyte-breakout-rooms-manager
This components depends on the values from states object.
<dyte-button onclick="showSettings()">Show Settings</dyte-button>
<dyte-button onclick="showLeaveConfirmation()">Show Settings</dyte-button>
<dyte-dialog-manager id="dyte-el"></dyte-dialog-manager>
<script>
const dialog = document.getElementById('dyte-el');
dialog.meeting = meeting;
let states = {};
function updateStates() {
dialog.states = states;
}
function stateUpdate(s) {
states = { ...states, ...s };
updateStates();
}
function showSettings() {
stateUpdate({ activeSettings: true });
}
function showLeaveConfirmation() {
stateUpdate({ activeLeaveConfirmation: true });
}
dialog.addEventListener('dyteStateUpdate', (e) => {
stateUpdate(e.detail);
});
updateStates();
</script>