You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
40 lines
1.3 KiB
40 lines
1.3 KiB
2 years ago
|
/**
|
||
|
|
* UI Toasts
|
||
|
|
*/
|
||
|
|
|
||
|
|
'use strict';
|
||
|
|
|
||
|
|
(function () {
|
||
|
|
// Bootstrap toasts example
|
||
|
|
// --------------------------------------------------------------------
|
||
|
|
const toastPlacementExample = document.querySelector('.toast-placement-ex'),
|
||
|
|
toastPlacementBtn = document.querySelector('#showToastPlacement');
|
||
|
|
let selectedType, selectedPlacement, toastPlacement;
|
||
|
|
|
||
|
|
// Dispose toast when open another
|
||
|
|
function toastDispose(toast) {
|
||
|
|
if (toast && toast._element !== null) {
|
||
|
|
if (toastPlacementExample) {
|
||
|
|
toastPlacementExample.classList.remove(selectedType);
|
||
|
|
DOMTokenList.prototype.remove.apply(toastPlacementExample.classList, selectedPlacement);
|
||
|
|
}
|
||
|
|
toast.dispose();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
// Placement Button click
|
||
|
|
if (toastPlacementBtn) {
|
||
|
|
toastPlacementBtn.onclick = function () {
|
||
|
|
if (toastPlacement) {
|
||
|
|
toastDispose(toastPlacement);
|
||
|
|
}
|
||
|
|
selectedType = document.querySelector('#selectTypeOpt').value;
|
||
|
|
selectedPlacement = document.querySelector('#selectPlacement').value.split(' ');
|
||
|
|
|
||
|
|
toastPlacementExample.classList.add(selectedType);
|
||
|
|
DOMTokenList.prototype.add.apply(toastPlacementExample.classList, selectedPlacement);
|
||
|
|
toastPlacement = new bootstrap.Toast(toastPlacementExample);
|
||
|
|
toastPlacement.show();
|
||
|
|
};
|
||
|
|
}
|
||
|
|
})();
|