/******/ (() => { // webpackBootstrap /******/ var __webpack_modules__ = ({ /***/ "./assets/src/js/admin/edit-curriculum/edit-section-item.js": /*!******************************************************************!*\ !*** ./assets/src/js/admin/edit-curriculum/edit-section-item.js ***! \******************************************************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ addItemToSection: () => (/* binding */ addItemToSection), /* harmony export */ addItemType: () => (/* binding */ addItemType), /* harmony export */ addItemsSelectedToSection: () => (/* binding */ addItemsSelectedToSection), /* harmony export */ backToSelectItems: () => (/* binding */ backToSelectItems), /* harmony export */ cancelAddItemType: () => (/* binding */ cancelAddItemType), /* harmony export */ cancelUpdateTitle: () => (/* binding */ cancelUpdateTitle), /* harmony export */ changeTitle: () => (/* binding */ changeTitle), /* harmony export */ changeTitleAddNew: () => (/* binding */ changeTitleAddNew), /* harmony export */ chooseTabItemsType: () => (/* binding */ chooseTabItemsType), /* harmony export */ deleteItem: () => (/* binding */ deleteItem), /* harmony export */ focusTitleInput: () => (/* binding */ focusTitleInput), /* harmony export */ init: () => (/* binding */ init), /* harmony export */ removeItemSelected: () => (/* binding */ removeItemSelected), /* harmony export */ searchTitleItemToSelect: () => (/* binding */ searchTitleItemToSelect), /* harmony export */ selectItemsFromList: () => (/* binding */ selectItemsFromList), /* harmony export */ showItemsSelected: () => (/* binding */ showItemsSelected), /* harmony export */ showPopupItemsToSelect: () => (/* binding */ showPopupItemsToSelect), /* harmony export */ sortAbleItem: () => (/* binding */ sortAbleItem), /* harmony export */ updatePreviewItem: () => (/* binding */ updatePreviewItem), /* harmony export */ updateTitle: () => (/* binding */ updateTitle) /* harmony export */ }); /* harmony import */ var _share_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./share.js */ "./assets/src/js/admin/edit-curriculum/share.js"); /* harmony import */ var sweetalert2__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! sweetalert2 */ "./node_modules/sweetalert2/dist/sweetalert2.all.js"); /* harmony import */ var sweetalert2__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(sweetalert2__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var sortablejs__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! sortablejs */ "./node_modules/sortablejs/modular/sortable.esm.js"); /** * Edit Section item Script on Curriculum * * @version 1.0.2 * @since 4.2.8.6 */ const className = { ..._share_js__WEBPACK_IMPORTED_MODULE_0__.className, elSectionListItems: '.section-list-items', elItemClone: '.section-item.clone', elSectionItem: '.section-item', elBtnSelectItemType: '.lp-btn-select-item-type', elAddItemTypeClone: '.lp-add-item-type.clone', elSectionActions: '.section-actions', elAddItemType: '.lp-add-item-type', elAddItemTypeTitleInput: '.lp-add-item-type-title-input', elBtnAddItemCancel: '.lp-btn-add-item-cancel', elBtnAddItem: '.lp-btn-add-item', elItemTitleInput: '.lp-item-title-input', elBtnUpdateItemTitle: '.lp-btn-update-item-title', elBtnCancelUpdateTitle: '.lp-btn-cancel-update-item-title', elBtnDeleteItem: '.lp-btn-delete-item', elBtnShowPopupItemsToSelect: '.lp-btn-show-popup-items-to-select', elPopupItemsToSelectClone: '.lp-popup-items-to-select.clone', elPopupItemsToSelect: '.lp-popup-items-to-select', elSelectItem: '.lp-select-item', elListItemsWrap: '.list-items-wrap', elListItems: '.list-items', elBtnAddItemsSelected: '.lp-btn-add-items-selected', elBtnCountItemsSelected: '.lp-btn-count-items-selected', elBtnBackListItems: '.lp-btn-back-to-select-items', elHeaderCountItemSelected: '.header-count-items-selected', elListItemsSelected: '.list-items-selected', elItemSelectedClone: '.li-item-selected.clone', elItemSelected: '.li-item-selected', elBtnSetPreviewItem: '.lp-btn-set-preview-item' }; let { courseId, elCurriculumSections, showToast, lpUtils, updateCountItems } = _share_js__WEBPACK_IMPORTED_MODULE_0__; const idUrlHandle = 'edit-course-curriculum'; const init = () => { ({ courseId, elCurriculumSections, showToast, lpUtils, updateCountItems } = _share_js__WEBPACK_IMPORTED_MODULE_0__); }; // Add item type const addItemType = (e, target) => { const elBtnSelectItemType = target.closest(`${className.elBtnSelectItemType}`); if (!elBtnSelectItemType) { return; } const itemType = elBtnSelectItemType.dataset.itemType; const itemPlaceholder = elBtnSelectItemType.dataset.placeholder; const itemBtnAddText = elBtnSelectItemType.dataset.buttonAddText; const elSection = elBtnSelectItemType.closest(`${className.elSection}`); const elSectionActions = elSection.querySelector(`${className.elSectionActions}`); // Insert input item type to add const elAddItemTypeClone = elSectionActions.querySelector(`${className.elAddItemTypeClone}`); const elNewItemByType = elAddItemTypeClone.cloneNode(true); const elAddItemTypeInput = elNewItemByType.querySelector(`${className.elAddItemTypeTitleInput}`); const elBtnAddItem = elNewItemByType.querySelector(`${className.elBtnAddItem}`); elNewItemByType.classList.remove('clone'); elNewItemByType.classList.add(itemType); lpUtils.lpShowHideEl(elNewItemByType, 1); elAddItemTypeInput.setAttribute('placeholder', itemPlaceholder); elAddItemTypeInput.dataset.itemType = itemType; elBtnAddItem.textContent = itemBtnAddText; elSectionActions.insertAdjacentElement('beforebegin', elNewItemByType); elAddItemTypeInput.focus(); }; // Cancel add item type const cancelAddItemType = (e, target) => { const elBtnAddItemCancel = target.closest(`${className.elBtnAddItemCancel}`); if (!elBtnAddItemCancel) { return; } const elAddItemType = target.closest(`${className.elAddItemType}`); if (elAddItemType) { elAddItemType.remove(); } }; // Add item to section const addItemToSection = (e, target) => { let canHandle = false; if (target.closest(`${className.elBtnAddItem}`)) { canHandle = true; } else if (target.closest(`${className.elAddItemTypeTitleInput}`) && e.key === 'Enter') { canHandle = true; } if (!canHandle) { return; } e.preventDefault(); const elAddItemType = target.closest(`${className.elAddItemType}`); const elSection = elAddItemType.closest(`${className.elSection}`); const sectionId = elSection.dataset.sectionId; const elAddItemTypeTitleInput = elAddItemType.querySelector(`${className.elAddItemTypeTitleInput}`); const titleValue = elAddItemTypeTitleInput.value.trim(); const typeValue = elAddItemTypeTitleInput.dataset.itemType; const message = elAddItemTypeTitleInput.dataset.messEmptyTitle; if (titleValue.length === 0) { showToast(message, 'error'); return; } // Clone new section item const elItemClone = elSection.querySelector(`${className.elItemClone}`); const elItemNew = elItemClone.cloneNode(true); const elItemTitleInput = elItemNew.querySelector(`${className.elItemTitleInput}`); elItemNew.classList.remove('clone'); elItemNew.classList.add(typeValue); elItemNew.dataset.itemType = typeValue; lpUtils.lpShowHideEl(elItemNew, 1); lpUtils.lpSetLoadingEl(elItemNew, 1); elItemTitleInput.value = titleValue; elItemTitleInput.dataset.old = titleValue; elItemClone.insertAdjacentElement('beforebegin', elItemNew); elAddItemType.remove(); // Call ajax to add item to section const callBack = { success: response => { const { message, status, data } = response; showToast(message, status); if (status === 'error') { elItemNew.remove(); } else if (status === 'success') { const { section_item, item_link } = data || {}; elItemNew.dataset.itemId = section_item.item_id || 0; elItemNew.querySelector('.edit-link').setAttribute('href', item_link || ''); } }, error: error => { showToast(error, 'error'); elItemNew.remove(); }, completed: () => { lpUtils.lpSetLoadingEl(elItemNew, 0); updateCountItems(elSection); } }; const dataSend = { course_id: courseId, action: 'create_item_add_to_section', section_id: sectionId, item_title: titleValue, item_type: typeValue, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); }; // Typing in title input const changeTitle = (e, target) => { const elItemTitleInput = target.closest(`${className.elItemTitleInput}`); if (!elItemTitleInput) { return; } const elSectionItem = elItemTitleInput.closest(`${className.elSectionItem}`); if (!elSectionItem) { return; } const titleValue = elItemTitleInput.value.trim(); const titleValueOld = elItemTitleInput.dataset.old || ''; if (titleValue === titleValueOld) { elSectionItem.classList.remove('editing'); } else { elSectionItem.classList.add('editing'); } }; // Focus in item title input const focusTitleInput = (e, target, isFocus = true) => { const elItemTitleInput = target.closest(`${className.elItemTitleInput}`); if (!elItemTitleInput) { return; } const elSectionItem = elItemTitleInput.closest(`${className.elSectionItem}`); if (!elSectionItem) { return; } if (isFocus) { elSectionItem.classList.add('focus'); } else { elSectionItem.classList.remove('focus'); } }; const changeTitleAddNew = (e, target) => { const elAddItemTypeTitleInput = target.closest(`${className.elAddItemTypeTitleInput}`); if (!elAddItemTypeTitleInput) { return; } const elAddItemType = elAddItemTypeTitleInput.closest(`${className.elAddItemType}`); if (!elAddItemType) { return; } const elBtnAddItem = elAddItemType.querySelector(`${className.elBtnAddItem}`); if (!elBtnAddItem) { return; } const titleValue = elAddItemTypeTitleInput.value.trim(); if (titleValue.length === 0) { elBtnAddItem.classList.remove('active'); } else { elBtnAddItem.classList.add('active'); } }; // Update item title const updateTitle = (e, target) => { let canHandle = false; if (target.closest(`${className.elBtnUpdateItemTitle}`)) { canHandle = true; } else if (target.closest(`${className.elItemTitleInput}`) && e.key === 'Enter') { canHandle = true; } if (!canHandle) { return; } e.preventDefault(); const elSectionItem = target.closest(`${className.elSectionItem}`); if (!elSectionItem) { return; } const elSection = elSectionItem.closest(`${className.elSection}`); if (!elSection) { return; } const elItemTitleInput = elSectionItem.querySelector(`${className.elItemTitleInput}`); if (!elItemTitleInput) { return; } const itemId = elSectionItem.dataset.itemId; const itemType = elSectionItem.dataset.itemType; const itemTitleValue = elItemTitleInput.value.trim(); const titleOld = elItemTitleInput.dataset.old; const message = elItemTitleInput.dataset.messEmptyTitle; if (itemTitleValue.length === 0) { showToast(message, 'error'); return; } if (itemTitleValue === titleOld) { return; } // Un-focus input item title elItemTitleInput.blur(); // show loading lpUtils.lpSetLoadingEl(elSectionItem, 1); // Call ajax to update item title const callBack = { success: response => { const { message, status } = response; if (status === 'success') { elItemTitleInput.dataset.old = itemTitleValue; // Update value input } else { elItemTitleInput.value = titleOld; } showToast(message, status); }, error: error => { showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(elSectionItem, 0); elSectionItem.classList.remove('editing'); // Remove editing class } }; const dataSend = { course_id: courseId, action: 'update_item_of_section', section_id: elSection.dataset.sectionId, item_id: itemId, item_type: itemType, item_title: itemTitleValue, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); }; // Cancel update item title const cancelUpdateTitle = (e, target) => { const elBtnCancelUpdateTitle = target.closest(`${className.elBtnCancelUpdateTitle}`); if (!elBtnCancelUpdateTitle) { return; } const elSectionItem = elBtnCancelUpdateTitle.closest(`${className.elSectionItem}`); const elItemTitleInput = elSectionItem.querySelector(`${className.elItemTitleInput}`); elItemTitleInput.value = elItemTitleInput.dataset.old || ''; // Reset to old value elSectionItem.classList.remove('editing'); // Remove editing class }; // Delete item from section const deleteItem = (e, target) => { const elBtnDeleteItem = target.closest(`${className.elBtnDeleteItem}`); if (!elBtnDeleteItem) { return; } const elSectionItem = elBtnDeleteItem.closest(`${className.elSectionItem}`); if (!elSectionItem) { return; } const itemId = elSectionItem.dataset.itemId; const elSection = elSectionItem.closest(`${className.elSection}`); const sectionId = elSection.dataset.sectionId; sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().fire({ title: elBtnDeleteItem.dataset.title, text: elBtnDeleteItem.dataset.content, icon: 'warning', showCloseButton: true, showCancelButton: true, cancelButtonText: lpDataAdmin.i18n.cancel, confirmButtonText: lpDataAdmin.i18n.yes, reverseButtons: true }).then(result => { if (result.isConfirmed) { lpUtils.lpSetLoadingEl(elSectionItem, 1); // Call ajax to delete item from section const callBack = { success: response => { const { message, status } = response; showToast(message, status); if (status === 'success') { elSectionItem.remove(); } }, error: error => { showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(elSectionItem, 0); updateCountItems(elSection); } }; const dataSend = { course_id: courseId, action: 'delete_item_from_section', section_id: sectionId, item_id: itemId, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); } }); }; // Sortable items, can drop on multiple sections const sortAbleItem = () => { const elSectionListItems = elCurriculumSections.querySelectorAll(`${className.elSectionListItems}`); let itemIdChoose = 0; let elSectionChoose; let sectionIdChoose = 0; let sectionIdEnd = 0; let timeout; elSectionListItems.forEach(elItem => { new sortablejs__WEBPACK_IMPORTED_MODULE_2__["default"](elItem, { handle: '.drag', animation: 150, group: { name: 'shared' }, onEnd: evt => { const dataSectionsItems = []; const elItemDragged = evt.item; sectionIdEnd = elItemDragged.closest(`${className.elSection}`).dataset.sectionId; const dataSend = { course_id: courseId, args: { id_url: idUrlHandle } }; if (sectionIdChoose === sectionIdEnd) { // Update items position in the same section dataSend.action = 'update_items_position'; dataSend.section_id = sectionIdEnd; } else { // Update section id of item changed dataSend.action = 'update_item_section_and_position'; dataSend.item_id_change = itemIdChoose; dataSend.section_id_new_of_item = sectionIdEnd; dataSend.section_id_old_of_item = sectionIdChoose; } // Send list items position const section = elCurriculumSections.querySelector(`.section[data-section-id="${sectionIdEnd}"]`); const items = section.querySelectorAll(`${className.elSectionItem}`); items.forEach(elItem => { const itemId = parseInt(elItem.dataset.itemId || 0); if (itemId === 0) { return; } dataSectionsItems.push(itemId); }); dataSend.items_position = dataSectionsItems; // Call ajax to update items position const callBack = { success: response => { const { message, status } = response; showToast(message, status); }, error: error => { showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(elItemDragged, 0); updateCountItems(section); if (sectionIdChoose !== sectionIdEnd) { updateCountItems(elSectionChoose); } } }; /*clearTimeout( timeout ); timeout = setTimeout( () => { lpUtils.lpSetLoadingEl( elItemDragged, 1 ); window.lpAJAXG.fetchAJAX( dataSend, callBack ); }, 1000 );*/ lpUtils.lpSetLoadingEl(elItemDragged, 1); window.lpAJAXG.fetchAJAX(dataSend, callBack); }, onMove: evt => { //clearTimeout( timeout ); }, onChoose: evt => { const elChooseItem = evt.item; itemIdChoose = elChooseItem.dataset.itemId; elSectionChoose = elChooseItem.closest(`${className.elSection}`); sectionIdChoose = elSectionChoose.dataset.sectionId; }, onUpdate: evt => {} }); }); }; let sectionIdSelected; let elPopupSelectItems; // Show popup items to select const showPopupItemsToSelect = (e, target) => { const elBtnShowPopupItemsToSelect = target.closest(`${className.elBtnShowPopupItemsToSelect}`); if (!elBtnShowPopupItemsToSelect) { return; } const elSection = elBtnShowPopupItemsToSelect.closest(`${className.elSection}`); sectionIdSelected = elSection.dataset.sectionId; const elPopupItemsToSelectClone = document.querySelector(`${className.elPopupItemsToSelectClone}`); elPopupSelectItems = elPopupItemsToSelectClone.cloneNode(true); elPopupSelectItems.classList.remove('clone'); lpUtils.lpShowHideEl(elPopupSelectItems, 1); sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().fire({ html: elPopupSelectItems, showConfirmButton: false, showCloseButton: true, width: '60%', customClass: { popup: 'lp-select-items-popup', htmlContainer: 'lp-select-items-html-container', container: 'lp-select-items-container' }, willOpen: () => { // Trigger tab lesson to be active and call AJAX load items const tabLesson = elPopupSelectItems.querySelector('li[data-type="lp_lesson"]'); tabLesson.click(); } }).then(result => { if (result.isDismissed) {} }); }; // Choose tab items type const chooseTabItemsType = (e, target) => { const elTabType = target.closest('.tab'); if (!elTabType) { return; } e.preventDefault(); const elTabs = elTabType.closest('.tabs'); if (!elTabs) { return; } const elSelectItemsToAdd = elTabs.closest(`${className.elPopupItemsToSelect}`); const elInputSearch = elSelectItemsToAdd.querySelector('.lp-search-title-item'); const itemType = elTabType.dataset.type; const elTabLis = elTabs.querySelectorAll('.tab'); elTabLis.forEach(elTabLi => { if (elTabLi.classList.contains('active')) { elTabLi.classList.remove('active'); } }); elTabType.classList.add('active'); // Reset search input elInputSearch.value = ''; const elLPTarget = elSelectItemsToAdd.querySelector(`${className.LPTarget}`); const dataSend = window.lpAJAXG.getDataSetCurrent(elLPTarget); dataSend.args.item_type = itemType; dataSend.args.paged = 1; dataSend.args.item_selecting = itemsSelectedData || []; window.lpAJAXG.setDataSetCurrent(elLPTarget, dataSend); // Show loading window.lpAJAXG.showHideLoading(elLPTarget, 1); // End window.lpAJAXG.fetchAJAX(dataSend, { success: response => { const { data } = response; elLPTarget.innerHTML = data.content || ''; }, error: error => { showToast(error, 'error'); }, completed: () => { window.lpAJAXG.showHideLoading(elLPTarget, 0); // Show button add if there are items selected watchItemsSelectedDataChange(); } }); }; let itemsSelectedData = []; // Choice items to add list items selected before adding to section const selectItemsFromList = (e, target) => { const elItemAttend = target.closest(`${className.elSelectItem}`); if (!elItemAttend) { return; } const elInput = elItemAttend.querySelector('input[type="checkbox"]'); if (target.tagName !== 'INPUT') { elInput.click(); return; } const elUl = elItemAttend.closest(`${className.elListItems}`); if (!elUl) { return; } const itemSelected = { item_id: elInput.value, item_type: elInput.dataset.type || '', item_title: elInput.dataset.title || '', item_edit_link: elInput.dataset.editLink || '' }; if (elInput.checked) { const exists = itemsSelectedData.some(item => item.item_id === itemSelected.item_id); if (!exists) { itemsSelectedData.push(itemSelected); } } else { const index = itemsSelectedData.findIndex(item => item.item_id === itemSelected.item_id); if (index !== -1) { itemsSelectedData.splice(index, 1); } } watchItemsSelectedDataChange(); }; // Search title item let timeSearchTitleItem; const searchTitleItemToSelect = (e, target) => { const elInputSearch = target.closest('.lp-search-title-item'); if (!elInputSearch) { return; } const elPopupItemsToSelect = elInputSearch.closest(`${className.elPopupItemsToSelect}`); if (!elPopupItemsToSelect) { return; } const elLPTarget = elPopupItemsToSelect.querySelector(`${className.LPTarget}`); clearTimeout(timeSearchTitleItem); timeSearchTitleItem = setTimeout(() => { const dataSet = window.lpAJAXG.getDataSetCurrent(elLPTarget); dataSet.args.search_title = elInputSearch.value.trim(); dataSet.args.item_selecting = itemsSelectedData; // Show loading window.lpAJAXG.showHideLoading(elLPTarget, 1); window.lpAJAXG.fetchAJAX(dataSet, { success: response => { const { data } = response; elLPTarget.innerHTML = data.content || ''; }, error: error => { showToast(error, 'error'); }, completed: () => { window.lpAJAXG.showHideLoading(elLPTarget, 0); } }); }, 1000); }; // Show list of items, to choose items to add to section const showItemsSelected = (e, target) => { const elBtnCountItemsSelected = target.closest(`${className.elBtnCountItemsSelected}`); if (!elBtnCountItemsSelected) { return; } const elParent = elBtnCountItemsSelected.closest(`${className.elPopupItemsToSelect}`); if (!elParent) { return; } const elBtnBack = elParent.querySelector(`${className.elBtnBackListItems}`); const elTabs = elParent.querySelector('.tabs'); const elListItemsWrap = elParent.querySelector(`${className.elListItemsWrap}`); const elHeaderItemsSelected = elParent.querySelector(`${className.elHeaderCountItemSelected}`); const elListItemsSelected = elParent.querySelector(`${className.elListItemsSelected}`); const elItemClone = elListItemsSelected.querySelector(`${className.elItemSelectedClone}`); elHeaderItemsSelected.innerHTML = elBtnCountItemsSelected.innerHTML; lpUtils.lpShowHideEl(elListItemsWrap, 0); lpUtils.lpShowHideEl(elBtnCountItemsSelected, 0); lpUtils.lpShowHideEl(elTabs, 0); lpUtils.lpShowHideEl(elBtnBack, 1); lpUtils.lpShowHideEl(elHeaderItemsSelected, 1); lpUtils.lpShowHideEl(elListItemsSelected, 1); elListItemsSelected.querySelectorAll(`${className.elItemSelected}:not(.clone)`).forEach(elItem => { elItem.remove(); }); itemsSelectedData.forEach(item => { const elItemSelected = elItemClone.cloneNode(true); elItemSelected.classList.remove('clone'); elItemSelected.dataset.id = item.item_id; elItemSelected.dataset.type = item.item_type || ''; elItemSelected.querySelector('.item-title').textContent = item.item_title || ''; elItemSelected.querySelector('.item-id').textContent = item.item_id || ''; elItemSelected.querySelector('.item-type').textContent = item.item_type || ''; lpUtils.lpShowHideEl(elItemSelected, 1); elItemClone.insertAdjacentElement('beforebegin', elItemSelected); }); }; // Back to list of items const backToSelectItems = (e, target) => { const elBtnBack = target.closest(`${className.elBtnBackListItems}`); if (!elBtnBack) { return; } const elParent = elBtnBack.closest(`${className.elPopupItemsToSelect}`); const elBtnCountItemsSelected = elParent.querySelector(`${className.elBtnCountItemsSelected}`); const elTabs = elParent.querySelector('.tabs'); const elListItemsWrap = elParent.querySelector(`${className.elListItemsWrap}`); const elHeaderCountItemSelected = elParent.querySelector(`${className.elHeaderCountItemSelected}`); const elListItemsSelected = elParent.querySelector(`${className.elListItemsSelected}`); lpUtils.lpShowHideEl(elBtnCountItemsSelected, 1); lpUtils.lpShowHideEl(elListItemsWrap, 1); lpUtils.lpShowHideEl(elTabs, 1); lpUtils.lpShowHideEl(elBtnBack, 0); lpUtils.lpShowHideEl(elHeaderCountItemSelected, 0); lpUtils.lpShowHideEl(elListItemsSelected, 0); }; // Remove item selected from list items selected const removeItemSelected = (e, target) => { const elRemoveItemSelected = target.closest(`${className.elItemSelected}`); if (!elRemoveItemSelected) { return; } const itemRemove = { item_id: elRemoveItemSelected.dataset.id, item_type: elRemoveItemSelected.dataset.type }; const index = itemsSelectedData.findIndex(item => item.item_id === itemRemove.item_id); if (index !== -1) { itemsSelectedData.splice(index, 1); } elRemoveItemSelected.remove(); watchItemsSelectedDataChange(); }; // Watch items selected when data change const watchItemsSelectedDataChange = () => { if (!elPopupSelectItems) { return; } // Update count items selected, disable/enable buttons const elBtnAddItemsSelected = elPopupSelectItems.querySelector(`${className.elBtnAddItemsSelected}`); const elBtnCountItemsSelected = elPopupSelectItems.querySelector(`${className.elBtnCountItemsSelected}`); const elSpanCount = elBtnCountItemsSelected.querySelector('span'); const elHeaderCount = elPopupSelectItems.querySelector(`${className.elHeaderCountItemSelected}`); if (itemsSelectedData.length !== 0) { elBtnCountItemsSelected.disabled = false; elBtnAddItemsSelected.disabled = false; elSpanCount.textContent = `(${itemsSelectedData.length})`; elHeaderCount.innerHTML = elBtnCountItemsSelected.innerHTML; } else { elBtnCountItemsSelected.disabled = true; elBtnAddItemsSelected.disabled = true; elSpanCount.textContent = ''; elHeaderCount.textContent = ''; } const elListItems = elPopupSelectItems.querySelector(`${className.elListItems}`); const elInputs = elListItems.querySelectorAll('input[type="checkbox"]'); elInputs.forEach(elInputItem => { const itemSelected = { item_id: elInputItem.value, item_type: elInputItem.dataset.type || '', item_title: elInputItem.dataset.title || '' }; const exists = itemsSelectedData.some(item => item.item_id === itemSelected.item_id); elInputItem.checked = exists; }); }; // Add items selected to section const addItemsSelectedToSection = (e, target) => { const elBtnAddItems = target.closest(`${className.elBtnAddItemsSelected}`); if (!elBtnAddItems) { return; } const elPopupItemsToSelect = elBtnAddItems.closest(`${className.elPopupItemsToSelect}`); if (!elPopupItemsToSelect) { return; } const elSection = document.querySelector(`.section[data-section-id="${sectionIdSelected}"]`); const elItemClone = elSection.querySelector(`${className.elItemClone}`); itemsSelectedData.forEach(item => { const elItemNew = elItemClone.cloneNode(true); const elInputTitleNew = elItemNew.querySelector(`${className.elItemTitleInput}`); elItemNew.dataset.itemId = item.item_id; elItemNew.classList.add(item.item_type); elItemNew.classList.remove('clone'); elItemNew.dataset.itemType = item.item_type; elItemNew.querySelector('.edit-link').setAttribute('href', item.item_edit_link || ''); elInputTitleNew.value = item.item_title || ''; lpUtils.lpSetLoadingEl(elItemNew, 1); lpUtils.lpShowHideEl(elItemNew, 1); elItemClone.insertAdjacentElement('beforebegin', elItemNew); }); sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().close(); const dataSend = { course_id: courseId, action: 'add_items_to_section', section_id: sectionIdSelected, items: itemsSelectedData, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, { success: response => { const { message, status } = response; showToast(message, status); if (status === 'error') { itemsSelectedData.forEach(item => { const elItemAdded = elSection.querySelector(`${className.elSectionItem}[data-item-id="${item.item_id}"]`); if (elItemAdded) { elItemAdded.remove(); } }); } }, error: error => { showToast(error, 'error'); }, completed: () => { itemsSelectedData.forEach(item => { const elItemAdded = elSection.querySelector(`${className.elSectionItem}[data-item-id="${item.item_id}"]`); lpUtils.lpSetLoadingEl(elItemAdded, 0); }); itemsSelectedData = []; // Clear selected items data updateCountItems(elSection); } }); }; // Enable/disable preview item const updatePreviewItem = (e, target) => { const elBtnSetPreviewItem = target.closest(`${className.elBtnSetPreviewItem}`); if (!elBtnSetPreviewItem) { return; } const elSectionItem = elBtnSetPreviewItem.closest(`${className.elSectionItem}`); if (!elSectionItem) { return; } const icon = elBtnSetPreviewItem.querySelector('a'); icon.classList.toggle('lp-icon-eye'); icon.classList.toggle('lp-icon-eye-slash'); const enablePreview = !icon.classList.contains('lp-icon-eye-slash'); const itemId = elSectionItem.dataset.itemId; const itemType = elSectionItem.dataset.itemType; lpUtils.lpSetLoadingEl(elSectionItem, 1); // Call ajax to update item preview const callBack = { success: response => { const { message, status } = response; showToast(message, status); if (status === 'error') { icon.classList.toggle('lp-icon-eye'); icon.classList.toggle('lp-icon-eye-slash'); } }, error: error => { showToast(error, 'error'); icon.classList.toggle('lp-icon-eye'); icon.classList.toggle('lp-icon-eye-slash'); }, completed: () => { lpUtils.lpSetLoadingEl(elSectionItem, 0); } }; const dataSend = { course_id: courseId, action: 'update_item_preview', item_id: itemId, item_type: itemType, enable_preview: enablePreview ? 1 : 0, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); }; /***/ }), /***/ "./assets/src/js/admin/edit-curriculum/edit-section.js": /*!*************************************************************!*\ !*** ./assets/src/js/admin/edit-curriculum/edit-section.js ***! \*************************************************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ addSection: () => (/* binding */ addSection), /* harmony export */ cancelSectionDescription: () => (/* binding */ cancelSectionDescription), /* harmony export */ cancelSectionTitle: () => (/* binding */ cancelSectionTitle), /* harmony export */ changeDescription: () => (/* binding */ changeDescription), /* harmony export */ changeTitle: () => (/* binding */ changeTitle), /* harmony export */ changeTitleBeforeAdd: () => (/* binding */ changeTitleBeforeAdd), /* harmony export */ deleteSection: () => (/* binding */ deleteSection), /* harmony export */ focusTitleInput: () => (/* binding */ focusTitleInput), /* harmony export */ focusTitleNewInput: () => (/* binding */ focusTitleNewInput), /* harmony export */ init: () => (/* binding */ init), /* harmony export */ setFocusTitleInput: () => (/* binding */ setFocusTitleInput), /* harmony export */ sortAbleSection: () => (/* binding */ sortAbleSection), /* harmony export */ toggleSection: () => (/* binding */ toggleSection), /* harmony export */ updateSectionDescription: () => (/* binding */ updateSectionDescription), /* harmony export */ updateSectionTitle: () => (/* binding */ updateSectionTitle) /* harmony export */ }); /* harmony import */ var _share_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./share.js */ "./assets/src/js/admin/edit-curriculum/share.js"); /* harmony import */ var sweetalert2__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! sweetalert2 */ "./node_modules/sweetalert2/dist/sweetalert2.all.js"); /* harmony import */ var sweetalert2__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(sweetalert2__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var sortablejs__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! sortablejs */ "./node_modules/sortablejs/modular/sortable.esm.js"); /** * Edit Section Script on Curriculum * * @since 4.2.8.6 * @version 1.0.2 */ const className = { ..._share_js__WEBPACK_IMPORTED_MODULE_0__.className, elDivAddNewSection: '.add-new-section', elSectionClone: '.section.clone', elSectionTitleNewInput: '.lp-section-title-new-input', elSectionTitleInput: '.lp-section-title-input', etBtnEditTitle: '.lp-btn-edit-section-title', elSectionDesInput: '.lp-section-description-input', elBtnAddSection: '.lp-btn-add-section', elBtnUpdateTitle: '.lp-btn-update-section-title', elBtnUpdateDes: '.lp-btn-update-section-description', elBtnCancelUpdateTitle: '.lp-btn-cancel-update-section-title', elBtnCancelUpdateDes: '.lp-btn-cancel-update-section-description', elBtnDeleteSection: '.lp-btn-delete-section', elSectionDesc: '.section-description', elSectionToggle: '.section-toggle', elCountSections: '.count-sections' }; let { courseId, elEditCurriculum, elCurriculumSections, showToast, lpUtils, updateCountItems } = _share_js__WEBPACK_IMPORTED_MODULE_0__; const idUrlHandle = 'edit-course-curriculum'; const init = () => { ({ courseId, elEditCurriculum, elCurriculumSections, showToast, lpUtils, updateCountItems } = _share_js__WEBPACK_IMPORTED_MODULE_0__); }; // Typing in new section title input const changeTitleBeforeAdd = (e, target) => { const elSectionTitleNewInput = target.closest(`${className.elSectionTitleNewInput}`); if (!elSectionTitleNewInput) { return; } const elAddNewSection = elSectionTitleNewInput.closest(`${className.elDivAddNewSection}`); if (!elAddNewSection) { return; } const elBtnAddSection = elAddNewSection.querySelector(`${className.elBtnAddSection}`); const titleValue = elSectionTitleNewInput.value.trim(); if (titleValue.length === 0) { elBtnAddSection.classList.remove('active'); delete _share_js__WEBPACK_IMPORTED_MODULE_0__.hasChange.titleNew; } else { elBtnAddSection.classList.add('active'); _share_js__WEBPACK_IMPORTED_MODULE_0__.hasChange.titleNew = 1; } }; // Focus on new section title input const focusTitleNewInput = (e, target, focusIn = true) => { const elSectionTitleNewInput = target.closest(`${className.elSectionTitleNewInput}`); if (!elSectionTitleNewInput) { return; } const elAddNewSection = elSectionTitleNewInput.closest(`${className.elDivAddNewSection}`); if (!elAddNewSection) { return; } if (focusIn) { elAddNewSection.classList.add('focus'); } else { elAddNewSection.classList.remove('focus'); } }; // Add new section const addSection = (e, target) => { let canHandle = false; if (target.closest(`${className.elBtnAddSection}`)) { canHandle = true; } else if (target.closest(`${className.elSectionTitleNewInput}`) && e.key === 'Enter') { canHandle = true; } if (!canHandle) { return; } const elAddNewSection = target.closest(`${className.elDivAddNewSection}`); if (!elAddNewSection) { return; } e.preventDefault(); const elSectionTitleNewInput = elAddNewSection.querySelector(`${className.elSectionTitleNewInput}`); const titleValue = elSectionTitleNewInput.value.trim(); const message = elSectionTitleNewInput.dataset.messEmptyTitle; if (titleValue.length === 0) { showToast(message, 'error'); return; } // Clear input after add elSectionTitleNewInput.value = ''; elSectionTitleNewInput.blur(); // Add and set data for new section const elSectionClone = elCurriculumSections.querySelector(`${className.elSectionClone}`); const newSection = elSectionClone.cloneNode(true); newSection.classList.remove('clone'); lpUtils.lpShowHideEl(newSection, 1); lpUtils.lpSetLoadingEl(newSection, 1); const elSectionTitleInput = newSection.querySelector(`${className.elSectionTitleInput}`); elSectionTitleInput.value = titleValue; elCurriculumSections.insertAdjacentElement('beforeend', newSection); // End // Call ajax to add new section const callBack = { success: response => { const { message, status, data } = response; if (status === 'error') { newSection.remove(); } else if (status === 'success') { const { section } = data; newSection.dataset.sectionId = section.section_id || ''; if (_share_js__WEBPACK_IMPORTED_MODULE_0__.sortAbleItem) { _share_js__WEBPACK_IMPORTED_MODULE_0__.sortAbleItem(); } } showToast(message, status); }, error: error => { newSection.remove(); showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(newSection, 0); newSection.classList.remove(`${className.elCollapse}`); const elSectionDesInput = newSection.querySelector(`${className.elSectionDesInput}`); elSectionDesInput.focus(); updateCountSections(); delete _share_js__WEBPACK_IMPORTED_MODULE_0__.hasChange.titleNew; } }; const dataSend = { action: 'add_section', course_id: courseId, section_name: titleValue, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); }; // Delete section const deleteSection = (e, target) => { const elBtnDeleteSection = target.closest(`${className.elBtnDeleteSection}`); if (!elBtnDeleteSection) { return; } sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().fire({ title: elBtnDeleteSection.dataset.title, text: elBtnDeleteSection.dataset.content, icon: 'warning', showCloseButton: true, showCancelButton: true, cancelButtonText: lpDataAdmin.i18n.cancel, confirmButtonText: lpDataAdmin.i18n.yes, reverseButtons: true }).then(result => { if (result.isConfirmed) { const elSection = elBtnDeleteSection.closest('.section'); const sectionId = elSection.dataset.sectionId; lpUtils.lpSetLoadingEl(elSection, 1); // Call ajax to delete section const callBack = { success: response => { const { message, status } = response; const { content } = response.data; showToast(message, status); }, error: error => { showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(elSection, 0); elSection.remove(); updateCountItems(elSection); updateCountSections(); } }; const dataSend = { action: 'delete_section', course_id: courseId, section_id: sectionId, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); } }); }; // Focus on new section title input const focusTitleInput = (e, target, focusIn = true) => { const elSectionTitleInput = target.closest(`${className.elSectionTitleInput}`); if (!elSectionTitleInput) { return; } const elSection = elSectionTitleInput.closest(`${className.elSection}`); if (!elSection) { return; } if (focusIn) { elSection.classList.add('focus'); } else { elSection.classList.remove('focus'); } }; // Set focus on section title input const setFocusTitleInput = (e, target) => { const etBtnEditTitle = target.closest(`${className.etBtnEditTitle}`); if (!etBtnEditTitle) { return; } const elSection = etBtnEditTitle.closest(`${className.elSection}`); if (!elSection) { return; } const elSectionTitleInput = elSection.querySelector(`${className.elSectionTitleInput}`); elSectionTitleInput.setSelectionRange(elSectionTitleInput.value.length, elSectionTitleInput.value.length); elSectionTitleInput.focus(); }; // Typing in description input const changeTitle = (e, target) => { const elSectionTitleInput = target.closest(`${className.elSectionTitleInput}`); if (!elSectionTitleInput) { return; } const elSection = elSectionTitleInput.closest(`${className.elSection}`); const titleValue = elSectionTitleInput.value.trim(); const titleValueOld = elSectionTitleInput.dataset.old || ''; if (titleValue === titleValueOld) { elSection.classList.remove('editing'); delete _share_js__WEBPACK_IMPORTED_MODULE_0__.hasChange.title; } else { elSection.classList.add('editing'); _share_js__WEBPACK_IMPORTED_MODULE_0__.hasChange.title = 1; } }; // Update section title to server const updateSectionTitle = (e, target) => { let canHandle = false; if (target.closest(`${className.elBtnUpdateTitle}`)) { canHandle = true; } else if (target.closest(`${className.elSectionTitleInput}`) && e.key === 'Enter') { canHandle = true; } if (!canHandle) { return; } e.preventDefault(); const elSection = target.closest(`${className.elSection}`); if (!elSection) { return; } const elSectionTitleInput = elSection.querySelector(`${className.elSectionTitleInput}`); if (!elSectionTitleInput) { return; } const sectionId = elSection.dataset.sectionId; const titleValue = elSectionTitleInput.value.trim(); const titleValueOld = elSectionTitleInput.dataset.old || ''; const message = elSectionTitleInput.dataset.messEmptyTitle; if (titleValue.length === 0) { showToast(message, 'error'); return; } if (titleValue === titleValueOld) { return; } elSectionTitleInput.blur(); lpUtils.lpSetLoadingEl(elSection, 1); // Call ajax to update section title const callBack = { success: response => { const { message, status } = response; showToast(message, status); if (status === 'success') { elSectionTitleInput.dataset.old = titleValue; } }, error: error => { showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(elSection, 0); elSection.classList.remove('editing'); delete _share_js__WEBPACK_IMPORTED_MODULE_0__.hasChange.title; } }; const dataSend = { action: 'update_section', course_id: courseId, section_id: sectionId, section_name: titleValue, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); }; // Cancel updating section description const cancelSectionTitle = (e, target) => { const elBtnCancelUpdateTitle = target.closest(`${className.elBtnCancelUpdateTitle}`); if (!elBtnCancelUpdateTitle) { return; } const elSection = elBtnCancelUpdateTitle.closest(`${className.elSection}`); const elSectionTitleInput = elSection.querySelector(`${className.elSectionTitleInput}`); elSectionTitleInput.value = elSectionTitleInput.dataset.old || ''; // Reset to old value elSection.classList.remove('editing'); // Remove editing class delete _share_js__WEBPACK_IMPORTED_MODULE_0__.hasChange.title; }; // Update section description to server const updateSectionDescription = (e, target) => { let canHandle = false; if (target.closest(`${className.elBtnUpdateDes}`)) { canHandle = true; } else if (target.closest(`${className.elSectionDesInput}`) && e.key === 'Enter') { canHandle = true; } if (!canHandle) { return; } e.preventDefault(); const elSectionDesc = target.closest(`${className.elSectionDesc}`); if (!elSectionDesc) { return; } const elSectionDesInput = elSectionDesc.querySelector(`${className.elSectionDesInput}`); if (!elSectionDesInput) { return; } const elSection = elSectionDesInput.closest(`${className.elSection}`); const sectionId = elSection.dataset.sectionId; const descValue = elSectionDesInput.value.trim(); const descValueOld = elSectionDesInput.dataset.old || ''; if (descValue === descValueOld) { return; } lpUtils.lpSetLoadingEl(elSection, 1); // Call ajax to update section description const callBack = { success: response => { const { message, status } = response; showToast(message, status); }, error: error => { showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(elSection, 0); const elSectionDesc = elSectionDesInput.closest(`${className.elSectionDesc}`); elSectionDesc.classList.remove('editing'); elSectionDesInput.dataset.old = descValue; // Update old value } }; const dataSend = { action: 'update_section', course_id: courseId, section_id: sectionId, section_description: descValue, args: { id_url: idUrlHandle } }; window.lpAJAXG.fetchAJAX(dataSend, callBack); }; // Cancel updating section description const cancelSectionDescription = (e, target) => { const elBtnCancelUpdateDes = target.closest(`${className.elBtnCancelUpdateDes}`); if (!elBtnCancelUpdateDes) { return; } const elSectionDesc = elBtnCancelUpdateDes.closest(`${className.elSectionDesc}`); const elSectionDesInput = elSectionDesc.querySelector(`${className.elSectionDesInput}`); elSectionDesInput.value = elSectionDesInput.dataset.old || ''; // Reset to old value elSectionDesc.classList.remove('editing'); // Remove editing class }; // Typing in description input const changeDescription = (e, target) => { const elSectionDesInput = target.closest(`${className.elSectionDesInput}`); if (!elSectionDesInput) { return; } const elSectionDesc = elSectionDesInput.closest(`${className.elSectionDesc}`); const descValue = elSectionDesInput.value.trim(); const descValueOld = elSectionDesInput.dataset.old || ''; if (descValue === descValueOld) { elSectionDesc.classList.remove('editing'); } else { elSectionDesc.classList.add('editing'); } }; // Toggle section const toggleSection = (e, target) => { const elSectionToggle = target.closest(`${className.elSectionToggle}`); if (!elSectionToggle) { return; } const elSection = elSectionToggle.closest(`${className.elSection}`); const elCurriculumSections = elSection.closest(`${className.elCurriculumSections}`); if (!elCurriculumSections) { return; } // Toggle section elSection.classList.toggle(`${className.elCollapse}`); // Check all sections collapsed checkAllSectionsCollapsed(); }; // Check if all sections are collapsed const checkAllSectionsCollapsed = () => { const elSections = elEditCurriculum.querySelectorAll(`${className.elSection}:not(.clone)`); const elToggleAllSections = elEditCurriculum.querySelector(`${className.elToggleAllSections}`); let isAllExpand = true; elSections.forEach(el => { if (el.classList.contains(`${className.elCollapse}`)) { isAllExpand = false; return false; // Break the loop } }); if (isAllExpand) { elToggleAllSections.classList.remove(`${className.elCollapse}`); } else { elToggleAllSections.classList.add(`${className.elCollapse}`); } }; // Sortable sections, drag and drop to change section position const sortAbleSection = () => { let isUpdateSectionPosition = 0; let timeout; new sortablejs__WEBPACK_IMPORTED_MODULE_2__["default"](elCurriculumSections, { handle: '.drag', animation: 150, onEnd: evt => { const target = evt.item; if (!isUpdateSectionPosition) { // No change in section position, do nothing return; } const elSection = target.closest(`${className.elSection}`); const elSections = elCurriculumSections.querySelectorAll(`${className.elSection}`); const sectionIds = []; elSections.forEach((elSection, index) => { const sectionId = elSection.dataset.sectionId; sectionIds.push(sectionId); }); // Call ajax to update section position const callBack = { success: response => { const { message, status } = response; showToast(message, status); }, error: error => { showToast(error, 'error'); }, completed: () => { lpUtils.lpSetLoadingEl(elSection, 0); isUpdateSectionPosition = 0; } }; const dataSend = { action: 'update_section_position', course_id: courseId, new_position: sectionIds, args: { id_url: idUrlHandle } }; clearTimeout(timeout); timeout = setTimeout(() => { lpUtils.lpSetLoadingEl(elSection, 1); window.lpAJAXG.fetchAJAX(dataSend, callBack); }, 1000); }, onMove: evt => { clearTimeout(timeout); }, onUpdate: evt => { isUpdateSectionPosition = 1; } }); }; // Update count sections, when add or delete section const updateCountSections = () => { const elCountSections = elEditCurriculum.querySelector(`${className.elCountSections}`); const elSections = elCurriculumSections.querySelectorAll(`${className.elSection}:not(.clone)`); const sectionsCount = elSections.length; elCountSections.dataset.count = sectionsCount; elCountSections.querySelector('.count').textContent = sectionsCount; }; /***/ }), /***/ "./assets/src/js/admin/edit-curriculum/share.js": /*!******************************************************!*\ !*** ./assets/src/js/admin/edit-curriculum/share.js ***! \******************************************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ className: () => (/* binding */ className), /* harmony export */ courseId: () => (/* binding */ courseId), /* harmony export */ elCurriculumSections: () => (/* binding */ elCurriculumSections), /* harmony export */ elEditCurriculum: () => (/* binding */ elEditCurriculum), /* harmony export */ hasChange: () => (/* binding */ hasChange), /* harmony export */ lpUtils: () => (/* reexport module object */ _utils_js__WEBPACK_IMPORTED_MODULE_0__), /* harmony export */ setVariable: () => (/* binding */ setVariable), /* harmony export */ setVariables: () => (/* binding */ setVariables), /* harmony export */ showToast: () => (/* binding */ showToast), /* harmony export */ sortAbleItem: () => (/* binding */ sortAbleItem), /* harmony export */ updateCountItems: () => (/* binding */ updateCountItems) /* harmony export */ }); /* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../utils.js */ "./assets/src/js/utils.js"); /* harmony import */ var toastify_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! toastify-js */ "./node_modules/toastify-js/src/toastify.js"); /* harmony import */ var toastify_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(toastify_js__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var toastify_js_src_toastify_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! toastify-js/src/toastify.css */ "./node_modules/toastify-js/src/toastify.css"); /** * Share variables and functions for the edit curriculum page. * * @since 4.2.8.6 * @version 1.0.1 */ let courseId; let elEditCurriculum; let elCurriculumSections; let updateCountItems; let sortAbleItem; let hasChange; const className = { idElEditCurriculum: '#lp-course-edit-curriculum', elCurriculumSections: '.curriculum-sections', elSection: '.section', elToggleAllSections: '.course-toggle-all-sections', elSectionItem: '.section-item', LPTarget: '.lp-target', elCollapse: 'lp-collapse' }; const argsToastify = { text: '', gravity: lpDataAdmin.toast.gravity, // `top` or `bottom` position: lpDataAdmin.toast.position, // `left`, `center` or `right` className: `${lpDataAdmin.toast.classPrefix}`, close: lpDataAdmin.toast.close == 1, stopOnFocus: lpDataAdmin.toast.stopOnFocus == 1, duration: lpDataAdmin.toast.duration }; const showToast = (message, status = 'success') => { const toastify = new (toastify_js__WEBPACK_IMPORTED_MODULE_1___default())({ ...argsToastify, text: message, className: `${lpDataAdmin.toast.classPrefix} ${status}` }); toastify.showToast(); }; const setVariables = variables => { ({ courseId, elEditCurriculum, elCurriculumSections, updateCountItems, hasChange } = variables); }; const setVariable = (variable, value) => { if (variable && value !== undefined) { switch (variable) { case 'sortAbleItem': sortAbleItem = value; break; } } }; /***/ }), /***/ "./assets/src/js/utils.js": /*!********************************!*\ !*** ./assets/src/js/utils.js ***! \********************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ getDataOfForm: () => (/* binding */ getDataOfForm), /* harmony export */ getFieldKeysOfForm: () => (/* binding */ getFieldKeysOfForm), /* harmony export */ listenElementCreated: () => (/* binding */ listenElementCreated), /* harmony export */ listenElementViewed: () => (/* binding */ listenElementViewed), /* harmony export */ lpAddQueryArgs: () => (/* binding */ lpAddQueryArgs), /* harmony export */ lpAjaxParseJsonOld: () => (/* binding */ lpAjaxParseJsonOld), /* harmony export */ lpClassName: () => (/* binding */ lpClassName), /* harmony export */ lpFetchAPI: () => (/* binding */ lpFetchAPI), /* harmony export */ lpGetCurrentURLNoParam: () => (/* binding */ lpGetCurrentURLNoParam), /* harmony export */ lpOnElementReady: () => (/* binding */ lpOnElementReady), /* harmony export */ lpSetLoadingEl: () => (/* binding */ lpSetLoadingEl), /* harmony export */ lpShowHideEl: () => (/* binding */ lpShowHideEl), /* harmony export */ mergeDataWithDatForm: () => (/* binding */ mergeDataWithDatForm), /* harmony export */ toggleCollapse: () => (/* binding */ toggleCollapse) /* harmony export */ }); /** * Utils functions * * @param url * @param data * @param functions * @since 4.2.5.1 * @version 1.0.4 */ const lpClassName = { hidden: 'lp-hidden', loading: 'loading', elCollapse: 'lp-collapse', elSectionToggle: '.lp-section-toggle', elTriggerToggle: '.lp-trigger-toggle' }; const lpFetchAPI = (url, data = {}, functions = {}) => { if ('function' === typeof functions.before) { functions.before(); } fetch(url, { method: 'GET', ...data }).then(response => response.json()).then(response => { if ('function' === typeof functions.success) { functions.success(response); } }).catch(err => { if ('function' === typeof functions.error) { functions.error(err); } }).finally(() => { if ('function' === typeof functions.completed) { functions.completed(); } }); }; /** * Get current URL without params. * * @since 4.2.5.1 */ const lpGetCurrentURLNoParam = () => { let currentUrl = window.location.href; const hasParams = currentUrl.includes('?'); if (hasParams) { currentUrl = currentUrl.split('?')[0]; } return currentUrl; }; const lpAddQueryArgs = (endpoint, args) => { const url = new URL(endpoint); Object.keys(args).forEach(arg => { url.searchParams.set(arg, args[arg]); }); return url; }; /** * Listen element viewed. * * @param el * @param callback * @since 4.2.5.8 */ const listenElementViewed = (el, callback) => { const observerSeeItem = new IntersectionObserver(function (entries) { for (const entry of entries) { if (entry.isIntersecting) { callback(entry); } } }); observerSeeItem.observe(el); }; /** * Listen element created. * * @param callback * @since 4.2.5.8 */ const listenElementCreated = callback => { const observerCreateItem = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { if (mutation.addedNodes) { mutation.addedNodes.forEach(function (node) { if (node.nodeType === 1) { callback(node); } }); } }); }); observerCreateItem.observe(document, { childList: true, subtree: true }); // End. }; /** * Listen element created. * * @param selector * @param callback * @since 4.2.7.1 */ const lpOnElementReady = (selector, callback) => { const element = document.querySelector(selector); if (element) { callback(element); return; } const observer = new MutationObserver((mutations, obs) => { const element = document.querySelector(selector); if (element) { obs.disconnect(); callback(element); } }); observer.observe(document.documentElement, { childList: true, subtree: true }); }; // Parse JSON from string with content include LP_AJAX_START. const lpAjaxParseJsonOld = data => { if (typeof data !== 'string') { return data; } const m = String.raw({ raw: data }).match(/<-- LP_AJAX_START -->(.*)<-- LP_AJAX_END -->/s); try { if (m) { data = JSON.parse(m[1].replace(/(?:\r\n|\r|\n)/g, '')); } else { data = JSON.parse(data); } } catch (e) { data = {}; } return data; }; // status 0: hide, 1: show const lpShowHideEl = (el, status = 0) => { if (!el) { return; } if (!status) { el.classList.add(lpClassName.hidden); } else { el.classList.remove(lpClassName.hidden); } }; // status 0: hide, 1: show const lpSetLoadingEl = (el, status) => { if (!el) { return; } if (!status) { el.classList.remove(lpClassName.loading); } else { el.classList.add(lpClassName.loading); } }; // Toggle collapse section const toggleCollapse = (e, target, elTriggerClassName = '', elsExclude = [], callback) => { if (!elTriggerClassName) { elTriggerClassName = lpClassName.elTriggerToggle; } // Exclude elements, which should not trigger the collapse toggle if (elsExclude && elsExclude.length > 0) { for (const elExclude of elsExclude) { if (target.closest(elExclude)) { return; } } } const elTrigger = target.closest(elTriggerClassName); if (!elTrigger) { return; } //console.log( 'elTrigger', elTrigger ); const elSectionToggle = elTrigger.closest(`${lpClassName.elSectionToggle}`); if (!elSectionToggle) { return; } elSectionToggle.classList.toggle(`${lpClassName.elCollapse}`); if ('function' === typeof callback) { callback(elSectionToggle); } }; // Get data of form const getDataOfForm = form => { const dataSend = {}; const formData = new FormData(form); for (const pair of formData.entries()) { const key = pair[0]; const value = formData.getAll(key); if (!dataSend.hasOwnProperty(key)) { dataSend[key] = value; } } return dataSend; }; // Get field keys of form const getFieldKeysOfForm = form => { const keys = []; const elements = form.elements; for (let i = 0; i < elements.length; i++) { const name = elements[i].name; if (name && !keys.includes(name)) { keys.push(name); } } return keys; }; // Merge data handle with data form. const mergeDataWithDatForm = (elForm, dataHandle) => { const dataForm = getDataOfForm(elForm); const keys = getFieldKeysOfForm(elForm); keys.forEach(key => { if (!dataForm.hasOwnProperty(key)) { delete dataHandle[key]; } else if (dataForm[key][0] === '') { delete dataForm[key]; delete dataHandle[key]; } }); dataHandle = { ...dataHandle, ...dataForm }; return dataHandle; }; /***/ }), /***/ "./node_modules/css-loader/dist/cjs.js!./node_modules/toastify-js/src/toastify.css": /*!*****************************************************************************************!*\ !*** ./node_modules/css-loader/dist/cjs.js!./node_modules/toastify-js/src/toastify.css ***! \*****************************************************************************************/ /***/ ((module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var _css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../css-loader/dist/runtime/sourceMaps.js */ "./node_modules/css-loader/dist/runtime/sourceMaps.js"); /* harmony import */ var _css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js"); /* harmony import */ var _css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__); // Imports var ___CSS_LOADER_EXPORT___ = _css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default())); // Module ___CSS_LOADER_EXPORT___.push([module.id, `/*! * Toastify js 1.12.0 * https://github.com/apvarun/toastify-js * @license MIT licensed * * Copyright (C) 2018 Varun A P */ .toastify { padding: 12px 20px; color: #ffffff; display: inline-block; box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3); background: -webkit-linear-gradient(315deg, #73a5ff, #5477f5); background: linear-gradient(135deg, #73a5ff, #5477f5); position: fixed; opacity: 0; transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); border-radius: 2px; cursor: pointer; text-decoration: none; max-width: calc(50% - 20px); z-index: 2147483647; } .toastify.on { opacity: 1; } .toast-close { background: transparent; border: 0; color: white; cursor: pointer; font-family: inherit; font-size: 1em; opacity: 0.4; padding: 0 5px; } .toastify-right { right: 15px; } .toastify-left { left: 15px; } .toastify-top { top: -150px; } .toastify-bottom { bottom: -150px; } .toastify-rounded { border-radius: 25px; } .toastify-avatar { width: 1.5em; height: 1.5em; margin: -7px 5px; border-radius: 2px; } .toastify-center { margin-left: auto; margin-right: auto; left: 0; right: 0; max-width: fit-content; max-width: -moz-fit-content; } @media only screen and (max-width: 360px) { .toastify-right, .toastify-left { margin-left: auto; margin-right: auto; left: 0; right: 0; max-width: fit-content; } } `, "",{"version":3,"sources":["webpack://./node_modules/toastify-js/src/toastify.css"],"names":[],"mappings":"AAAA;;;;;;EAME;;AAEF;IACI,kBAAkB;IAClB,cAAc;IACd,qBAAqB;IACrB,uFAAuF;IACvF,6DAA6D;IAC7D,qDAAqD;IACrD,eAAe;IACf,UAAU;IACV,wDAAwD;IACxD,kBAAkB;IAClB,eAAe;IACf,qBAAqB;IACrB,2BAA2B;IAC3B,mBAAmB;AACvB;;AAEA;IACI,UAAU;AACd;;AAEA;IACI,uBAAuB;IACvB,SAAS;IACT,YAAY;IACZ,eAAe;IACf,oBAAoB;IACpB,cAAc;IACd,YAAY;IACZ,cAAc;AAClB;;AAEA;IACI,WAAW;AACf;;AAEA;IACI,UAAU;AACd;;AAEA;IACI,WAAW;AACf;;AAEA;IACI,cAAc;AAClB;;AAEA;IACI,mBAAmB;AACvB;;AAEA;IACI,YAAY;IACZ,aAAa;IACb,gBAAgB;IAChB,kBAAkB;AACtB;;AAEA;IACI,iBAAiB;IACjB,kBAAkB;IAClB,OAAO;IACP,QAAQ;IACR,sBAAsB;IACtB,2BAA2B;AAC/B;;AAEA;IACI;QACI,iBAAiB;QACjB,kBAAkB;QAClB,OAAO;QACP,QAAQ;QACR,sBAAsB;IAC1B;AACJ","sourcesContent":["/*!\n * Toastify js 1.12.0\n * https://github.com/apvarun/toastify-js\n * @license MIT licensed\n *\n * Copyright (C) 2018 Varun A P\n */\n\n.toastify {\n padding: 12px 20px;\n color: #ffffff;\n display: inline-block;\n box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);\n background: -webkit-linear-gradient(315deg, #73a5ff, #5477f5);\n background: linear-gradient(135deg, #73a5ff, #5477f5);\n position: fixed;\n opacity: 0;\n transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);\n border-radius: 2px;\n cursor: pointer;\n text-decoration: none;\n max-width: calc(50% - 20px);\n z-index: 2147483647;\n}\n\n.toastify.on {\n opacity: 1;\n}\n\n.toast-close {\n background: transparent;\n border: 0;\n color: white;\n cursor: pointer;\n font-family: inherit;\n font-size: 1em;\n opacity: 0.4;\n padding: 0 5px;\n}\n\n.toastify-right {\n right: 15px;\n}\n\n.toastify-left {\n left: 15px;\n}\n\n.toastify-top {\n top: -150px;\n}\n\n.toastify-bottom {\n bottom: -150px;\n}\n\n.toastify-rounded {\n border-radius: 25px;\n}\n\n.toastify-avatar {\n width: 1.5em;\n height: 1.5em;\n margin: -7px 5px;\n border-radius: 2px;\n}\n\n.toastify-center {\n margin-left: auto;\n margin-right: auto;\n left: 0;\n right: 0;\n max-width: fit-content;\n max-width: -moz-fit-content;\n}\n\n@media only screen and (max-width: 360px) {\n .toastify-right, .toastify-left {\n margin-left: auto;\n margin-right: auto;\n left: 0;\n right: 0;\n max-width: fit-content;\n }\n}\n"],"sourceRoot":""}]); // Exports /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___); /***/ }), /***/ "./node_modules/css-loader/dist/runtime/api.js": /*!*****************************************************!*\ !*** ./node_modules/css-loader/dist/runtime/api.js ***! \*****************************************************/ /***/ ((module) => { "use strict"; /* MIT License http://www.opensource.org/licenses/mit-license.php Author Tobias Koppers @sokra */ module.exports = function (cssWithMappingToString) { var list = []; // return the list of modules as css string list.toString = function toString() { return this.map(function (item) { var content = ""; var needLayer = typeof item[5] !== "undefined"; if (item[4]) { content += "@supports (".concat(item[4], ") {"); } if (item[2]) { content += "@media ".concat(item[2], " {"); } if (needLayer) { content += "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {"); } content += cssWithMappingToString(item); if (needLayer) { content += "}"; } if (item[2]) { content += "}"; } if (item[4]) { content += "}"; } return content; }).join(""); }; // import a list of modules into the list list.i = function i(modules, media, dedupe, supports, layer) { if (typeof modules === "string") { modules = [[null, modules, undefined]]; } var alreadyImportedModules = {}; if (dedupe) { for (var k = 0; k < this.length; k++) { var id = this[k][0]; if (id != null) { alreadyImportedModules[id] = true; } } } for (var _k = 0; _k < modules.length; _k++) { var item = [].concat(modules[_k]); if (dedupe && alreadyImportedModules[item[0]]) { continue; } if (typeof layer !== "undefined") { if (typeof item[5] === "undefined") { item[5] = layer; } else { item[1] = "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {").concat(item[1], "}"); item[5] = layer; } } if (media) { if (!item[2]) { item[2] = media; } else { item[1] = "@media ".concat(item[2], " {").concat(item[1], "}"); item[2] = media; } } if (supports) { if (!item[4]) { item[4] = "".concat(supports); } else { item[1] = "@supports (".concat(item[4], ") {").concat(item[1], "}"); item[4] = supports; } } list.push(item); } }; return list; }; /***/ }), /***/ "./node_modules/css-loader/dist/runtime/sourceMaps.js": /*!************************************************************!*\ !*** ./node_modules/css-loader/dist/runtime/sourceMaps.js ***! \************************************************************/ /***/ ((module) => { "use strict"; module.exports = function (item) { var content = item[1]; var cssMapping = item[3]; if (!cssMapping) { return content; } if (typeof btoa === "function") { var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(cssMapping)))); var data = "sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(base64); var sourceMapping = "/*# ".concat(data, " */"); return [content].concat([sourceMapping]).join("\n"); } return [content].join("\n"); }; /***/ }), /***/ "./node_modules/sortablejs/modular/sortable.esm.js": /*!*********************************************************!*\ !*** ./node_modules/sortablejs/modular/sortable.esm.js ***! \*********************************************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ MultiDrag: () => (/* binding */ MultiDragPlugin), /* harmony export */ Sortable: () => (/* binding */ Sortable), /* harmony export */ Swap: () => (/* binding */ SwapPlugin), /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /**! * Sortable 1.15.6 * @author RubaXa * @author owenm * @license MIT */ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; } function _objectSpread2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function (obj) { return typeof obj; }; } else { _typeof = function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; } function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var version = "1.15.6"; function userAgent(pattern) { if (typeof window !== 'undefined' && window.navigator) { return !! /*@__PURE__*/navigator.userAgent.match(pattern); } } var IE11OrLess = userAgent(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i); var Edge = userAgent(/Edge/i); var FireFox = userAgent(/firefox/i); var Safari = userAgent(/safari/i) && !userAgent(/chrome/i) && !userAgent(/android/i); var IOS = userAgent(/iP(ad|od|hone)/i); var ChromeForAndroid = userAgent(/chrome/i) && userAgent(/android/i); var captureMode = { capture: false, passive: false }; function on(el, event, fn) { el.addEventListener(event, fn, !IE11OrLess && captureMode); } function off(el, event, fn) { el.removeEventListener(event, fn, !IE11OrLess && captureMode); } function matches( /**HTMLElement*/el, /**String*/selector) { if (!selector) return; selector[0] === '>' && (selector = selector.substring(1)); if (el) { try { if (el.matches) { return el.matches(selector); } else if (el.msMatchesSelector) { return el.msMatchesSelector(selector); } else if (el.webkitMatchesSelector) { return el.webkitMatchesSelector(selector); } } catch (_) { return false; } } return false; } function getParentOrHost(el) { return el.host && el !== document && el.host.nodeType ? el.host : el.parentNode; } function closest( /**HTMLElement*/el, /**String*/selector, /**HTMLElement*/ctx, includeCTX) { if (el) { ctx = ctx || document; do { if (selector != null && (selector[0] === '>' ? el.parentNode === ctx && matches(el, selector) : matches(el, selector)) || includeCTX && el === ctx) { return el; } if (el === ctx) break; /* jshint boss:true */ } while (el = getParentOrHost(el)); } return null; } var R_SPACE = /\s+/g; function toggleClass(el, name, state) { if (el && name) { if (el.classList) { el.classList[state ? 'add' : 'remove'](name); } else { var className = (' ' + el.className + ' ').replace(R_SPACE, ' ').replace(' ' + name + ' ', ' '); el.className = (className + (state ? ' ' + name : '')).replace(R_SPACE, ' '); } } } function css(el, prop, val) { var style = el && el.style; if (style) { if (val === void 0) { if (document.defaultView && document.defaultView.getComputedStyle) { val = document.defaultView.getComputedStyle(el, ''); } else if (el.currentStyle) { val = el.currentStyle; } return prop === void 0 ? val : val[prop]; } else { if (!(prop in style) && prop.indexOf('webkit') === -1) { prop = '-webkit-' + prop; } style[prop] = val + (typeof val === 'string' ? '' : 'px'); } } } function matrix(el, selfOnly) { var appliedTransforms = ''; if (typeof el === 'string') { appliedTransforms = el; } else { do { var transform = css(el, 'transform'); if (transform && transform !== 'none') { appliedTransforms = transform + ' ' + appliedTransforms; } /* jshint boss:true */ } while (!selfOnly && (el = el.parentNode)); } var matrixFn = window.DOMMatrix || window.WebKitCSSMatrix || window.CSSMatrix || window.MSCSSMatrix; /*jshint -W056 */ return matrixFn && new matrixFn(appliedTransforms); } function find(ctx, tagName, iterator) { if (ctx) { var list = ctx.getElementsByTagName(tagName), i = 0, n = list.length; if (iterator) { for (; i < n; i++) { iterator(list[i], i); } } return list; } return []; } function getWindowScrollingElement() { var scrollingElement = document.scrollingElement; if (scrollingElement) { return scrollingElement; } else { return document.documentElement; } } /** * Returns the "bounding client rect" of given element * @param {HTMLElement} el The element whose boundingClientRect is wanted * @param {[Boolean]} relativeToContainingBlock Whether the rect should be relative to the containing block of (including) the container * @param {[Boolean]} relativeToNonStaticParent Whether the rect should be relative to the relative parent of (including) the contaienr * @param {[Boolean]} undoScale Whether the container's scale() should be undone * @param {[HTMLElement]} container The parent the element will be placed in * @return {Object} The boundingClientRect of el, with specified adjustments */ function getRect(el, relativeToContainingBlock, relativeToNonStaticParent, undoScale, container) { if (!el.getBoundingClientRect && el !== window) return; var elRect, top, left, bottom, right, height, width; if (el !== window && el.parentNode && el !== getWindowScrollingElement()) { elRect = el.getBoundingClientRect(); top = elRect.top; left = elRect.left; bottom = elRect.bottom; right = elRect.right; height = elRect.height; width = elRect.width; } else { top = 0; left = 0; bottom = window.innerHeight; right = window.innerWidth; height = window.innerHeight; width = window.innerWidth; } if ((relativeToContainingBlock || relativeToNonStaticParent) && el !== window) { // Adjust for translate() container = container || el.parentNode; // solves #1123 (see: https://stackoverflow.com/a/37953806/6088312) // Not needed on <= IE11 if (!IE11OrLess) { do { if (container && container.getBoundingClientRect && (css(container, 'transform') !== 'none' || relativeToNonStaticParent && css(container, 'position') !== 'static')) { var containerRect = container.getBoundingClientRect(); // Set relative to edges of padding box of container top -= containerRect.top + parseInt(css(container, 'border-top-width')); left -= containerRect.left + parseInt(css(container, 'border-left-width')); bottom = top + elRect.height; right = left + elRect.width; break; } /* jshint boss:true */ } while (container = container.parentNode); } } if (undoScale && el !== window) { // Adjust for scale() var elMatrix = matrix(container || el), scaleX = elMatrix && elMatrix.a, scaleY = elMatrix && elMatrix.d; if (elMatrix) { top /= scaleY; left /= scaleX; width /= scaleX; height /= scaleY; bottom = top + height; right = left + width; } } return { top: top, left: left, bottom: bottom, right: right, width: width, height: height }; } /** * Checks if a side of an element is scrolled past a side of its parents * @param {HTMLElement} el The element who's side being scrolled out of view is in question * @param {String} elSide Side of the element in question ('top', 'left', 'right', 'bottom') * @param {String} parentSide Side of the parent in question ('top', 'left', 'right', 'bottom') * @return {HTMLElement} The parent scroll element that the el's side is scrolled past, or null if there is no such element */ function isScrolledPast(el, elSide, parentSide) { var parent = getParentAutoScrollElement(el, true), elSideVal = getRect(el)[elSide]; /* jshint boss:true */ while (parent) { var parentSideVal = getRect(parent)[parentSide], visible = void 0; if (parentSide === 'top' || parentSide === 'left') { visible = elSideVal >= parentSideVal; } else { visible = elSideVal <= parentSideVal; } if (!visible) return parent; if (parent === getWindowScrollingElement()) break; parent = getParentAutoScrollElement(parent, false); } return false; } /** * Gets nth child of el, ignoring hidden children, sortable's elements (does not ignore clone if it's visible) * and non-draggable elements * @param {HTMLElement} el The parent element * @param {Number} childNum The index of the child * @param {Object} options Parent Sortable's options * @return {HTMLElement} The child at index childNum, or null if not found */ function getChild(el, childNum, options, includeDragEl) { var currentChild = 0, i = 0, children = el.children; while (i < children.length) { if (children[i].style.display !== 'none' && children[i] !== Sortable.ghost && (includeDragEl || children[i] !== Sortable.dragged) && closest(children[i], options.draggable, el, false)) { if (currentChild === childNum) { return children[i]; } currentChild++; } i++; } return null; } /** * Gets the last child in the el, ignoring ghostEl or invisible elements (clones) * @param {HTMLElement} el Parent element * @param {selector} selector Any other elements that should be ignored * @return {HTMLElement} The last child, ignoring ghostEl */ function lastChild(el, selector) { var last = el.lastElementChild; while (last && (last === Sortable.ghost || css(last, 'display') === 'none' || selector && !matches(last, selector))) { last = last.previousElementSibling; } return last || null; } /** * Returns the index of an element within its parent for a selected set of * elements * @param {HTMLElement} el * @param {selector} selector * @return {number} */ function index(el, selector) { var index = 0; if (!el || !el.parentNode) { return -1; } /* jshint boss:true */ while (el = el.previousElementSibling) { if (el.nodeName.toUpperCase() !== 'TEMPLATE' && el !== Sortable.clone && (!selector || matches(el, selector))) { index++; } } return index; } /** * Returns the scroll offset of the given element, added with all the scroll offsets of parent elements. * The value is returned in real pixels. * @param {HTMLElement} el * @return {Array} Offsets in the format of [left, top] */ function getRelativeScrollOffset(el) { var offsetLeft = 0, offsetTop = 0, winScroller = getWindowScrollingElement(); if (el) { do { var elMatrix = matrix(el), scaleX = elMatrix.a, scaleY = elMatrix.d; offsetLeft += el.scrollLeft * scaleX; offsetTop += el.scrollTop * scaleY; } while (el !== winScroller && (el = el.parentNode)); } return [offsetLeft, offsetTop]; } /** * Returns the index of the object within the given array * @param {Array} arr Array that may or may not hold the object * @param {Object} obj An object that has a key-value pair unique to and identical to a key-value pair in the object you want to find * @return {Number} The index of the object in the array, or -1 */ function indexOfObject(arr, obj) { for (var i in arr) { if (!arr.hasOwnProperty(i)) continue; for (var key in obj) { if (obj.hasOwnProperty(key) && obj[key] === arr[i][key]) return Number(i); } } return -1; } function getParentAutoScrollElement(el, includeSelf) { // skip to window if (!el || !el.getBoundingClientRect) return getWindowScrollingElement(); var elem = el; var gotSelf = false; do { // we don't need to get elem css if it isn't even overflowing in the first place (performance) if (elem.clientWidth < elem.scrollWidth || elem.clientHeight < elem.scrollHeight) { var elemCSS = css(elem); if (elem.clientWidth < elem.scrollWidth && (elemCSS.overflowX == 'auto' || elemCSS.overflowX == 'scroll') || elem.clientHeight < elem.scrollHeight && (elemCSS.overflowY == 'auto' || elemCSS.overflowY == 'scroll')) { if (!elem.getBoundingClientRect || elem === document.body) return getWindowScrollingElement(); if (gotSelf || includeSelf) return elem; gotSelf = true; } } /* jshint boss:true */ } while (elem = elem.parentNode); return getWindowScrollingElement(); } function extend(dst, src) { if (dst && src) { for (var key in src) { if (src.hasOwnProperty(key)) { dst[key] = src[key]; } } } return dst; } function isRectEqual(rect1, rect2) { return Math.round(rect1.top) === Math.round(rect2.top) && Math.round(rect1.left) === Math.round(rect2.left) && Math.round(rect1.height) === Math.round(rect2.height) && Math.round(rect1.width) === Math.round(rect2.width); } var _throttleTimeout; function throttle(callback, ms) { return function () { if (!_throttleTimeout) { var args = arguments, _this = this; if (args.length === 1) { callback.call(_this, args[0]); } else { callback.apply(_this, args); } _throttleTimeout = setTimeout(function () { _throttleTimeout = void 0; }, ms); } }; } function cancelThrottle() { clearTimeout(_throttleTimeout); _throttleTimeout = void 0; } function scrollBy(el, x, y) { el.scrollLeft += x; el.scrollTop += y; } function clone(el) { var Polymer = window.Polymer; var $ = window.jQuery || window.Zepto; if (Polymer && Polymer.dom) { return Polymer.dom(el).cloneNode(true); } else if ($) { return $(el).clone(true)[0]; } else { return el.cloneNode(true); } } function setRect(el, rect) { css(el, 'position', 'absolute'); css(el, 'top', rect.top); css(el, 'left', rect.left); css(el, 'width', rect.width); css(el, 'height', rect.height); } function unsetRect(el) { css(el, 'position', ''); css(el, 'top', ''); css(el, 'left', ''); css(el, 'width', ''); css(el, 'height', ''); } function getChildContainingRectFromElement(container, options, ghostEl) { var rect = {}; Array.from(container.children).forEach(function (child) { var _rect$left, _rect$top, _rect$right, _rect$bottom; if (!closest(child, options.draggable, container, false) || child.animated || child === ghostEl) return; var childRect = getRect(child); rect.left = Math.min((_rect$left = rect.left) !== null && _rect$left !== void 0 ? _rect$left : Infinity, childRect.left); rect.top = Math.min((_rect$top = rect.top) !== null && _rect$top !== void 0 ? _rect$top : Infinity, childRect.top); rect.right = Math.max((_rect$right = rect.right) !== null && _rect$right !== void 0 ? _rect$right : -Infinity, childRect.right); rect.bottom = Math.max((_rect$bottom = rect.bottom) !== null && _rect$bottom !== void 0 ? _rect$bottom : -Infinity, childRect.bottom); }); rect.width = rect.right - rect.left; rect.height = rect.bottom - rect.top; rect.x = rect.left; rect.y = rect.top; return rect; } var expando = 'Sortable' + new Date().getTime(); function AnimationStateManager() { var animationStates = [], animationCallbackId; return { captureAnimationState: function captureAnimationState() { animationStates = []; if (!this.options.animation) return; var children = [].slice.call(this.el.children); children.forEach(function (child) { if (css(child, 'display') === 'none' || child === Sortable.ghost) return; animationStates.push({ target: child, rect: getRect(child) }); var fromRect = _objectSpread2({}, animationStates[animationStates.length - 1].rect); // If animating: compensate for current animation if (child.thisAnimationDuration) { var childMatrix = matrix(child, true); if (childMatrix) { fromRect.top -= childMatrix.f; fromRect.left -= childMatrix.e; } } child.fromRect = fromRect; }); }, addAnimationState: function addAnimationState(state) { animationStates.push(state); }, removeAnimationState: function removeAnimationState(target) { animationStates.splice(indexOfObject(animationStates, { target: target }), 1); }, animateAll: function animateAll(callback) { var _this = this; if (!this.options.animation) { clearTimeout(animationCallbackId); if (typeof callback === 'function') callback(); return; } var animating = false, animationTime = 0; animationStates.forEach(function (state) { var time = 0, target = state.target, fromRect = target.fromRect, toRect = getRect(target), prevFromRect = target.prevFromRect, prevToRect = target.prevToRect, animatingRect = state.rect, targetMatrix = matrix(target, true); if (targetMatrix) { // Compensate for current animation toRect.top -= targetMatrix.f; toRect.left -= targetMatrix.e; } target.toRect = toRect; if (target.thisAnimationDuration) { // Could also check if animatingRect is between fromRect and toRect if (isRectEqual(prevFromRect, toRect) && !isRectEqual(fromRect, toRect) && // Make sure animatingRect is on line between toRect & fromRect (animatingRect.top - toRect.top) / (animatingRect.left - toRect.left) === (fromRect.top - toRect.top) / (fromRect.left - toRect.left)) { // If returning to same place as started from animation and on same axis time = calculateRealTime(animatingRect, prevFromRect, prevToRect, _this.options); } } // if fromRect != toRect: animate if (!isRectEqual(toRect, fromRect)) { target.prevFromRect = fromRect; target.prevToRect = toRect; if (!time) { time = _this.options.animation; } _this.animate(target, animatingRect, toRect, time); } if (time) { animating = true; animationTime = Math.max(animationTime, time); clearTimeout(target.animationResetTimer); target.animationResetTimer = setTimeout(function () { target.animationTime = 0; target.prevFromRect = null; target.fromRect = null; target.prevToRect = null; target.thisAnimationDuration = null; }, time); target.thisAnimationDuration = time; } }); clearTimeout(animationCallbackId); if (!animating) { if (typeof callback === 'function') callback(); } else { animationCallbackId = setTimeout(function () { if (typeof callback === 'function') callback(); }, animationTime); } animationStates = []; }, animate: function animate(target, currentRect, toRect, duration) { if (duration) { css(target, 'transition', ''); css(target, 'transform', ''); var elMatrix = matrix(this.el), scaleX = elMatrix && elMatrix.a, scaleY = elMatrix && elMatrix.d, translateX = (currentRect.left - toRect.left) / (scaleX || 1), translateY = (currentRect.top - toRect.top) / (scaleY || 1); target.animatingX = !!translateX; target.animatingY = !!translateY; css(target, 'transform', 'translate3d(' + translateX + 'px,' + translateY + 'px,0)'); this.forRepaintDummy = repaint(target); // repaint css(target, 'transition', 'transform ' + duration + 'ms' + (this.options.easing ? ' ' + this.options.easing : '')); css(target, 'transform', 'translate3d(0,0,0)'); typeof target.animated === 'number' && clearTimeout(target.animated); target.animated = setTimeout(function () { css(target, 'transition', ''); css(target, 'transform', ''); target.animated = false; target.animatingX = false; target.animatingY = false; }, duration); } } }; } function repaint(target) { return target.offsetWidth; } function calculateRealTime(animatingRect, fromRect, toRect, options) { return Math.sqrt(Math.pow(fromRect.top - animatingRect.top, 2) + Math.pow(fromRect.left - animatingRect.left, 2)) / Math.sqrt(Math.pow(fromRect.top - toRect.top, 2) + Math.pow(fromRect.left - toRect.left, 2)) * options.animation; } var plugins = []; var defaults = { initializeByDefault: true }; var PluginManager = { mount: function mount(plugin) { // Set default static properties for (var option in defaults) { if (defaults.hasOwnProperty(option) && !(option in plugin)) { plugin[option] = defaults[option]; } } plugins.forEach(function (p) { if (p.pluginName === plugin.pluginName) { throw "Sortable: Cannot mount plugin ".concat(plugin.pluginName, " more than once"); } }); plugins.push(plugin); }, pluginEvent: function pluginEvent(eventName, sortable, evt) { var _this = this; this.eventCanceled = false; evt.cancel = function () { _this.eventCanceled = true; }; var eventNameGlobal = eventName + 'Global'; plugins.forEach(function (plugin) { if (!sortable[plugin.pluginName]) return; // Fire global events if it exists in this sortable if (sortable[plugin.pluginName][eventNameGlobal]) { sortable[plugin.pluginName][eventNameGlobal](_objectSpread2({ sortable: sortable }, evt)); } // Only fire plugin event if plugin is enabled in this sortable, // and plugin has event defined if (sortable.options[plugin.pluginName] && sortable[plugin.pluginName][eventName]) { sortable[plugin.pluginName][eventName](_objectSpread2({ sortable: sortable }, evt)); } }); }, initializePlugins: function initializePlugins(sortable, el, defaults, options) { plugins.forEach(function (plugin) { var pluginName = plugin.pluginName; if (!sortable.options[pluginName] && !plugin.initializeByDefault) return; var initialized = new plugin(sortable, el, sortable.options); initialized.sortable = sortable; initialized.options = sortable.options; sortable[pluginName] = initialized; // Add default options from plugin _extends(defaults, initialized.defaults); }); for (var option in sortable.options) { if (!sortable.options.hasOwnProperty(option)) continue; var modified = this.modifyOption(sortable, option, sortable.options[option]); if (typeof modified !== 'undefined') { sortable.options[option] = modified; } } }, getEventProperties: function getEventProperties(name, sortable) { var eventProperties = {}; plugins.forEach(function (plugin) { if (typeof plugin.eventProperties !== 'function') return; _extends(eventProperties, plugin.eventProperties.call(sortable[plugin.pluginName], name)); }); return eventProperties; }, modifyOption: function modifyOption(sortable, name, value) { var modifiedValue; plugins.forEach(function (plugin) { // Plugin must exist on the Sortable if (!sortable[plugin.pluginName]) return; // If static option listener exists for this option, call in the context of the Sortable's instance of this plugin if (plugin.optionListeners && typeof plugin.optionListeners[name] === 'function') { modifiedValue = plugin.optionListeners[name].call(sortable[plugin.pluginName], value); } }); return modifiedValue; } }; function dispatchEvent(_ref) { var sortable = _ref.sortable, rootEl = _ref.rootEl, name = _ref.name, targetEl = _ref.targetEl, cloneEl = _ref.cloneEl, toEl = _ref.toEl, fromEl = _ref.fromEl, oldIndex = _ref.oldIndex, newIndex = _ref.newIndex, oldDraggableIndex = _ref.oldDraggableIndex, newDraggableIndex = _ref.newDraggableIndex, originalEvent = _ref.originalEvent, putSortable = _ref.putSortable, extraEventProperties = _ref.extraEventProperties; sortable = sortable || rootEl && rootEl[expando]; if (!sortable) return; var evt, options = sortable.options, onName = 'on' + name.charAt(0).toUpperCase() + name.substr(1); // Support for new CustomEvent feature if (window.CustomEvent && !IE11OrLess && !Edge) { evt = new CustomEvent(name, { bubbles: true, cancelable: true }); } else { evt = document.createEvent('Event'); evt.initEvent(name, true, true); } evt.to = toEl || rootEl; evt.from = fromEl || rootEl; evt.item = targetEl || rootEl; evt.clone = cloneEl; evt.oldIndex = oldIndex; evt.newIndex = newIndex; evt.oldDraggableIndex = oldDraggableIndex; evt.newDraggableIndex = newDraggableIndex; evt.originalEvent = originalEvent; evt.pullMode = putSortable ? putSortable.lastPutMode : undefined; var allEventProperties = _objectSpread2(_objectSpread2({}, extraEventProperties), PluginManager.getEventProperties(name, sortable)); for (var option in allEventProperties) { evt[option] = allEventProperties[option]; } if (rootEl) { rootEl.dispatchEvent(evt); } if (options[onName]) { options[onName].call(sortable, evt); } } var _excluded = ["evt"]; var pluginEvent = function pluginEvent(eventName, sortable) { var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}, originalEvent = _ref.evt, data = _objectWithoutProperties(_ref, _excluded); PluginManager.pluginEvent.bind(Sortable)(eventName, sortable, _objectSpread2({ dragEl: dragEl, parentEl: parentEl, ghostEl: ghostEl, rootEl: rootEl, nextEl: nextEl, lastDownEl: lastDownEl, cloneEl: cloneEl, cloneHidden: cloneHidden, dragStarted: moved, putSortable: putSortable, activeSortable: Sortable.active, originalEvent: originalEvent, oldIndex: oldIndex, oldDraggableIndex: oldDraggableIndex, newIndex: newIndex, newDraggableIndex: newDraggableIndex, hideGhostForTarget: _hideGhostForTarget, unhideGhostForTarget: _unhideGhostForTarget, cloneNowHidden: function cloneNowHidden() { cloneHidden = true; }, cloneNowShown: function cloneNowShown() { cloneHidden = false; }, dispatchSortableEvent: function dispatchSortableEvent(name) { _dispatchEvent({ sortable: sortable, name: name, originalEvent: originalEvent }); } }, data)); }; function _dispatchEvent(info) { dispatchEvent(_objectSpread2({ putSortable: putSortable, cloneEl: cloneEl, targetEl: dragEl, rootEl: rootEl, oldIndex: oldIndex, oldDraggableIndex: oldDraggableIndex, newIndex: newIndex, newDraggableIndex: newDraggableIndex }, info)); } var dragEl, parentEl, ghostEl, rootEl, nextEl, lastDownEl, cloneEl, cloneHidden, oldIndex, newIndex, oldDraggableIndex, newDraggableIndex, activeGroup, putSortable, awaitingDragStarted = false, ignoreNextClick = false, sortables = [], tapEvt, touchEvt, lastDx, lastDy, tapDistanceLeft, tapDistanceTop, moved, lastTarget, lastDirection, pastFirstInvertThresh = false, isCircumstantialInvert = false, targetMoveDistance, // For positioning ghost absolutely ghostRelativeParent, ghostRelativeParentInitialScroll = [], // (left, top) _silent = false, savedInputChecked = []; /** @const */ var documentExists = typeof document !== 'undefined', PositionGhostAbsolutely = IOS, CSSFloatProperty = Edge || IE11OrLess ? 'cssFloat' : 'float', // This will not pass for IE9, because IE9 DnD only works on anchors supportDraggable = documentExists && !ChromeForAndroid && !IOS && 'draggable' in document.createElement('div'), supportCssPointerEvents = function () { if (!documentExists) return; // false when <= IE11 if (IE11OrLess) { return false; } var el = document.createElement('x'); el.style.cssText = 'pointer-events:auto'; return el.style.pointerEvents === 'auto'; }(), _detectDirection = function _detectDirection(el, options) { var elCSS = css(el), elWidth = parseInt(elCSS.width) - parseInt(elCSS.paddingLeft) - parseInt(elCSS.paddingRight) - parseInt(elCSS.borderLeftWidth) - parseInt(elCSS.borderRightWidth), child1 = getChild(el, 0, options), child2 = getChild(el, 1, options), firstChildCSS = child1 && css(child1), secondChildCSS = child2 && css(child2), firstChildWidth = firstChildCSS && parseInt(firstChildCSS.marginLeft) + parseInt(firstChildCSS.marginRight) + getRect(child1).width, secondChildWidth = secondChildCSS && parseInt(secondChildCSS.marginLeft) + parseInt(secondChildCSS.marginRight) + getRect(child2).width; if (elCSS.display === 'flex') { return elCSS.flexDirection === 'column' || elCSS.flexDirection === 'column-reverse' ? 'vertical' : 'horizontal'; } if (elCSS.display === 'grid') { return elCSS.gridTemplateColumns.split(' ').length <= 1 ? 'vertical' : 'horizontal'; } if (child1 && firstChildCSS["float"] && firstChildCSS["float"] !== 'none') { var touchingSideChild2 = firstChildCSS["float"] === 'left' ? 'left' : 'right'; return child2 && (secondChildCSS.clear === 'both' || secondChildCSS.clear === touchingSideChild2) ? 'vertical' : 'horizontal'; } return child1 && (firstChildCSS.display === 'block' || firstChildCSS.display === 'flex' || firstChildCSS.display === 'table' || firstChildCSS.display === 'grid' || firstChildWidth >= elWidth && elCSS[CSSFloatProperty] === 'none' || child2 && elCSS[CSSFloatProperty] === 'none' && firstChildWidth + secondChildWidth > elWidth) ? 'vertical' : 'horizontal'; }, _dragElInRowColumn = function _dragElInRowColumn(dragRect, targetRect, vertical) { var dragElS1Opp = vertical ? dragRect.left : dragRect.top, dragElS2Opp = vertical ? dragRect.right : dragRect.bottom, dragElOppLength = vertical ? dragRect.width : dragRect.height, targetS1Opp = vertical ? targetRect.left : targetRect.top, targetS2Opp = vertical ? targetRect.right : targetRect.bottom, targetOppLength = vertical ? targetRect.width : targetRect.height; return dragElS1Opp === targetS1Opp || dragElS2Opp === targetS2Opp || dragElS1Opp + dragElOppLength / 2 === targetS1Opp + targetOppLength / 2; }, /** * Detects first nearest empty sortable to X and Y position using emptyInsertThreshold. * @param {Number} x X position * @param {Number} y Y position * @return {HTMLElement} Element of the first found nearest Sortable */ _detectNearestEmptySortable = function _detectNearestEmptySortable(x, y) { var ret; sortables.some(function (sortable) { var threshold = sortable[expando].options.emptyInsertThreshold; if (!threshold || lastChild(sortable)) return; var rect = getRect(sortable), insideHorizontally = x >= rect.left - threshold && x <= rect.right + threshold, insideVertically = y >= rect.top - threshold && y <= rect.bottom + threshold; if (insideHorizontally && insideVertically) { return ret = sortable; } }); return ret; }, _prepareGroup = function _prepareGroup(options) { function toFn(value, pull) { return function (to, from, dragEl, evt) { var sameGroup = to.options.group.name && from.options.group.name && to.options.group.name === from.options.group.name; if (value == null && (pull || sameGroup)) { // Default pull value // Default pull and put value if same group return true; } else if (value == null || value === false) { return false; } else if (pull && value === 'clone') { return value; } else if (typeof value === 'function') { return toFn(value(to, from, dragEl, evt), pull)(to, from, dragEl, evt); } else { var otherGroup = (pull ? to : from).options.group.name; return value === true || typeof value === 'string' && value === otherGroup || value.join && value.indexOf(otherGroup) > -1; } }; } var group = {}; var originalGroup = options.group; if (!originalGroup || _typeof(originalGroup) != 'object') { originalGroup = { name: originalGroup }; } group.name = originalGroup.name; group.checkPull = toFn(originalGroup.pull, true); group.checkPut = toFn(originalGroup.put); group.revertClone = originalGroup.revertClone; options.group = group; }, _hideGhostForTarget = function _hideGhostForTarget() { if (!supportCssPointerEvents && ghostEl) { css(ghostEl, 'display', 'none'); } }, _unhideGhostForTarget = function _unhideGhostForTarget() { if (!supportCssPointerEvents && ghostEl) { css(ghostEl, 'display', ''); } }; // #1184 fix - Prevent click event on fallback if dragged but item not changed position if (documentExists && !ChromeForAndroid) { document.addEventListener('click', function (evt) { if (ignoreNextClick) { evt.preventDefault(); evt.stopPropagation && evt.stopPropagation(); evt.stopImmediatePropagation && evt.stopImmediatePropagation(); ignoreNextClick = false; return false; } }, true); } var nearestEmptyInsertDetectEvent = function nearestEmptyInsertDetectEvent(evt) { if (dragEl) { evt = evt.touches ? evt.touches[0] : evt; var nearest = _detectNearestEmptySortable(evt.clientX, evt.clientY); if (nearest) { // Create imitation event var event = {}; for (var i in evt) { if (evt.hasOwnProperty(i)) { event[i] = evt[i]; } } event.target = event.rootEl = nearest; event.preventDefault = void 0; event.stopPropagation = void 0; nearest[expando]._onDragOver(event); } } }; var _checkOutsideTargetEl = function _checkOutsideTargetEl(evt) { if (dragEl) { dragEl.parentNode[expando]._isOutsideThisEl(evt.target); } }; /** * @class Sortable * @param {HTMLElement} el * @param {Object} [options] */ function Sortable(el, options) { if (!(el && el.nodeType && el.nodeType === 1)) { throw "Sortable: `el` must be an HTMLElement, not ".concat({}.toString.call(el)); } this.el = el; // root element this.options = options = _extends({}, options); // Export instance el[expando] = this; var defaults = { group: null, sort: true, disabled: false, store: null, handle: null, draggable: /^[uo]l$/i.test(el.nodeName) ? '>li' : '>*', swapThreshold: 1, // percentage; 0 <= x <= 1 invertSwap: false, // invert always invertedSwapThreshold: null, // will be set to same as swapThreshold if default removeCloneOnHide: true, direction: function direction() { return _detectDirection(el, this.options); }, ghostClass: 'sortable-ghost', chosenClass: 'sortable-chosen', dragClass: 'sortable-drag', ignore: 'a, img', filter: null, preventOnFilter: true, animation: 0, easing: null, setData: function setData(dataTransfer, dragEl) { dataTransfer.setData('Text', dragEl.textContent); }, dropBubble: false, dragoverBubble: false, dataIdAttr: 'data-id', delay: 0, delayOnTouchOnly: false, touchStartThreshold: (Number.parseInt ? Number : window).parseInt(window.devicePixelRatio, 10) || 1, forceFallback: false, fallbackClass: 'sortable-fallback', fallbackOnBody: false, fallbackTolerance: 0, fallbackOffset: { x: 0, y: 0 }, // Disabled on Safari: #1571; Enabled on Safari IOS: #2244 supportPointer: Sortable.supportPointer !== false && 'PointerEvent' in window && (!Safari || IOS), emptyInsertThreshold: 5 }; PluginManager.initializePlugins(this, el, defaults); // Set default options for (var name in defaults) { !(name in options) && (options[name] = defaults[name]); } _prepareGroup(options); // Bind all private methods for (var fn in this) { if (fn.charAt(0) === '_' && typeof this[fn] === 'function') { this[fn] = this[fn].bind(this); } } // Setup drag mode this.nativeDraggable = options.forceFallback ? false : supportDraggable; if (this.nativeDraggable) { // Touch start threshold cannot be greater than the native dragstart threshold this.options.touchStartThreshold = 1; } // Bind events if (options.supportPointer) { on(el, 'pointerdown', this._onTapStart); } else { on(el, 'mousedown', this._onTapStart); on(el, 'touchstart', this._onTapStart); } if (this.nativeDraggable) { on(el, 'dragover', this); on(el, 'dragenter', this); } sortables.push(this.el); // Restore sorting options.store && options.store.get && this.sort(options.store.get(this) || []); // Add animation state manager _extends(this, AnimationStateManager()); } Sortable.prototype = /** @lends Sortable.prototype */{ constructor: Sortable, _isOutsideThisEl: function _isOutsideThisEl(target) { if (!this.el.contains(target) && target !== this.el) { lastTarget = null; } }, _getDirection: function _getDirection(evt, target) { return typeof this.options.direction === 'function' ? this.options.direction.call(this, evt, target, dragEl) : this.options.direction; }, _onTapStart: function _onTapStart( /** Event|TouchEvent */evt) { if (!evt.cancelable) return; var _this = this, el = this.el, options = this.options, preventOnFilter = options.preventOnFilter, type = evt.type, touch = evt.touches && evt.touches[0] || evt.pointerType && evt.pointerType === 'touch' && evt, target = (touch || evt).target, originalTarget = evt.target.shadowRoot && (evt.path && evt.path[0] || evt.composedPath && evt.composedPath()[0]) || target, filter = options.filter; _saveInputCheckedState(el); // Don't trigger start event when an element is been dragged, otherwise the evt.oldindex always wrong when set option.group. if (dragEl) { return; } if (/mousedown|pointerdown/.test(type) && evt.button !== 0 || options.disabled) { return; // only left button and enabled } // cancel dnd if original target is content editable if (originalTarget.isContentEditable) { return; } // Safari ignores further event handling after mousedown if (!this.nativeDraggable && Safari && target && target.tagName.toUpperCase() === 'SELECT') { return; } target = closest(target, options.draggable, el, false); if (target && target.animated) { return; } if (lastDownEl === target) { // Ignoring duplicate `down` return; } // Get the index of the dragged element within its parent oldIndex = index(target); oldDraggableIndex = index(target, options.draggable); // Check filter if (typeof filter === 'function') { if (filter.call(this, evt, target, this)) { _dispatchEvent({ sortable: _this, rootEl: originalTarget, name: 'filter', targetEl: target, toEl: el, fromEl: el }); pluginEvent('filter', _this, { evt: evt }); preventOnFilter && evt.preventDefault(); return; // cancel dnd } } else if (filter) { filter = filter.split(',').some(function (criteria) { criteria = closest(originalTarget, criteria.trim(), el, false); if (criteria) { _dispatchEvent({ sortable: _this, rootEl: criteria, name: 'filter', targetEl: target, fromEl: el, toEl: el }); pluginEvent('filter', _this, { evt: evt }); return true; } }); if (filter) { preventOnFilter && evt.preventDefault(); return; // cancel dnd } } if (options.handle && !closest(originalTarget, options.handle, el, false)) { return; } // Prepare `dragstart` this._prepareDragStart(evt, touch, target); }, _prepareDragStart: function _prepareDragStart( /** Event */evt, /** Touch */touch, /** HTMLElement */target) { var _this = this, el = _this.el, options = _this.options, ownerDocument = el.ownerDocument, dragStartFn; if (target && !dragEl && target.parentNode === el) { var dragRect = getRect(target); rootEl = el; dragEl = target; parentEl = dragEl.parentNode; nextEl = dragEl.nextSibling; lastDownEl = target; activeGroup = options.group; Sortable.dragged = dragEl; tapEvt = { target: dragEl, clientX: (touch || evt).clientX, clientY: (touch || evt).clientY }; tapDistanceLeft = tapEvt.clientX - dragRect.left; tapDistanceTop = tapEvt.clientY - dragRect.top; this._lastX = (touch || evt).clientX; this._lastY = (touch || evt).clientY; dragEl.style['will-change'] = 'all'; dragStartFn = function dragStartFn() { pluginEvent('delayEnded', _this, { evt: evt }); if (Sortable.eventCanceled) { _this._onDrop(); return; } // Delayed drag has been triggered // we can re-enable the events: touchmove/mousemove _this._disableDelayedDragEvents(); if (!FireFox && _this.nativeDraggable) { dragEl.draggable = true; } // Bind the events: dragstart/dragend _this._triggerDragStart(evt, touch); // Drag start event _dispatchEvent({ sortable: _this, name: 'choose', originalEvent: evt }); // Chosen item toggleClass(dragEl, options.chosenClass, true); }; // Disable "draggable" options.ignore.split(',').forEach(function (criteria) { find(dragEl, criteria.trim(), _disableDraggable); }); on(ownerDocument, 'dragover', nearestEmptyInsertDetectEvent); on(ownerDocument, 'mousemove', nearestEmptyInsertDetectEvent); on(ownerDocument, 'touchmove', nearestEmptyInsertDetectEvent); if (options.supportPointer) { on(ownerDocument, 'pointerup', _this._onDrop); // Native D&D triggers pointercancel !this.nativeDraggable && on(ownerDocument, 'pointercancel', _this._onDrop); } else { on(ownerDocument, 'mouseup', _this._onDrop); on(ownerDocument, 'touchend', _this._onDrop); on(ownerDocument, 'touchcancel', _this._onDrop); } // Make dragEl draggable (must be before delay for FireFox) if (FireFox && this.nativeDraggable) { this.options.touchStartThreshold = 4; dragEl.draggable = true; } pluginEvent('delayStart', this, { evt: evt }); // Delay is impossible for native DnD in Edge or IE if (options.delay && (!options.delayOnTouchOnly || touch) && (!this.nativeDraggable || !(Edge || IE11OrLess))) { if (Sortable.eventCanceled) { this._onDrop(); return; } // If the user moves the pointer or let go the click or touch // before the delay has been reached: // disable the delayed drag if (options.supportPointer) { on(ownerDocument, 'pointerup', _this._disableDelayedDrag); on(ownerDocument, 'pointercancel', _this._disableDelayedDrag); } else { on(ownerDocument, 'mouseup', _this._disableDelayedDrag); on(ownerDocument, 'touchend', _this._disableDelayedDrag); on(ownerDocument, 'touchcancel', _this._disableDelayedDrag); } on(ownerDocument, 'mousemove', _this._delayedDragTouchMoveHandler); on(ownerDocument, 'touchmove', _this._delayedDragTouchMoveHandler); options.supportPointer && on(ownerDocument, 'pointermove', _this._delayedDragTouchMoveHandler); _this._dragStartTimer = setTimeout(dragStartFn, options.delay); } else { dragStartFn(); } } }, _delayedDragTouchMoveHandler: function _delayedDragTouchMoveHandler( /** TouchEvent|PointerEvent **/e) { var touch = e.touches ? e.touches[0] : e; if (Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) >= Math.floor(this.options.touchStartThreshold / (this.nativeDraggable && window.devicePixelRatio || 1))) { this._disableDelayedDrag(); } }, _disableDelayedDrag: function _disableDelayedDrag() { dragEl && _disableDraggable(dragEl); clearTimeout(this._dragStartTimer); this._disableDelayedDragEvents(); }, _disableDelayedDragEvents: function _disableDelayedDragEvents() { var ownerDocument = this.el.ownerDocument; off(ownerDocument, 'mouseup', this._disableDelayedDrag); off(ownerDocument, 'touchend', this._disableDelayedDrag); off(ownerDocument, 'touchcancel', this._disableDelayedDrag); off(ownerDocument, 'pointerup', this._disableDelayedDrag); off(ownerDocument, 'pointercancel', this._disableDelayedDrag); off(ownerDocument, 'mousemove', this._delayedDragTouchMoveHandler); off(ownerDocument, 'touchmove', this._delayedDragTouchMoveHandler); off(ownerDocument, 'pointermove', this._delayedDragTouchMoveHandler); }, _triggerDragStart: function _triggerDragStart( /** Event */evt, /** Touch */touch) { touch = touch || evt.pointerType == 'touch' && evt; if (!this.nativeDraggable || touch) { if (this.options.supportPointer) { on(document, 'pointermove', this._onTouchMove); } else if (touch) { on(document, 'touchmove', this._onTouchMove); } else { on(document, 'mousemove', this._onTouchMove); } } else { on(dragEl, 'dragend', this); on(rootEl, 'dragstart', this._onDragStart); } try { if (document.selection) { _nextTick(function () { document.selection.empty(); }); } else { window.getSelection().removeAllRanges(); } } catch (err) {} }, _dragStarted: function _dragStarted(fallback, evt) { awaitingDragStarted = false; if (rootEl && dragEl) { pluginEvent('dragStarted', this, { evt: evt }); if (this.nativeDraggable) { on(document, 'dragover', _checkOutsideTargetEl); } var options = this.options; // Apply effect !fallback && toggleClass(dragEl, options.dragClass, false); toggleClass(dragEl, options.ghostClass, true); Sortable.active = this; fallback && this._appendGhost(); // Drag start event _dispatchEvent({ sortable: this, name: 'start', originalEvent: evt }); } else { this._nulling(); } }, _emulateDragOver: function _emulateDragOver() { if (touchEvt) { this._lastX = touchEvt.clientX; this._lastY = touchEvt.clientY; _hideGhostForTarget(); var target = document.elementFromPoint(touchEvt.clientX, touchEvt.clientY); var parent = target; while (target && target.shadowRoot) { target = target.shadowRoot.elementFromPoint(touchEvt.clientX, touchEvt.clientY); if (target === parent) break; parent = target; } dragEl.parentNode[expando]._isOutsideThisEl(target); if (parent) { do { if (parent[expando]) { var inserted = void 0; inserted = parent[expando]._onDragOver({ clientX: touchEvt.clientX, clientY: touchEvt.clientY, target: target, rootEl: parent }); if (inserted && !this.options.dragoverBubble) { break; } } target = parent; // store last element } /* jshint boss:true */ while (parent = getParentOrHost(parent)); } _unhideGhostForTarget(); } }, _onTouchMove: function _onTouchMove( /**TouchEvent*/evt) { if (tapEvt) { var options = this.options, fallbackTolerance = options.fallbackTolerance, fallbackOffset = options.fallbackOffset, touch = evt.touches ? evt.touches[0] : evt, ghostMatrix = ghostEl && matrix(ghostEl, true), scaleX = ghostEl && ghostMatrix && ghostMatrix.a, scaleY = ghostEl && ghostMatrix && ghostMatrix.d, relativeScrollOffset = PositionGhostAbsolutely && ghostRelativeParent && getRelativeScrollOffset(ghostRelativeParent), dx = (touch.clientX - tapEvt.clientX + fallbackOffset.x) / (scaleX || 1) + (relativeScrollOffset ? relativeScrollOffset[0] - ghostRelativeParentInitialScroll[0] : 0) / (scaleX || 1), dy = (touch.clientY - tapEvt.clientY + fallbackOffset.y) / (scaleY || 1) + (relativeScrollOffset ? relativeScrollOffset[1] - ghostRelativeParentInitialScroll[1] : 0) / (scaleY || 1); // only set the status to dragging, when we are actually dragging if (!Sortable.active && !awaitingDragStarted) { if (fallbackTolerance && Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) < fallbackTolerance) { return; } this._onDragStart(evt, true); } if (ghostEl) { if (ghostMatrix) { ghostMatrix.e += dx - (lastDx || 0); ghostMatrix.f += dy - (lastDy || 0); } else { ghostMatrix = { a: 1, b: 0, c: 0, d: 1, e: dx, f: dy }; } var cssMatrix = "matrix(".concat(ghostMatrix.a, ",").concat(ghostMatrix.b, ",").concat(ghostMatrix.c, ",").concat(ghostMatrix.d, ",").concat(ghostMatrix.e, ",").concat(ghostMatrix.f, ")"); css(ghostEl, 'webkitTransform', cssMatrix); css(ghostEl, 'mozTransform', cssMatrix); css(ghostEl, 'msTransform', cssMatrix); css(ghostEl, 'transform', cssMatrix); lastDx = dx; lastDy = dy; touchEvt = touch; } evt.cancelable && evt.preventDefault(); } }, _appendGhost: function _appendGhost() { // Bug if using scale(): https://stackoverflow.com/questions/2637058 // Not being adjusted for if (!ghostEl) { var container = this.options.fallbackOnBody ? document.body : rootEl, rect = getRect(dragEl, true, PositionGhostAbsolutely, true, container), options = this.options; // Position absolutely if (PositionGhostAbsolutely) { // Get relatively positioned parent ghostRelativeParent = container; while (css(ghostRelativeParent, 'position') === 'static' && css(ghostRelativeParent, 'transform') === 'none' && ghostRelativeParent !== document) { ghostRelativeParent = ghostRelativeParent.parentNode; } if (ghostRelativeParent !== document.body && ghostRelativeParent !== document.documentElement) { if (ghostRelativeParent === document) ghostRelativeParent = getWindowScrollingElement(); rect.top += ghostRelativeParent.scrollTop; rect.left += ghostRelativeParent.scrollLeft; } else { ghostRelativeParent = getWindowScrollingElement(); } ghostRelativeParentInitialScroll = getRelativeScrollOffset(ghostRelativeParent); } ghostEl = dragEl.cloneNode(true); toggleClass(ghostEl, options.ghostClass, false); toggleClass(ghostEl, options.fallbackClass, true); toggleClass(ghostEl, options.dragClass, true); css(ghostEl, 'transition', ''); css(ghostEl, 'transform', ''); css(ghostEl, 'box-sizing', 'border-box'); css(ghostEl, 'margin', 0); css(ghostEl, 'top', rect.top); css(ghostEl, 'left', rect.left); css(ghostEl, 'width', rect.width); css(ghostEl, 'height', rect.height); css(ghostEl, 'opacity', '0.8'); css(ghostEl, 'position', PositionGhostAbsolutely ? 'absolute' : 'fixed'); css(ghostEl, 'zIndex', '100000'); css(ghostEl, 'pointerEvents', 'none'); Sortable.ghost = ghostEl; container.appendChild(ghostEl); // Set transform-origin css(ghostEl, 'transform-origin', tapDistanceLeft / parseInt(ghostEl.style.width) * 100 + '% ' + tapDistanceTop / parseInt(ghostEl.style.height) * 100 + '%'); } }, _onDragStart: function _onDragStart( /**Event*/evt, /**boolean*/fallback) { var _this = this; var dataTransfer = evt.dataTransfer; var options = _this.options; pluginEvent('dragStart', this, { evt: evt }); if (Sortable.eventCanceled) { this._onDrop(); return; } pluginEvent('setupClone', this); if (!Sortable.eventCanceled) { cloneEl = clone(dragEl); cloneEl.removeAttribute("id"); cloneEl.draggable = false; cloneEl.style['will-change'] = ''; this._hideClone(); toggleClass(cloneEl, this.options.chosenClass, false); Sortable.clone = cloneEl; } // #1143: IFrame support workaround _this.cloneId = _nextTick(function () { pluginEvent('clone', _this); if (Sortable.eventCanceled) return; if (!_this.options.removeCloneOnHide) { rootEl.insertBefore(cloneEl, dragEl); } _this._hideClone(); _dispatchEvent({ sortable: _this, name: 'clone' }); }); !fallback && toggleClass(dragEl, options.dragClass, true); // Set proper drop events if (fallback) { ignoreNextClick = true; _this._loopId = setInterval(_this._emulateDragOver, 50); } else { // Undo what was set in _prepareDragStart before drag started off(document, 'mouseup', _this._onDrop); off(document, 'touchend', _this._onDrop); off(document, 'touchcancel', _this._onDrop); if (dataTransfer) { dataTransfer.effectAllowed = 'move'; options.setData && options.setData.call(_this, dataTransfer, dragEl); } on(document, 'drop', _this); // #1276 fix: css(dragEl, 'transform', 'translateZ(0)'); } awaitingDragStarted = true; _this._dragStartId = _nextTick(_this._dragStarted.bind(_this, fallback, evt)); on(document, 'selectstart', _this); moved = true; window.getSelection().removeAllRanges(); if (Safari) { css(document.body, 'user-select', 'none'); } }, // Returns true - if no further action is needed (either inserted or another condition) _onDragOver: function _onDragOver( /**Event*/evt) { var el = this.el, target = evt.target, dragRect, targetRect, revert, options = this.options, group = options.group, activeSortable = Sortable.active, isOwner = activeGroup === group, canSort = options.sort, fromSortable = putSortable || activeSortable, vertical, _this = this, completedFired = false; if (_silent) return; function dragOverEvent(name, extra) { pluginEvent(name, _this, _objectSpread2({ evt: evt, isOwner: isOwner, axis: vertical ? 'vertical' : 'horizontal', revert: revert, dragRect: dragRect, targetRect: targetRect, canSort: canSort, fromSortable: fromSortable, target: target, completed: completed, onMove: function onMove(target, after) { return _onMove(rootEl, el, dragEl, dragRect, target, getRect(target), evt, after); }, changed: changed }, extra)); } // Capture animation state function capture() { dragOverEvent('dragOverAnimationCapture'); _this.captureAnimationState(); if (_this !== fromSortable) { fromSortable.captureAnimationState(); } } // Return invocation when dragEl is inserted (or completed) function completed(insertion) { dragOverEvent('dragOverCompleted', { insertion: insertion }); if (insertion) { // Clones must be hidden before folding animation to capture dragRectAbsolute properly if (isOwner) { activeSortable._hideClone(); } else { activeSortable._showClone(_this); } if (_this !== fromSortable) { // Set ghost class to new sortable's ghost class toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : activeSortable.options.ghostClass, false); toggleClass(dragEl, options.ghostClass, true); } if (putSortable !== _this && _this !== Sortable.active) { putSortable = _this; } else if (_this === Sortable.active && putSortable) { putSortable = null; } // Animation if (fromSortable === _this) { _this._ignoreWhileAnimating = target; } _this.animateAll(function () { dragOverEvent('dragOverAnimationComplete'); _this._ignoreWhileAnimating = null; }); if (_this !== fromSortable) { fromSortable.animateAll(); fromSortable._ignoreWhileAnimating = null; } } // Null lastTarget if it is not inside a previously swapped element if (target === dragEl && !dragEl.animated || target === el && !target.animated) { lastTarget = null; } // no bubbling and not fallback if (!options.dragoverBubble && !evt.rootEl && target !== document) { dragEl.parentNode[expando]._isOutsideThisEl(evt.target); // Do not detect for empty insert if already inserted !insertion && nearestEmptyInsertDetectEvent(evt); } !options.dragoverBubble && evt.stopPropagation && evt.stopPropagation(); return completedFired = true; } // Call when dragEl has been inserted function changed() { newIndex = index(dragEl); newDraggableIndex = index(dragEl, options.draggable); _dispatchEvent({ sortable: _this, name: 'change', toEl: el, newIndex: newIndex, newDraggableIndex: newDraggableIndex, originalEvent: evt }); } if (evt.preventDefault !== void 0) { evt.cancelable && evt.preventDefault(); } target = closest(target, options.draggable, el, true); dragOverEvent('dragOver'); if (Sortable.eventCanceled) return completedFired; if (dragEl.contains(evt.target) || target.animated && target.animatingX && target.animatingY || _this._ignoreWhileAnimating === target) { return completed(false); } ignoreNextClick = false; if (activeSortable && !options.disabled && (isOwner ? canSort || (revert = parentEl !== rootEl) // Reverting item into the original list : putSortable === this || (this.lastPutMode = activeGroup.checkPull(this, activeSortable, dragEl, evt)) && group.checkPut(this, activeSortable, dragEl, evt))) { vertical = this._getDirection(evt, target) === 'vertical'; dragRect = getRect(dragEl); dragOverEvent('dragOverValid'); if (Sortable.eventCanceled) return completedFired; if (revert) { parentEl = rootEl; // actualization capture(); this._hideClone(); dragOverEvent('revert'); if (!Sortable.eventCanceled) { if (nextEl) { rootEl.insertBefore(dragEl, nextEl); } else { rootEl.appendChild(dragEl); } } return completed(true); } var elLastChild = lastChild(el, options.draggable); if (!elLastChild || _ghostIsLast(evt, vertical, this) && !elLastChild.animated) { // Insert to end of list // If already at end of list: Do not insert if (elLastChild === dragEl) { return completed(false); } // if there is a last element, it is the target if (elLastChild && el === evt.target) { target = elLastChild; } if (target) { targetRect = getRect(target); } if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, !!target) !== false) { capture(); if (elLastChild && elLastChild.nextSibling) { // the last draggable element is not the last node el.insertBefore(dragEl, elLastChild.nextSibling); } else { el.appendChild(dragEl); } parentEl = el; // actualization changed(); return completed(true); } } else if (elLastChild && _ghostIsFirst(evt, vertical, this)) { // Insert to start of list var firstChild = getChild(el, 0, options, true); if (firstChild === dragEl) { return completed(false); } target = firstChild; targetRect = getRect(target); if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, false) !== false) { capture(); el.insertBefore(dragEl, firstChild); parentEl = el; // actualization changed(); return completed(true); } } else if (target.parentNode === el) { targetRect = getRect(target); var direction = 0, targetBeforeFirstSwap, differentLevel = dragEl.parentNode !== el, differentRowCol = !_dragElInRowColumn(dragEl.animated && dragEl.toRect || dragRect, target.animated && target.toRect || targetRect, vertical), side1 = vertical ? 'top' : 'left', scrolledPastTop = isScrolledPast(target, 'top', 'top') || isScrolledPast(dragEl, 'top', 'top'), scrollBefore = scrolledPastTop ? scrolledPastTop.scrollTop : void 0; if (lastTarget !== target) { targetBeforeFirstSwap = targetRect[side1]; pastFirstInvertThresh = false; isCircumstantialInvert = !differentRowCol && options.invertSwap || differentLevel; } direction = _getSwapDirection(evt, target, targetRect, vertical, differentRowCol ? 1 : options.swapThreshold, options.invertedSwapThreshold == null ? options.swapThreshold : options.invertedSwapThreshold, isCircumstantialInvert, lastTarget === target); var sibling; if (direction !== 0) { // Check if target is beside dragEl in respective direction (ignoring hidden elements) var dragIndex = index(dragEl); do { dragIndex -= direction; sibling = parentEl.children[dragIndex]; } while (sibling && (css(sibling, 'display') === 'none' || sibling === ghostEl)); } // If dragEl is already beside target: Do not insert if (direction === 0 || sibling === target) { return completed(false); } lastTarget = target; lastDirection = direction; var nextSibling = target.nextElementSibling, after = false; after = direction === 1; var moveVector = _onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, after); if (moveVector !== false) { if (moveVector === 1 || moveVector === -1) { after = moveVector === 1; } _silent = true; setTimeout(_unsilent, 30); capture(); if (after && !nextSibling) { el.appendChild(dragEl); } else { target.parentNode.insertBefore(dragEl, after ? nextSibling : target); } // Undo chrome's scroll adjustment (has no effect on other browsers) if (scrolledPastTop) { scrollBy(scrolledPastTop, 0, scrollBefore - scrolledPastTop.scrollTop); } parentEl = dragEl.parentNode; // actualization // must be done before animation if (targetBeforeFirstSwap !== undefined && !isCircumstantialInvert) { targetMoveDistance = Math.abs(targetBeforeFirstSwap - getRect(target)[side1]); } changed(); return completed(true); } } if (el.contains(dragEl)) { return completed(false); } } return false; }, _ignoreWhileAnimating: null, _offMoveEvents: function _offMoveEvents() { off(document, 'mousemove', this._onTouchMove); off(document, 'touchmove', this._onTouchMove); off(document, 'pointermove', this._onTouchMove); off(document, 'dragover', nearestEmptyInsertDetectEvent); off(document, 'mousemove', nearestEmptyInsertDetectEvent); off(document, 'touchmove', nearestEmptyInsertDetectEvent); }, _offUpEvents: function _offUpEvents() { var ownerDocument = this.el.ownerDocument; off(ownerDocument, 'mouseup', this._onDrop); off(ownerDocument, 'touchend', this._onDrop); off(ownerDocument, 'pointerup', this._onDrop); off(ownerDocument, 'pointercancel', this._onDrop); off(ownerDocument, 'touchcancel', this._onDrop); off(document, 'selectstart', this); }, _onDrop: function _onDrop( /**Event*/evt) { var el = this.el, options = this.options; // Get the index of the dragged element within its parent newIndex = index(dragEl); newDraggableIndex = index(dragEl, options.draggable); pluginEvent('drop', this, { evt: evt }); parentEl = dragEl && dragEl.parentNode; // Get again after plugin event newIndex = index(dragEl); newDraggableIndex = index(dragEl, options.draggable); if (Sortable.eventCanceled) { this._nulling(); return; } awaitingDragStarted = false; isCircumstantialInvert = false; pastFirstInvertThresh = false; clearInterval(this._loopId); clearTimeout(this._dragStartTimer); _cancelNextTick(this.cloneId); _cancelNextTick(this._dragStartId); // Unbind events if (this.nativeDraggable) { off(document, 'drop', this); off(el, 'dragstart', this._onDragStart); } this._offMoveEvents(); this._offUpEvents(); if (Safari) { css(document.body, 'user-select', ''); } css(dragEl, 'transform', ''); if (evt) { if (moved) { evt.cancelable && evt.preventDefault(); !options.dropBubble && evt.stopPropagation(); } ghostEl && ghostEl.parentNode && ghostEl.parentNode.removeChild(ghostEl); if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') { // Remove clone(s) cloneEl && cloneEl.parentNode && cloneEl.parentNode.removeChild(cloneEl); } if (dragEl) { if (this.nativeDraggable) { off(dragEl, 'dragend', this); } _disableDraggable(dragEl); dragEl.style['will-change'] = ''; // Remove classes // ghostClass is added in dragStarted if (moved && !awaitingDragStarted) { toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : this.options.ghostClass, false); } toggleClass(dragEl, this.options.chosenClass, false); // Drag stop event _dispatchEvent({ sortable: this, name: 'unchoose', toEl: parentEl, newIndex: null, newDraggableIndex: null, originalEvent: evt }); if (rootEl !== parentEl) { if (newIndex >= 0) { // Add event _dispatchEvent({ rootEl: parentEl, name: 'add', toEl: parentEl, fromEl: rootEl, originalEvent: evt }); // Remove event _dispatchEvent({ sortable: this, name: 'remove', toEl: parentEl, originalEvent: evt }); // drag from one list and drop into another _dispatchEvent({ rootEl: parentEl, name: 'sort', toEl: parentEl, fromEl: rootEl, originalEvent: evt }); _dispatchEvent({ sortable: this, name: 'sort', toEl: parentEl, originalEvent: evt }); } putSortable && putSortable.save(); } else { if (newIndex !== oldIndex) { if (newIndex >= 0) { // drag & drop within the same list _dispatchEvent({ sortable: this, name: 'update', toEl: parentEl, originalEvent: evt }); _dispatchEvent({ sortable: this, name: 'sort', toEl: parentEl, originalEvent: evt }); } } } if (Sortable.active) { /* jshint eqnull:true */ if (newIndex == null || newIndex === -1) { newIndex = oldIndex; newDraggableIndex = oldDraggableIndex; } _dispatchEvent({ sortable: this, name: 'end', toEl: parentEl, originalEvent: evt }); // Save sorting this.save(); } } } this._nulling(); }, _nulling: function _nulling() { pluginEvent('nulling', this); rootEl = dragEl = parentEl = ghostEl = nextEl = cloneEl = lastDownEl = cloneHidden = tapEvt = touchEvt = moved = newIndex = newDraggableIndex = oldIndex = oldDraggableIndex = lastTarget = lastDirection = putSortable = activeGroup = Sortable.dragged = Sortable.ghost = Sortable.clone = Sortable.active = null; savedInputChecked.forEach(function (el) { el.checked = true; }); savedInputChecked.length = lastDx = lastDy = 0; }, handleEvent: function handleEvent( /**Event*/evt) { switch (evt.type) { case 'drop': case 'dragend': this._onDrop(evt); break; case 'dragenter': case 'dragover': if (dragEl) { this._onDragOver(evt); _globalDragOver(evt); } break; case 'selectstart': evt.preventDefault(); break; } }, /** * Serializes the item into an array of string. * @returns {String[]} */ toArray: function toArray() { var order = [], el, children = this.el.children, i = 0, n = children.length, options = this.options; for (; i < n; i++) { el = children[i]; if (closest(el, options.draggable, this.el, false)) { order.push(el.getAttribute(options.dataIdAttr) || _generateId(el)); } } return order; }, /** * Sorts the elements according to the array. * @param {String[]} order order of the items */ sort: function sort(order, useAnimation) { var items = {}, rootEl = this.el; this.toArray().forEach(function (id, i) { var el = rootEl.children[i]; if (closest(el, this.options.draggable, rootEl, false)) { items[id] = el; } }, this); useAnimation && this.captureAnimationState(); order.forEach(function (id) { if (items[id]) { rootEl.removeChild(items[id]); rootEl.appendChild(items[id]); } }); useAnimation && this.animateAll(); }, /** * Save the current sorting */ save: function save() { var store = this.options.store; store && store.set && store.set(this); }, /** * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree. * @param {HTMLElement} el * @param {String} [selector] default: `options.draggable` * @returns {HTMLElement|null} */ closest: function closest$1(el, selector) { return closest(el, selector || this.options.draggable, this.el, false); }, /** * Set/get option * @param {string} name * @param {*} [value] * @returns {*} */ option: function option(name, value) { var options = this.options; if (value === void 0) { return options[name]; } else { var modifiedValue = PluginManager.modifyOption(this, name, value); if (typeof modifiedValue !== 'undefined') { options[name] = modifiedValue; } else { options[name] = value; } if (name === 'group') { _prepareGroup(options); } } }, /** * Destroy */ destroy: function destroy() { pluginEvent('destroy', this); var el = this.el; el[expando] = null; off(el, 'mousedown', this._onTapStart); off(el, 'touchstart', this._onTapStart); off(el, 'pointerdown', this._onTapStart); if (this.nativeDraggable) { off(el, 'dragover', this); off(el, 'dragenter', this); } // Remove draggable attributes Array.prototype.forEach.call(el.querySelectorAll('[draggable]'), function (el) { el.removeAttribute('draggable'); }); this._onDrop(); this._disableDelayedDragEvents(); sortables.splice(sortables.indexOf(this.el), 1); this.el = el = null; }, _hideClone: function _hideClone() { if (!cloneHidden) { pluginEvent('hideClone', this); if (Sortable.eventCanceled) return; css(cloneEl, 'display', 'none'); if (this.options.removeCloneOnHide && cloneEl.parentNode) { cloneEl.parentNode.removeChild(cloneEl); } cloneHidden = true; } }, _showClone: function _showClone(putSortable) { if (putSortable.lastPutMode !== 'clone') { this._hideClone(); return; } if (cloneHidden) { pluginEvent('showClone', this); if (Sortable.eventCanceled) return; // show clone at dragEl or original position if (dragEl.parentNode == rootEl && !this.options.group.revertClone) { rootEl.insertBefore(cloneEl, dragEl); } else if (nextEl) { rootEl.insertBefore(cloneEl, nextEl); } else { rootEl.appendChild(cloneEl); } if (this.options.group.revertClone) { this.animate(dragEl, cloneEl); } css(cloneEl, 'display', ''); cloneHidden = false; } } }; function _globalDragOver( /**Event*/evt) { if (evt.dataTransfer) { evt.dataTransfer.dropEffect = 'move'; } evt.cancelable && evt.preventDefault(); } function _onMove(fromEl, toEl, dragEl, dragRect, targetEl, targetRect, originalEvent, willInsertAfter) { var evt, sortable = fromEl[expando], onMoveFn = sortable.options.onMove, retVal; // Support for new CustomEvent feature if (window.CustomEvent && !IE11OrLess && !Edge) { evt = new CustomEvent('move', { bubbles: true, cancelable: true }); } else { evt = document.createEvent('Event'); evt.initEvent('move', true, true); } evt.to = toEl; evt.from = fromEl; evt.dragged = dragEl; evt.draggedRect = dragRect; evt.related = targetEl || toEl; evt.relatedRect = targetRect || getRect(toEl); evt.willInsertAfter = willInsertAfter; evt.originalEvent = originalEvent; fromEl.dispatchEvent(evt); if (onMoveFn) { retVal = onMoveFn.call(sortable, evt, originalEvent); } return retVal; } function _disableDraggable(el) { el.draggable = false; } function _unsilent() { _silent = false; } function _ghostIsFirst(evt, vertical, sortable) { var firstElRect = getRect(getChild(sortable.el, 0, sortable.options, true)); var childContainingRect = getChildContainingRectFromElement(sortable.el, sortable.options, ghostEl); var spacer = 10; return vertical ? evt.clientX < childContainingRect.left - spacer || evt.clientY < firstElRect.top && evt.clientX < firstElRect.right : evt.clientY < childContainingRect.top - spacer || evt.clientY < firstElRect.bottom && evt.clientX < firstElRect.left; } function _ghostIsLast(evt, vertical, sortable) { var lastElRect = getRect(lastChild(sortable.el, sortable.options.draggable)); var childContainingRect = getChildContainingRectFromElement(sortable.el, sortable.options, ghostEl); var spacer = 10; return vertical ? evt.clientX > childContainingRect.right + spacer || evt.clientY > lastElRect.bottom && evt.clientX > lastElRect.left : evt.clientY > childContainingRect.bottom + spacer || evt.clientX > lastElRect.right && evt.clientY > lastElRect.top; } function _getSwapDirection(evt, target, targetRect, vertical, swapThreshold, invertedSwapThreshold, invertSwap, isLastTarget) { var mouseOnAxis = vertical ? evt.clientY : evt.clientX, targetLength = vertical ? targetRect.height : targetRect.width, targetS1 = vertical ? targetRect.top : targetRect.left, targetS2 = vertical ? targetRect.bottom : targetRect.right, invert = false; if (!invertSwap) { // Never invert or create dragEl shadow when target movemenet causes mouse to move past the end of regular swapThreshold if (isLastTarget && targetMoveDistance < targetLength * swapThreshold) { // multiplied only by swapThreshold because mouse will already be inside target by (1 - threshold) * targetLength / 2 // check if past first invert threshold on side opposite of lastDirection if (!pastFirstInvertThresh && (lastDirection === 1 ? mouseOnAxis > targetS1 + targetLength * invertedSwapThreshold / 2 : mouseOnAxis < targetS2 - targetLength * invertedSwapThreshold / 2)) { // past first invert threshold, do not restrict inverted threshold to dragEl shadow pastFirstInvertThresh = true; } if (!pastFirstInvertThresh) { // dragEl shadow (target move distance shadow) if (lastDirection === 1 ? mouseOnAxis < targetS1 + targetMoveDistance // over dragEl shadow : mouseOnAxis > targetS2 - targetMoveDistance) { return -lastDirection; } } else { invert = true; } } else { // Regular if (mouseOnAxis > targetS1 + targetLength * (1 - swapThreshold) / 2 && mouseOnAxis < targetS2 - targetLength * (1 - swapThreshold) / 2) { return _getInsertDirection(target); } } } invert = invert || invertSwap; if (invert) { // Invert of regular if (mouseOnAxis < targetS1 + targetLength * invertedSwapThreshold / 2 || mouseOnAxis > targetS2 - targetLength * invertedSwapThreshold / 2) { return mouseOnAxis > targetS1 + targetLength / 2 ? 1 : -1; } } return 0; } /** * Gets the direction dragEl must be swapped relative to target in order to make it * seem that dragEl has been "inserted" into that element's position * @param {HTMLElement} target The target whose position dragEl is being inserted at * @return {Number} Direction dragEl must be swapped */ function _getInsertDirection(target) { if (index(dragEl) < index(target)) { return 1; } else { return -1; } } /** * Generate id * @param {HTMLElement} el * @returns {String} * @private */ function _generateId(el) { var str = el.tagName + el.className + el.src + el.href + el.textContent, i = str.length, sum = 0; while (i--) { sum += str.charCodeAt(i); } return sum.toString(36); } function _saveInputCheckedState(root) { savedInputChecked.length = 0; var inputs = root.getElementsByTagName('input'); var idx = inputs.length; while (idx--) { var el = inputs[idx]; el.checked && savedInputChecked.push(el); } } function _nextTick(fn) { return setTimeout(fn, 0); } function _cancelNextTick(id) { return clearTimeout(id); } // Fixed #973: if (documentExists) { on(document, 'touchmove', function (evt) { if ((Sortable.active || awaitingDragStarted) && evt.cancelable) { evt.preventDefault(); } }); } // Export utils Sortable.utils = { on: on, off: off, css: css, find: find, is: function is(el, selector) { return !!closest(el, selector, el, false); }, extend: extend, throttle: throttle, closest: closest, toggleClass: toggleClass, clone: clone, index: index, nextTick: _nextTick, cancelNextTick: _cancelNextTick, detectDirection: _detectDirection, getChild: getChild, expando: expando }; /** * Get the Sortable instance of an element * @param {HTMLElement} element The element * @return {Sortable|undefined} The instance of Sortable */ Sortable.get = function (element) { return element[expando]; }; /** * Mount a plugin to Sortable * @param {...SortablePlugin|SortablePlugin[]} plugins Plugins being mounted */ Sortable.mount = function () { for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) { plugins[_key] = arguments[_key]; } if (plugins[0].constructor === Array) plugins = plugins[0]; plugins.forEach(function (plugin) { if (!plugin.prototype || !plugin.prototype.constructor) { throw "Sortable: Mounted plugin must be a constructor function, not ".concat({}.toString.call(plugin)); } if (plugin.utils) Sortable.utils = _objectSpread2(_objectSpread2({}, Sortable.utils), plugin.utils); PluginManager.mount(plugin); }); }; /** * Create sortable instance * @param {HTMLElement} el * @param {Object} [options] */ Sortable.create = function (el, options) { return new Sortable(el, options); }; // Export Sortable.version = version; var autoScrolls = [], scrollEl, scrollRootEl, scrolling = false, lastAutoScrollX, lastAutoScrollY, touchEvt$1, pointerElemChangedInterval; function AutoScrollPlugin() { function AutoScroll() { this.defaults = { scroll: true, forceAutoScrollFallback: false, scrollSensitivity: 30, scrollSpeed: 10, bubbleScroll: true }; // Bind all private methods for (var fn in this) { if (fn.charAt(0) === '_' && typeof this[fn] === 'function') { this[fn] = this[fn].bind(this); } } } AutoScroll.prototype = { dragStarted: function dragStarted(_ref) { var originalEvent = _ref.originalEvent; if (this.sortable.nativeDraggable) { on(document, 'dragover', this._handleAutoScroll); } else { if (this.options.supportPointer) { on(document, 'pointermove', this._handleFallbackAutoScroll); } else if (originalEvent.touches) { on(document, 'touchmove', this._handleFallbackAutoScroll); } else { on(document, 'mousemove', this._handleFallbackAutoScroll); } } }, dragOverCompleted: function dragOverCompleted(_ref2) { var originalEvent = _ref2.originalEvent; // For when bubbling is canceled and using fallback (fallback 'touchmove' always reached) if (!this.options.dragOverBubble && !originalEvent.rootEl) { this._handleAutoScroll(originalEvent); } }, drop: function drop() { if (this.sortable.nativeDraggable) { off(document, 'dragover', this._handleAutoScroll); } else { off(document, 'pointermove', this._handleFallbackAutoScroll); off(document, 'touchmove', this._handleFallbackAutoScroll); off(document, 'mousemove', this._handleFallbackAutoScroll); } clearPointerElemChangedInterval(); clearAutoScrolls(); cancelThrottle(); }, nulling: function nulling() { touchEvt$1 = scrollRootEl = scrollEl = scrolling = pointerElemChangedInterval = lastAutoScrollX = lastAutoScrollY = null; autoScrolls.length = 0; }, _handleFallbackAutoScroll: function _handleFallbackAutoScroll(evt) { this._handleAutoScroll(evt, true); }, _handleAutoScroll: function _handleAutoScroll(evt, fallback) { var _this = this; var x = (evt.touches ? evt.touches[0] : evt).clientX, y = (evt.touches ? evt.touches[0] : evt).clientY, elem = document.elementFromPoint(x, y); touchEvt$1 = evt; // IE does not seem to have native autoscroll, // Edge's autoscroll seems too conditional, // MACOS Safari does not have autoscroll, // Firefox and Chrome are good if (fallback || this.options.forceAutoScrollFallback || Edge || IE11OrLess || Safari) { autoScroll(evt, this.options, elem, fallback); // Listener for pointer element change var ogElemScroller = getParentAutoScrollElement(elem, true); if (scrolling && (!pointerElemChangedInterval || x !== lastAutoScrollX || y !== lastAutoScrollY)) { pointerElemChangedInterval && clearPointerElemChangedInterval(); // Detect for pointer elem change, emulating native DnD behaviour pointerElemChangedInterval = setInterval(function () { var newElem = getParentAutoScrollElement(document.elementFromPoint(x, y), true); if (newElem !== ogElemScroller) { ogElemScroller = newElem; clearAutoScrolls(); } autoScroll(evt, _this.options, newElem, fallback); }, 10); lastAutoScrollX = x; lastAutoScrollY = y; } } else { // if DnD is enabled (and browser has good autoscrolling), first autoscroll will already scroll, so get parent autoscroll of first autoscroll if (!this.options.bubbleScroll || getParentAutoScrollElement(elem, true) === getWindowScrollingElement()) { clearAutoScrolls(); return; } autoScroll(evt, this.options, getParentAutoScrollElement(elem, false), false); } } }; return _extends(AutoScroll, { pluginName: 'scroll', initializeByDefault: true }); } function clearAutoScrolls() { autoScrolls.forEach(function (autoScroll) { clearInterval(autoScroll.pid); }); autoScrolls = []; } function clearPointerElemChangedInterval() { clearInterval(pointerElemChangedInterval); } var autoScroll = throttle(function (evt, options, rootEl, isFallback) { // Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=505521 if (!options.scroll) return; var x = (evt.touches ? evt.touches[0] : evt).clientX, y = (evt.touches ? evt.touches[0] : evt).clientY, sens = options.scrollSensitivity, speed = options.scrollSpeed, winScroller = getWindowScrollingElement(); var scrollThisInstance = false, scrollCustomFn; // New scroll root, set scrollEl if (scrollRootEl !== rootEl) { scrollRootEl = rootEl; clearAutoScrolls(); scrollEl = options.scroll; scrollCustomFn = options.scrollFn; if (scrollEl === true) { scrollEl = getParentAutoScrollElement(rootEl, true); } } var layersOut = 0; var currentParent = scrollEl; do { var el = currentParent, rect = getRect(el), top = rect.top, bottom = rect.bottom, left = rect.left, right = rect.right, width = rect.width, height = rect.height, canScrollX = void 0, canScrollY = void 0, scrollWidth = el.scrollWidth, scrollHeight = el.scrollHeight, elCSS = css(el), scrollPosX = el.scrollLeft, scrollPosY = el.scrollTop; if (el === winScroller) { canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll' || elCSS.overflowX === 'visible'); canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll' || elCSS.overflowY === 'visible'); } else { canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll'); canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll'); } var vx = canScrollX && (Math.abs(right - x) <= sens && scrollPosX + width < scrollWidth) - (Math.abs(left - x) <= sens && !!scrollPosX); var vy = canScrollY && (Math.abs(bottom - y) <= sens && scrollPosY + height < scrollHeight) - (Math.abs(top - y) <= sens && !!scrollPosY); if (!autoScrolls[layersOut]) { for (var i = 0; i <= layersOut; i++) { if (!autoScrolls[i]) { autoScrolls[i] = {}; } } } if (autoScrolls[layersOut].vx != vx || autoScrolls[layersOut].vy != vy || autoScrolls[layersOut].el !== el) { autoScrolls[layersOut].el = el; autoScrolls[layersOut].vx = vx; autoScrolls[layersOut].vy = vy; clearInterval(autoScrolls[layersOut].pid); if (vx != 0 || vy != 0) { scrollThisInstance = true; /* jshint loopfunc:true */ autoScrolls[layersOut].pid = setInterval(function () { // emulate drag over during autoscroll (fallback), emulating native DnD behaviour if (isFallback && this.layer === 0) { Sortable.active._onTouchMove(touchEvt$1); // To move ghost if it is positioned absolutely } var scrollOffsetY = autoScrolls[this.layer].vy ? autoScrolls[this.layer].vy * speed : 0; var scrollOffsetX = autoScrolls[this.layer].vx ? autoScrolls[this.layer].vx * speed : 0; if (typeof scrollCustomFn === 'function') { if (scrollCustomFn.call(Sortable.dragged.parentNode[expando], scrollOffsetX, scrollOffsetY, evt, touchEvt$1, autoScrolls[this.layer].el) !== 'continue') { return; } } scrollBy(autoScrolls[this.layer].el, scrollOffsetX, scrollOffsetY); }.bind({ layer: layersOut }), 24); } } layersOut++; } while (options.bubbleScroll && currentParent !== winScroller && (currentParent = getParentAutoScrollElement(currentParent, false))); scrolling = scrollThisInstance; // in case another function catches scrolling as false in between when it is not }, 30); var drop = function drop(_ref) { var originalEvent = _ref.originalEvent, putSortable = _ref.putSortable, dragEl = _ref.dragEl, activeSortable = _ref.activeSortable, dispatchSortableEvent = _ref.dispatchSortableEvent, hideGhostForTarget = _ref.hideGhostForTarget, unhideGhostForTarget = _ref.unhideGhostForTarget; if (!originalEvent) return; var toSortable = putSortable || activeSortable; hideGhostForTarget(); var touch = originalEvent.changedTouches && originalEvent.changedTouches.length ? originalEvent.changedTouches[0] : originalEvent; var target = document.elementFromPoint(touch.clientX, touch.clientY); unhideGhostForTarget(); if (toSortable && !toSortable.el.contains(target)) { dispatchSortableEvent('spill'); this.onSpill({ dragEl: dragEl, putSortable: putSortable }); } }; function Revert() {} Revert.prototype = { startIndex: null, dragStart: function dragStart(_ref2) { var oldDraggableIndex = _ref2.oldDraggableIndex; this.startIndex = oldDraggableIndex; }, onSpill: function onSpill(_ref3) { var dragEl = _ref3.dragEl, putSortable = _ref3.putSortable; this.sortable.captureAnimationState(); if (putSortable) { putSortable.captureAnimationState(); } var nextSibling = getChild(this.sortable.el, this.startIndex, this.options); if (nextSibling) { this.sortable.el.insertBefore(dragEl, nextSibling); } else { this.sortable.el.appendChild(dragEl); } this.sortable.animateAll(); if (putSortable) { putSortable.animateAll(); } }, drop: drop }; _extends(Revert, { pluginName: 'revertOnSpill' }); function Remove() {} Remove.prototype = { onSpill: function onSpill(_ref4) { var dragEl = _ref4.dragEl, putSortable = _ref4.putSortable; var parentSortable = putSortable || this.sortable; parentSortable.captureAnimationState(); dragEl.parentNode && dragEl.parentNode.removeChild(dragEl); parentSortable.animateAll(); }, drop: drop }; _extends(Remove, { pluginName: 'removeOnSpill' }); var lastSwapEl; function SwapPlugin() { function Swap() { this.defaults = { swapClass: 'sortable-swap-highlight' }; } Swap.prototype = { dragStart: function dragStart(_ref) { var dragEl = _ref.dragEl; lastSwapEl = dragEl; }, dragOverValid: function dragOverValid(_ref2) { var completed = _ref2.completed, target = _ref2.target, onMove = _ref2.onMove, activeSortable = _ref2.activeSortable, changed = _ref2.changed, cancel = _ref2.cancel; if (!activeSortable.options.swap) return; var el = this.sortable.el, options = this.options; if (target && target !== el) { var prevSwapEl = lastSwapEl; if (onMove(target) !== false) { toggleClass(target, options.swapClass, true); lastSwapEl = target; } else { lastSwapEl = null; } if (prevSwapEl && prevSwapEl !== lastSwapEl) { toggleClass(prevSwapEl, options.swapClass, false); } } changed(); completed(true); cancel(); }, drop: function drop(_ref3) { var activeSortable = _ref3.activeSortable, putSortable = _ref3.putSortable, dragEl = _ref3.dragEl; var toSortable = putSortable || this.sortable; var options = this.options; lastSwapEl && toggleClass(lastSwapEl, options.swapClass, false); if (lastSwapEl && (options.swap || putSortable && putSortable.options.swap)) { if (dragEl !== lastSwapEl) { toSortable.captureAnimationState(); if (toSortable !== activeSortable) activeSortable.captureAnimationState(); swapNodes(dragEl, lastSwapEl); toSortable.animateAll(); if (toSortable !== activeSortable) activeSortable.animateAll(); } } }, nulling: function nulling() { lastSwapEl = null; } }; return _extends(Swap, { pluginName: 'swap', eventProperties: function eventProperties() { return { swapItem: lastSwapEl }; } }); } function swapNodes(n1, n2) { var p1 = n1.parentNode, p2 = n2.parentNode, i1, i2; if (!p1 || !p2 || p1.isEqualNode(n2) || p2.isEqualNode(n1)) return; i1 = index(n1); i2 = index(n2); if (p1.isEqualNode(p2) && i1 < i2) { i2++; } p1.insertBefore(n2, p1.children[i1]); p2.insertBefore(n1, p2.children[i2]); } var multiDragElements = [], multiDragClones = [], lastMultiDragSelect, // for selection with modifier key down (SHIFT) multiDragSortable, initialFolding = false, // Initial multi-drag fold when drag started folding = false, // Folding any other time dragStarted = false, dragEl$1, clonesFromRect, clonesHidden; function MultiDragPlugin() { function MultiDrag(sortable) { // Bind all private methods for (var fn in this) { if (fn.charAt(0) === '_' && typeof this[fn] === 'function') { this[fn] = this[fn].bind(this); } } if (!sortable.options.avoidImplicitDeselect) { if (sortable.options.supportPointer) { on(document, 'pointerup', this._deselectMultiDrag); } else { on(document, 'mouseup', this._deselectMultiDrag); on(document, 'touchend', this._deselectMultiDrag); } } on(document, 'keydown', this._checkKeyDown); on(document, 'keyup', this._checkKeyUp); this.defaults = { selectedClass: 'sortable-selected', multiDragKey: null, avoidImplicitDeselect: false, setData: function setData(dataTransfer, dragEl) { var data = ''; if (multiDragElements.length && multiDragSortable === sortable) { multiDragElements.forEach(function (multiDragElement, i) { data += (!i ? '' : ', ') + multiDragElement.textContent; }); } else { data = dragEl.textContent; } dataTransfer.setData('Text', data); } }; } MultiDrag.prototype = { multiDragKeyDown: false, isMultiDrag: false, delayStartGlobal: function delayStartGlobal(_ref) { var dragged = _ref.dragEl; dragEl$1 = dragged; }, delayEnded: function delayEnded() { this.isMultiDrag = ~multiDragElements.indexOf(dragEl$1); }, setupClone: function setupClone(_ref2) { var sortable = _ref2.sortable, cancel = _ref2.cancel; if (!this.isMultiDrag) return; for (var i = 0; i < multiDragElements.length; i++) { multiDragClones.push(clone(multiDragElements[i])); multiDragClones[i].sortableIndex = multiDragElements[i].sortableIndex; multiDragClones[i].draggable = false; multiDragClones[i].style['will-change'] = ''; toggleClass(multiDragClones[i], this.options.selectedClass, false); multiDragElements[i] === dragEl$1 && toggleClass(multiDragClones[i], this.options.chosenClass, false); } sortable._hideClone(); cancel(); }, clone: function clone(_ref3) { var sortable = _ref3.sortable, rootEl = _ref3.rootEl, dispatchSortableEvent = _ref3.dispatchSortableEvent, cancel = _ref3.cancel; if (!this.isMultiDrag) return; if (!this.options.removeCloneOnHide) { if (multiDragElements.length && multiDragSortable === sortable) { insertMultiDragClones(true, rootEl); dispatchSortableEvent('clone'); cancel(); } } }, showClone: function showClone(_ref4) { var cloneNowShown = _ref4.cloneNowShown, rootEl = _ref4.rootEl, cancel = _ref4.cancel; if (!this.isMultiDrag) return; insertMultiDragClones(false, rootEl); multiDragClones.forEach(function (clone) { css(clone, 'display', ''); }); cloneNowShown(); clonesHidden = false; cancel(); }, hideClone: function hideClone(_ref5) { var _this = this; var sortable = _ref5.sortable, cloneNowHidden = _ref5.cloneNowHidden, cancel = _ref5.cancel; if (!this.isMultiDrag) return; multiDragClones.forEach(function (clone) { css(clone, 'display', 'none'); if (_this.options.removeCloneOnHide && clone.parentNode) { clone.parentNode.removeChild(clone); } }); cloneNowHidden(); clonesHidden = true; cancel(); }, dragStartGlobal: function dragStartGlobal(_ref6) { var sortable = _ref6.sortable; if (!this.isMultiDrag && multiDragSortable) { multiDragSortable.multiDrag._deselectMultiDrag(); } multiDragElements.forEach(function (multiDragElement) { multiDragElement.sortableIndex = index(multiDragElement); }); // Sort multi-drag elements multiDragElements = multiDragElements.sort(function (a, b) { return a.sortableIndex - b.sortableIndex; }); dragStarted = true; }, dragStarted: function dragStarted(_ref7) { var _this2 = this; var sortable = _ref7.sortable; if (!this.isMultiDrag) return; if (this.options.sort) { // Capture rects, // hide multi drag elements (by positioning them absolute), // set multi drag elements rects to dragRect, // show multi drag elements, // animate to rects, // unset rects & remove from DOM sortable.captureAnimationState(); if (this.options.animation) { multiDragElements.forEach(function (multiDragElement) { if (multiDragElement === dragEl$1) return; css(multiDragElement, 'position', 'absolute'); }); var dragRect = getRect(dragEl$1, false, true, true); multiDragElements.forEach(function (multiDragElement) { if (multiDragElement === dragEl$1) return; setRect(multiDragElement, dragRect); }); folding = true; initialFolding = true; } } sortable.animateAll(function () { folding = false; initialFolding = false; if (_this2.options.animation) { multiDragElements.forEach(function (multiDragElement) { unsetRect(multiDragElement); }); } // Remove all auxiliary multidrag items from el, if sorting enabled if (_this2.options.sort) { removeMultiDragElements(); } }); }, dragOver: function dragOver(_ref8) { var target = _ref8.target, completed = _ref8.completed, cancel = _ref8.cancel; if (folding && ~multiDragElements.indexOf(target)) { completed(false); cancel(); } }, revert: function revert(_ref9) { var fromSortable = _ref9.fromSortable, rootEl = _ref9.rootEl, sortable = _ref9.sortable, dragRect = _ref9.dragRect; if (multiDragElements.length > 1) { // Setup unfold animation multiDragElements.forEach(function (multiDragElement) { sortable.addAnimationState({ target: multiDragElement, rect: folding ? getRect(multiDragElement) : dragRect }); unsetRect(multiDragElement); multiDragElement.fromRect = dragRect; fromSortable.removeAnimationState(multiDragElement); }); folding = false; insertMultiDragElements(!this.options.removeCloneOnHide, rootEl); } }, dragOverCompleted: function dragOverCompleted(_ref10) { var sortable = _ref10.sortable, isOwner = _ref10.isOwner, insertion = _ref10.insertion, activeSortable = _ref10.activeSortable, parentEl = _ref10.parentEl, putSortable = _ref10.putSortable; var options = this.options; if (insertion) { // Clones must be hidden before folding animation to capture dragRectAbsolute properly if (isOwner) { activeSortable._hideClone(); } initialFolding = false; // If leaving sort:false root, or already folding - Fold to new location if (options.animation && multiDragElements.length > 1 && (folding || !isOwner && !activeSortable.options.sort && !putSortable)) { // Fold: Set all multi drag elements's rects to dragEl's rect when multi-drag elements are invisible var dragRectAbsolute = getRect(dragEl$1, false, true, true); multiDragElements.forEach(function (multiDragElement) { if (multiDragElement === dragEl$1) return; setRect(multiDragElement, dragRectAbsolute); // Move element(s) to end of parentEl so that it does not interfere with multi-drag clones insertion if they are inserted // while folding, and so that we can capture them again because old sortable will no longer be fromSortable parentEl.appendChild(multiDragElement); }); folding = true; } // Clones must be shown (and check to remove multi drags) after folding when interfering multiDragElements are moved out if (!isOwner) { // Only remove if not folding (folding will remove them anyways) if (!folding) { removeMultiDragElements(); } if (multiDragElements.length > 1) { var clonesHiddenBefore = clonesHidden; activeSortable._showClone(sortable); // Unfold animation for clones if showing from hidden if (activeSortable.options.animation && !clonesHidden && clonesHiddenBefore) { multiDragClones.forEach(function (clone) { activeSortable.addAnimationState({ target: clone, rect: clonesFromRect }); clone.fromRect = clonesFromRect; clone.thisAnimationDuration = null; }); } } else { activeSortable._showClone(sortable); } } } }, dragOverAnimationCapture: function dragOverAnimationCapture(_ref11) { var dragRect = _ref11.dragRect, isOwner = _ref11.isOwner, activeSortable = _ref11.activeSortable; multiDragElements.forEach(function (multiDragElement) { multiDragElement.thisAnimationDuration = null; }); if (activeSortable.options.animation && !isOwner && activeSortable.multiDrag.isMultiDrag) { clonesFromRect = _extends({}, dragRect); var dragMatrix = matrix(dragEl$1, true); clonesFromRect.top -= dragMatrix.f; clonesFromRect.left -= dragMatrix.e; } }, dragOverAnimationComplete: function dragOverAnimationComplete() { if (folding) { folding = false; removeMultiDragElements(); } }, drop: function drop(_ref12) { var evt = _ref12.originalEvent, rootEl = _ref12.rootEl, parentEl = _ref12.parentEl, sortable = _ref12.sortable, dispatchSortableEvent = _ref12.dispatchSortableEvent, oldIndex = _ref12.oldIndex, putSortable = _ref12.putSortable; var toSortable = putSortable || this.sortable; if (!evt) return; var options = this.options, children = parentEl.children; // Multi-drag selection if (!dragStarted) { if (options.multiDragKey && !this.multiDragKeyDown) { this._deselectMultiDrag(); } toggleClass(dragEl$1, options.selectedClass, !~multiDragElements.indexOf(dragEl$1)); if (!~multiDragElements.indexOf(dragEl$1)) { multiDragElements.push(dragEl$1); dispatchEvent({ sortable: sortable, rootEl: rootEl, name: 'select', targetEl: dragEl$1, originalEvent: evt }); // Modifier activated, select from last to dragEl if (evt.shiftKey && lastMultiDragSelect && sortable.el.contains(lastMultiDragSelect)) { var lastIndex = index(lastMultiDragSelect), currentIndex = index(dragEl$1); if (~lastIndex && ~currentIndex && lastIndex !== currentIndex) { (function () { // Must include lastMultiDragSelect (select it), in case modified selection from no selection // (but previous selection existed) var n, i; if (currentIndex > lastIndex) { i = lastIndex; n = currentIndex; } else { i = currentIndex; n = lastIndex + 1; } var filter = options.filter; for (; i < n; i++) { if (~multiDragElements.indexOf(children[i])) continue; // Check if element is draggable if (!closest(children[i], options.draggable, parentEl, false)) continue; // Check if element is filtered var filtered = filter && (typeof filter === 'function' ? filter.call(sortable, evt, children[i], sortable) : filter.split(',').some(function (criteria) { return closest(children[i], criteria.trim(), parentEl, false); })); if (filtered) continue; toggleClass(children[i], options.selectedClass, true); multiDragElements.push(children[i]); dispatchEvent({ sortable: sortable, rootEl: rootEl, name: 'select', targetEl: children[i], originalEvent: evt }); } })(); } } else { lastMultiDragSelect = dragEl$1; } multiDragSortable = toSortable; } else { multiDragElements.splice(multiDragElements.indexOf(dragEl$1), 1); lastMultiDragSelect = null; dispatchEvent({ sortable: sortable, rootEl: rootEl, name: 'deselect', targetEl: dragEl$1, originalEvent: evt }); } } // Multi-drag drop if (dragStarted && this.isMultiDrag) { folding = false; // Do not "unfold" after around dragEl if reverted if ((parentEl[expando].options.sort || parentEl !== rootEl) && multiDragElements.length > 1) { var dragRect = getRect(dragEl$1), multiDragIndex = index(dragEl$1, ':not(.' + this.options.selectedClass + ')'); if (!initialFolding && options.animation) dragEl$1.thisAnimationDuration = null; toSortable.captureAnimationState(); if (!initialFolding) { if (options.animation) { dragEl$1.fromRect = dragRect; multiDragElements.forEach(function (multiDragElement) { multiDragElement.thisAnimationDuration = null; if (multiDragElement !== dragEl$1) { var rect = folding ? getRect(multiDragElement) : dragRect; multiDragElement.fromRect = rect; // Prepare unfold animation toSortable.addAnimationState({ target: multiDragElement, rect: rect }); } }); } // Multi drag elements are not necessarily removed from the DOM on drop, so to reinsert // properly they must all be removed removeMultiDragElements(); multiDragElements.forEach(function (multiDragElement) { if (children[multiDragIndex]) { parentEl.insertBefore(multiDragElement, children[multiDragIndex]); } else { parentEl.appendChild(multiDragElement); } multiDragIndex++; }); // If initial folding is done, the elements may have changed position because they are now // unfolding around dragEl, even though dragEl may not have his index changed, so update event // must be fired here as Sortable will not. if (oldIndex === index(dragEl$1)) { var update = false; multiDragElements.forEach(function (multiDragElement) { if (multiDragElement.sortableIndex !== index(multiDragElement)) { update = true; return; } }); if (update) { dispatchSortableEvent('update'); dispatchSortableEvent('sort'); } } } // Must be done after capturing individual rects (scroll bar) multiDragElements.forEach(function (multiDragElement) { unsetRect(multiDragElement); }); toSortable.animateAll(); } multiDragSortable = toSortable; } // Remove clones if necessary if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') { multiDragClones.forEach(function (clone) { clone.parentNode && clone.parentNode.removeChild(clone); }); } }, nullingGlobal: function nullingGlobal() { this.isMultiDrag = dragStarted = false; multiDragClones.length = 0; }, destroyGlobal: function destroyGlobal() { this._deselectMultiDrag(); off(document, 'pointerup', this._deselectMultiDrag); off(document, 'mouseup', this._deselectMultiDrag); off(document, 'touchend', this._deselectMultiDrag); off(document, 'keydown', this._checkKeyDown); off(document, 'keyup', this._checkKeyUp); }, _deselectMultiDrag: function _deselectMultiDrag(evt) { if (typeof dragStarted !== "undefined" && dragStarted) return; // Only deselect if selection is in this sortable if (multiDragSortable !== this.sortable) return; // Only deselect if target is not item in this sortable if (evt && closest(evt.target, this.options.draggable, this.sortable.el, false)) return; // Only deselect if left click if (evt && evt.button !== 0) return; while (multiDragElements.length) { var el = multiDragElements[0]; toggleClass(el, this.options.selectedClass, false); multiDragElements.shift(); dispatchEvent({ sortable: this.sortable, rootEl: this.sortable.el, name: 'deselect', targetEl: el, originalEvent: evt }); } }, _checkKeyDown: function _checkKeyDown(evt) { if (evt.key === this.options.multiDragKey) { this.multiDragKeyDown = true; } }, _checkKeyUp: function _checkKeyUp(evt) { if (evt.key === this.options.multiDragKey) { this.multiDragKeyDown = false; } } }; return _extends(MultiDrag, { // Static methods & properties pluginName: 'multiDrag', utils: { /** * Selects the provided multi-drag item * @param {HTMLElement} el The element to be selected */ select: function select(el) { var sortable = el.parentNode[expando]; if (!sortable || !sortable.options.multiDrag || ~multiDragElements.indexOf(el)) return; if (multiDragSortable && multiDragSortable !== sortable) { multiDragSortable.multiDrag._deselectMultiDrag(); multiDragSortable = sortable; } toggleClass(el, sortable.options.selectedClass, true); multiDragElements.push(el); }, /** * Deselects the provided multi-drag item * @param {HTMLElement} el The element to be deselected */ deselect: function deselect(el) { var sortable = el.parentNode[expando], index = multiDragElements.indexOf(el); if (!sortable || !sortable.options.multiDrag || !~index) return; toggleClass(el, sortable.options.selectedClass, false); multiDragElements.splice(index, 1); } }, eventProperties: function eventProperties() { var _this3 = this; var oldIndicies = [], newIndicies = []; multiDragElements.forEach(function (multiDragElement) { oldIndicies.push({ multiDragElement: multiDragElement, index: multiDragElement.sortableIndex }); // multiDragElements will already be sorted if folding var newIndex; if (folding && multiDragElement !== dragEl$1) { newIndex = -1; } else if (folding) { newIndex = index(multiDragElement, ':not(.' + _this3.options.selectedClass + ')'); } else { newIndex = index(multiDragElement); } newIndicies.push({ multiDragElement: multiDragElement, index: newIndex }); }); return { items: _toConsumableArray(multiDragElements), clones: [].concat(multiDragClones), oldIndicies: oldIndicies, newIndicies: newIndicies }; }, optionListeners: { multiDragKey: function multiDragKey(key) { key = key.toLowerCase(); if (key === 'ctrl') { key = 'Control'; } else if (key.length > 1) { key = key.charAt(0).toUpperCase() + key.substr(1); } return key; } } }); } function insertMultiDragElements(clonesInserted, rootEl) { multiDragElements.forEach(function (multiDragElement, i) { var target = rootEl.children[multiDragElement.sortableIndex + (clonesInserted ? Number(i) : 0)]; if (target) { rootEl.insertBefore(multiDragElement, target); } else { rootEl.appendChild(multiDragElement); } }); } /** * Insert multi-drag clones * @param {[Boolean]} elementsInserted Whether the multi-drag elements are inserted * @param {HTMLElement} rootEl */ function insertMultiDragClones(elementsInserted, rootEl) { multiDragClones.forEach(function (clone, i) { var target = rootEl.children[clone.sortableIndex + (elementsInserted ? Number(i) : 0)]; if (target) { rootEl.insertBefore(clone, target); } else { rootEl.appendChild(clone); } }); } function removeMultiDragElements() { multiDragElements.forEach(function (multiDragElement) { if (multiDragElement === dragEl$1) return; multiDragElement.parentNode && multiDragElement.parentNode.removeChild(multiDragElement); }); } Sortable.mount(new AutoScrollPlugin()); Sortable.mount(Remove, Revert); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Sortable); /***/ }), /***/ "./node_modules/toastify-js/src/toastify.css": /*!***************************************************!*\ !*** ./node_modules/toastify-js/src/toastify.css ***! \***************************************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var _style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../../style-loader/dist/runtime/injectStylesIntoStyleTag.js */ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"); /* harmony import */ var _style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../../style-loader/dist/runtime/styleDomAPI.js */ "./node_modules/style-loader/dist/runtime/styleDomAPI.js"); /* harmony import */ var _style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../../style-loader/dist/runtime/insertBySelector.js */ "./node_modules/style-loader/dist/runtime/insertBySelector.js"); /* harmony import */ var _style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__); /* harmony import */ var _style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../../style-loader/dist/runtime/setAttributesWithoutAttributes.js */ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"); /* harmony import */ var _style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__); /* harmony import */ var _style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../../style-loader/dist/runtime/insertStyleElement.js */ "./node_modules/style-loader/dist/runtime/insertStyleElement.js"); /* harmony import */ var _style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__); /* harmony import */ var _style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../../style-loader/dist/runtime/styleTagTransform.js */ "./node_modules/style-loader/dist/runtime/styleTagTransform.js"); /* harmony import */ var _style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__); /* harmony import */ var _css_loader_dist_cjs_js_toastify_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../../css-loader/dist/cjs.js!./toastify.css */ "./node_modules/css-loader/dist/cjs.js!./node_modules/toastify-js/src/toastify.css"); var options = {}; options.styleTagTransform = (_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default()); options.setAttributes = (_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default()); options.insert = _style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, "head"); options.domAPI = (_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default()); options.insertStyleElement = (_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default()); var update = _style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_css_loader_dist_cjs_js_toastify_css__WEBPACK_IMPORTED_MODULE_6__["default"], options); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_css_loader_dist_cjs_js_toastify_css__WEBPACK_IMPORTED_MODULE_6__["default"] && _css_loader_dist_cjs_js_toastify_css__WEBPACK_IMPORTED_MODULE_6__["default"].locals ? _css_loader_dist_cjs_js_toastify_css__WEBPACK_IMPORTED_MODULE_6__["default"].locals : undefined); /***/ }), /***/ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js": /*!****************************************************************************!*\ !*** ./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js ***! \****************************************************************************/ /***/ ((module) => { "use strict"; var stylesInDOM = []; function getIndexByIdentifier(identifier) { var result = -1; for (var i = 0; i < stylesInDOM.length; i++) { if (stylesInDOM[i].identifier === identifier) { result = i; break; } } return result; } function modulesToDom(list, options) { var idCountMap = {}; var identifiers = []; for (var i = 0; i < list.length; i++) { var item = list[i]; var id = options.base ? item[0] + options.base : item[0]; var count = idCountMap[id] || 0; var identifier = "".concat(id, " ").concat(count); idCountMap[id] = count + 1; var indexByIdentifier = getIndexByIdentifier(identifier); var obj = { css: item[1], media: item[2], sourceMap: item[3], supports: item[4], layer: item[5] }; if (indexByIdentifier !== -1) { stylesInDOM[indexByIdentifier].references++; stylesInDOM[indexByIdentifier].updater(obj); } else { var updater = addElementStyle(obj, options); options.byIndex = i; stylesInDOM.splice(i, 0, { identifier: identifier, updater: updater, references: 1 }); } identifiers.push(identifier); } return identifiers; } function addElementStyle(obj, options) { var api = options.domAPI(options); api.update(obj); var updater = function updater(newObj) { if (newObj) { if (newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap && newObj.supports === obj.supports && newObj.layer === obj.layer) { return; } api.update(obj = newObj); } else { api.remove(); } }; return updater; } module.exports = function (list, options) { options = options || {}; list = list || []; var lastIdentifiers = modulesToDom(list, options); return function update(newList) { newList = newList || []; for (var i = 0; i < lastIdentifiers.length; i++) { var identifier = lastIdentifiers[i]; var index = getIndexByIdentifier(identifier); stylesInDOM[index].references--; } var newLastIdentifiers = modulesToDom(newList, options); for (var _i = 0; _i < lastIdentifiers.length; _i++) { var _identifier = lastIdentifiers[_i]; var _index = getIndexByIdentifier(_identifier); if (stylesInDOM[_index].references === 0) { stylesInDOM[_index].updater(); stylesInDOM.splice(_index, 1); } } lastIdentifiers = newLastIdentifiers; }; }; /***/ }), /***/ "./node_modules/style-loader/dist/runtime/insertBySelector.js": /*!********************************************************************!*\ !*** ./node_modules/style-loader/dist/runtime/insertBySelector.js ***! \********************************************************************/ /***/ ((module) => { "use strict"; var memo = {}; /* istanbul ignore next */ function getTarget(target) { if (typeof memo[target] === "undefined") { var styleTarget = document.querySelector(target); // Special case to return head of iframe instead of iframe itself if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) { try { // This will throw an exception if access to iframe is blocked // due to cross-origin restrictions styleTarget = styleTarget.contentDocument.head; } catch (e) { // istanbul ignore next styleTarget = null; } } memo[target] = styleTarget; } return memo[target]; } /* istanbul ignore next */ function insertBySelector(insert, style) { var target = getTarget(insert); if (!target) { throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid."); } target.appendChild(style); } module.exports = insertBySelector; /***/ }), /***/ "./node_modules/style-loader/dist/runtime/insertStyleElement.js": /*!**********************************************************************!*\ !*** ./node_modules/style-loader/dist/runtime/insertStyleElement.js ***! \**********************************************************************/ /***/ ((module) => { "use strict"; /* istanbul ignore next */ function insertStyleElement(options) { var element = document.createElement("style"); options.setAttributes(element, options.attributes); options.insert(element, options.options); return element; } module.exports = insertStyleElement; /***/ }), /***/ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js": /*!**********************************************************************************!*\ !*** ./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js ***! \**********************************************************************************/ /***/ ((module, __unused_webpack_exports, __webpack_require__) => { "use strict"; /* istanbul ignore next */ function setAttributesWithoutAttributes(styleElement) { var nonce = true ? __webpack_require__.nc : 0; if (nonce) { styleElement.setAttribute("nonce", nonce); } } module.exports = setAttributesWithoutAttributes; /***/ }), /***/ "./node_modules/style-loader/dist/runtime/styleDomAPI.js": /*!***************************************************************!*\ !*** ./node_modules/style-loader/dist/runtime/styleDomAPI.js ***! \***************************************************************/ /***/ ((module) => { "use strict"; /* istanbul ignore next */ function apply(styleElement, options, obj) { var css = ""; if (obj.supports) { css += "@supports (".concat(obj.supports, ") {"); } if (obj.media) { css += "@media ".concat(obj.media, " {"); } var needLayer = typeof obj.layer !== "undefined"; if (needLayer) { css += "@layer".concat(obj.layer.length > 0 ? " ".concat(obj.layer) : "", " {"); } css += obj.css; if (needLayer) { css += "}"; } if (obj.media) { css += "}"; } if (obj.supports) { css += "}"; } var sourceMap = obj.sourceMap; if (sourceMap && typeof btoa !== "undefined") { css += "\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))), " */"); } // For old IE /* istanbul ignore if */ options.styleTagTransform(css, styleElement, options.options); } function removeStyleElement(styleElement) { // istanbul ignore if if (styleElement.parentNode === null) { return false; } styleElement.parentNode.removeChild(styleElement); } /* istanbul ignore next */ function domAPI(options) { if (typeof document === "undefined") { return { update: function update() {}, remove: function remove() {} }; } var styleElement = options.insertStyleElement(options); return { update: function update(obj) { apply(styleElement, options, obj); }, remove: function remove() { removeStyleElement(styleElement); } }; } module.exports = domAPI; /***/ }), /***/ "./node_modules/style-loader/dist/runtime/styleTagTransform.js": /*!*********************************************************************!*\ !*** ./node_modules/style-loader/dist/runtime/styleTagTransform.js ***! \*********************************************************************/ /***/ ((module) => { "use strict"; /* istanbul ignore next */ function styleTagTransform(css, styleElement) { if (styleElement.styleSheet) { styleElement.styleSheet.cssText = css; } else { while (styleElement.firstChild) { styleElement.removeChild(styleElement.firstChild); } styleElement.appendChild(document.createTextNode(css)); } } module.exports = styleTagTransform; /***/ }), /***/ "./node_modules/sweetalert2/dist/sweetalert2.all.js": /*!**********************************************************!*\ !*** ./node_modules/sweetalert2/dist/sweetalert2.all.js ***! \**********************************************************/ /***/ (function(module) { /*! * sweetalert2 v11.22.5 * Released under the MIT License. */ (function (global, factory) { true ? module.exports = factory() : 0; })(this, (function () { 'use strict'; function _assertClassBrand(e, t, n) { if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n; throw new TypeError("Private element is not present on this object"); } function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); } function _classPrivateFieldGet2(s, a) { return s.get(_assertClassBrand(s, a)); } function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); } function _classPrivateFieldSet2(s, a, r) { return s.set(_assertClassBrand(s, a), r), r; } const RESTORE_FOCUS_TIMEOUT = 100; /** @type {GlobalState} */ const globalState = {}; const focusPreviousActiveElement = () => { if (globalState.previousActiveElement instanceof HTMLElement) { globalState.previousActiveElement.focus(); globalState.previousActiveElement = null; } else if (document.body) { document.body.focus(); } }; /** * Restore previous active (focused) element * * @param {boolean} returnFocus * @returns {Promise} */ const restoreActiveElement = returnFocus => { return new Promise(resolve => { if (!returnFocus) { return resolve(); } const x = window.scrollX; const y = window.scrollY; globalState.restoreFocusTimeout = setTimeout(() => { focusPreviousActiveElement(); resolve(); }, RESTORE_FOCUS_TIMEOUT); // issues/900 window.scrollTo(x, y); }); }; const swalPrefix = 'swal2-'; /** * @typedef {Record} SwalClasses */ /** * @typedef {'success' | 'warning' | 'info' | 'question' | 'error'} SwalIcon * @typedef {Record} SwalIcons */ /** @type {SwalClass[]} */ const classNames = ['container', 'shown', 'height-auto', 'iosfix', 'popup', 'modal', 'no-backdrop', 'no-transition', 'toast', 'toast-shown', 'show', 'hide', 'close', 'title', 'html-container', 'actions', 'confirm', 'deny', 'cancel', 'footer', 'icon', 'icon-content', 'image', 'input', 'file', 'range', 'select', 'radio', 'checkbox', 'label', 'textarea', 'inputerror', 'input-label', 'validation-message', 'progress-steps', 'active-progress-step', 'progress-step', 'progress-step-line', 'loader', 'loading', 'styled', 'top', 'top-start', 'top-end', 'top-left', 'top-right', 'center', 'center-start', 'center-end', 'center-left', 'center-right', 'bottom', 'bottom-start', 'bottom-end', 'bottom-left', 'bottom-right', 'grow-row', 'grow-column', 'grow-fullscreen', 'rtl', 'timer-progress-bar', 'timer-progress-bar-container', 'scrollbar-measure', 'icon-success', 'icon-warning', 'icon-info', 'icon-question', 'icon-error', 'draggable', 'dragging']; const swalClasses = classNames.reduce((acc, className) => { acc[className] = swalPrefix + className; return acc; }, /** @type {SwalClasses} */{}); /** @type {SwalIcon[]} */ const icons = ['success', 'warning', 'info', 'question', 'error']; const iconTypes = icons.reduce((acc, icon) => { acc[icon] = swalPrefix + icon; return acc; }, /** @type {SwalIcons} */{}); const consolePrefix = 'SweetAlert2:'; /** * Capitalize the first letter of a string * * @param {string} str * @returns {string} */ const capitalizeFirstLetter = str => str.charAt(0).toUpperCase() + str.slice(1); /** * Standardize console warnings * * @param {string | string[]} message */ const warn = message => { console.warn(`${consolePrefix} ${typeof message === 'object' ? message.join(' ') : message}`); }; /** * Standardize console errors * * @param {string} message */ const error = message => { console.error(`${consolePrefix} ${message}`); }; /** * Private global state for `warnOnce` * * @type {string[]} * @private */ const previousWarnOnceMessages = []; /** * Show a console warning, but only if it hasn't already been shown * * @param {string} message */ const warnOnce = message => { if (!previousWarnOnceMessages.includes(message)) { previousWarnOnceMessages.push(message); warn(message); } }; /** * Show a one-time console warning about deprecated params/methods * * @param {string} deprecatedParam * @param {string?} useInstead */ const warnAboutDeprecation = (deprecatedParam, useInstead = null) => { warnOnce(`"${deprecatedParam}" is deprecated and will be removed in the next major release.${useInstead ? ` Use "${useInstead}" instead.` : ''}`); }; /** * If `arg` is a function, call it (with no arguments or context) and return the result. * Otherwise, just pass the value through * * @param {Function | any} arg * @returns {any} */ const callIfFunction = arg => typeof arg === 'function' ? arg() : arg; /** * @param {any} arg * @returns {boolean} */ const hasToPromiseFn = arg => arg && typeof arg.toPromise === 'function'; /** * @param {any} arg * @returns {Promise} */ const asPromise = arg => hasToPromiseFn(arg) ? arg.toPromise() : Promise.resolve(arg); /** * @param {any} arg * @returns {boolean} */ const isPromise = arg => arg && Promise.resolve(arg) === arg; /** * Gets the popup container which contains the backdrop and the popup itself. * * @returns {HTMLElement | null} */ const getContainer = () => document.body.querySelector(`.${swalClasses.container}`); /** * @param {string} selectorString * @returns {HTMLElement | null} */ const elementBySelector = selectorString => { const container = getContainer(); return container ? container.querySelector(selectorString) : null; }; /** * @param {string} className * @returns {HTMLElement | null} */ const elementByClass = className => { return elementBySelector(`.${className}`); }; /** * @returns {HTMLElement | null} */ const getPopup = () => elementByClass(swalClasses.popup); /** * @returns {HTMLElement | null} */ const getIcon = () => elementByClass(swalClasses.icon); /** * @returns {HTMLElement | null} */ const getIconContent = () => elementByClass(swalClasses['icon-content']); /** * @returns {HTMLElement | null} */ const getTitle = () => elementByClass(swalClasses.title); /** * @returns {HTMLElement | null} */ const getHtmlContainer = () => elementByClass(swalClasses['html-container']); /** * @returns {HTMLElement | null} */ const getImage = () => elementByClass(swalClasses.image); /** * @returns {HTMLElement | null} */ const getProgressSteps = () => elementByClass(swalClasses['progress-steps']); /** * @returns {HTMLElement | null} */ const getValidationMessage = () => elementByClass(swalClasses['validation-message']); /** * @returns {HTMLButtonElement | null} */ const getConfirmButton = () => (/** @type {HTMLButtonElement} */elementBySelector(`.${swalClasses.actions} .${swalClasses.confirm}`)); /** * @returns {HTMLButtonElement | null} */ const getCancelButton = () => (/** @type {HTMLButtonElement} */elementBySelector(`.${swalClasses.actions} .${swalClasses.cancel}`)); /** * @returns {HTMLButtonElement | null} */ const getDenyButton = () => (/** @type {HTMLButtonElement} */elementBySelector(`.${swalClasses.actions} .${swalClasses.deny}`)); /** * @returns {HTMLElement | null} */ const getInputLabel = () => elementByClass(swalClasses['input-label']); /** * @returns {HTMLElement | null} */ const getLoader = () => elementBySelector(`.${swalClasses.loader}`); /** * @returns {HTMLElement | null} */ const getActions = () => elementByClass(swalClasses.actions); /** * @returns {HTMLElement | null} */ const getFooter = () => elementByClass(swalClasses.footer); /** * @returns {HTMLElement | null} */ const getTimerProgressBar = () => elementByClass(swalClasses['timer-progress-bar']); /** * @returns {HTMLElement | null} */ const getCloseButton = () => elementByClass(swalClasses.close); // https://github.com/jkup/focusable/blob/master/index.js const focusable = ` a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex="0"], [contenteditable], audio[controls], video[controls], summary `; /** * @returns {HTMLElement[]} */ const getFocusableElements = () => { const popup = getPopup(); if (!popup) { return []; } /** @type {NodeListOf} */ const focusableElementsWithTabindex = popup.querySelectorAll('[tabindex]:not([tabindex="-1"]):not([tabindex="0"])'); const focusableElementsWithTabindexSorted = Array.from(focusableElementsWithTabindex) // sort according to tabindex .sort((a, b) => { const tabindexA = parseInt(a.getAttribute('tabindex') || '0'); const tabindexB = parseInt(b.getAttribute('tabindex') || '0'); if (tabindexA > tabindexB) { return 1; } else if (tabindexA < tabindexB) { return -1; } return 0; }); /** @type {NodeListOf} */ const otherFocusableElements = popup.querySelectorAll(focusable); const otherFocusableElementsFiltered = Array.from(otherFocusableElements).filter(el => el.getAttribute('tabindex') !== '-1'); return [...new Set(focusableElementsWithTabindexSorted.concat(otherFocusableElementsFiltered))].filter(el => isVisible$1(el)); }; /** * @returns {boolean} */ const isModal = () => { return hasClass(document.body, swalClasses.shown) && !hasClass(document.body, swalClasses['toast-shown']) && !hasClass(document.body, swalClasses['no-backdrop']); }; /** * @returns {boolean} */ const isToast = () => { const popup = getPopup(); if (!popup) { return false; } return hasClass(popup, swalClasses.toast); }; /** * @returns {boolean} */ const isLoading = () => { const popup = getPopup(); if (!popup) { return false; } return popup.hasAttribute('data-loading'); }; /** * Securely set innerHTML of an element * https://github.com/sweetalert2/sweetalert2/issues/1926 * * @param {HTMLElement} elem * @param {string} html */ const setInnerHtml = (elem, html) => { elem.textContent = ''; if (html) { const parser = new DOMParser(); const parsed = parser.parseFromString(html, `text/html`); const head = parsed.querySelector('head'); if (head) { Array.from(head.childNodes).forEach(child => { elem.appendChild(child); }); } const body = parsed.querySelector('body'); if (body) { Array.from(body.childNodes).forEach(child => { if (child instanceof HTMLVideoElement || child instanceof HTMLAudioElement) { elem.appendChild(child.cloneNode(true)); // https://github.com/sweetalert2/sweetalert2/issues/2507 } else { elem.appendChild(child); } }); } } }; /** * @param {HTMLElement} elem * @param {string} className * @returns {boolean} */ const hasClass = (elem, className) => { if (!className) { return false; } const classList = className.split(/\s+/); for (let i = 0; i < classList.length; i++) { if (!elem.classList.contains(classList[i])) { return false; } } return true; }; /** * @param {HTMLElement} elem * @param {SweetAlertOptions} params */ const removeCustomClasses = (elem, params) => { Array.from(elem.classList).forEach(className => { if (!Object.values(swalClasses).includes(className) && !Object.values(iconTypes).includes(className) && !Object.values(params.showClass || {}).includes(className)) { elem.classList.remove(className); } }); }; /** * @param {HTMLElement} elem * @param {SweetAlertOptions} params * @param {string} className */ const applyCustomClass = (elem, params, className) => { removeCustomClasses(elem, params); if (!params.customClass) { return; } const customClass = params.customClass[(/** @type {keyof SweetAlertCustomClass} */className)]; if (!customClass) { return; } if (typeof customClass !== 'string' && !customClass.forEach) { warn(`Invalid type of customClass.${className}! Expected string or iterable object, got "${typeof customClass}"`); return; } addClass(elem, customClass); }; /** * @param {HTMLElement} popup * @param {import('./renderers/renderInput').InputClass | SweetAlertInput} inputClass * @returns {HTMLInputElement | null} */ const getInput$1 = (popup, inputClass) => { if (!inputClass) { return null; } switch (inputClass) { case 'select': case 'textarea': case 'file': return popup.querySelector(`.${swalClasses.popup} > .${swalClasses[inputClass]}`); case 'checkbox': return popup.querySelector(`.${swalClasses.popup} > .${swalClasses.checkbox} input`); case 'radio': return popup.querySelector(`.${swalClasses.popup} > .${swalClasses.radio} input:checked`) || popup.querySelector(`.${swalClasses.popup} > .${swalClasses.radio} input:first-child`); case 'range': return popup.querySelector(`.${swalClasses.popup} > .${swalClasses.range} input`); default: return popup.querySelector(`.${swalClasses.popup} > .${swalClasses.input}`); } }; /** * @param {HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement} input */ const focusInput = input => { input.focus(); // place cursor at end of text in text input if (input.type !== 'file') { // http://stackoverflow.com/a/2345915 const val = input.value; input.value = ''; input.value = val; } }; /** * @param {HTMLElement | HTMLElement[] | null} target * @param {string | string[] | readonly string[] | undefined} classList * @param {boolean} condition */ const toggleClass = (target, classList, condition) => { if (!target || !classList) { return; } if (typeof classList === 'string') { classList = classList.split(/\s+/).filter(Boolean); } classList.forEach(className => { if (Array.isArray(target)) { target.forEach(elem => { if (condition) { elem.classList.add(className); } else { elem.classList.remove(className); } }); } else { if (condition) { target.classList.add(className); } else { target.classList.remove(className); } } }); }; /** * @param {HTMLElement | HTMLElement[] | null} target * @param {string | string[] | readonly string[] | undefined} classList */ const addClass = (target, classList) => { toggleClass(target, classList, true); }; /** * @param {HTMLElement | HTMLElement[] | null} target * @param {string | string[] | readonly string[] | undefined} classList */ const removeClass = (target, classList) => { toggleClass(target, classList, false); }; /** * Get direct child of an element by class name * * @param {HTMLElement} elem * @param {string} className * @returns {HTMLElement | undefined} */ const getDirectChildByClass = (elem, className) => { const children = Array.from(elem.children); for (let i = 0; i < children.length; i++) { const child = children[i]; if (child instanceof HTMLElement && hasClass(child, className)) { return child; } } }; /** * @param {HTMLElement} elem * @param {string} property * @param {*} value */ const applyNumericalStyle = (elem, property, value) => { if (value === `${parseInt(value)}`) { value = parseInt(value); } if (value || parseInt(value) === 0) { elem.style.setProperty(property, typeof value === 'number' ? `${value}px` : value); } else { elem.style.removeProperty(property); } }; /** * @param {HTMLElement | null} elem * @param {string} display */ const show = (elem, display = 'flex') => { if (!elem) { return; } elem.style.display = display; }; /** * @param {HTMLElement | null} elem */ const hide = elem => { if (!elem) { return; } elem.style.display = 'none'; }; /** * @param {HTMLElement | null} elem * @param {string} display */ const showWhenInnerHtmlPresent = (elem, display = 'block') => { if (!elem) { return; } new MutationObserver(() => { toggle(elem, elem.innerHTML, display); }).observe(elem, { childList: true, subtree: true }); }; /** * @param {HTMLElement} parent * @param {string} selector * @param {string} property * @param {string} value */ const setStyle = (parent, selector, property, value) => { /** @type {HTMLElement | null} */ const el = parent.querySelector(selector); if (el) { el.style.setProperty(property, value); } }; /** * @param {HTMLElement} elem * @param {any} condition * @param {string} display */ const toggle = (elem, condition, display = 'flex') => { if (condition) { show(elem, display); } else { hide(elem); } }; /** * borrowed from jquery $(elem).is(':visible') implementation * * @param {HTMLElement | null} elem * @returns {boolean} */ const isVisible$1 = elem => !!(elem && (elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length)); /** * @returns {boolean} */ const allButtonsAreHidden = () => !isVisible$1(getConfirmButton()) && !isVisible$1(getDenyButton()) && !isVisible$1(getCancelButton()); /** * @param {HTMLElement} elem * @returns {boolean} */ const isScrollable = elem => !!(elem.scrollHeight > elem.clientHeight); /** * @param {HTMLElement} element * @param {HTMLElement} stopElement * @returns {boolean} */ const selfOrParentIsScrollable = (element, stopElement) => { let parent = element; while (parent && parent !== stopElement) { if (isScrollable(parent)) { return true; } parent = parent.parentElement; } return false; }; /** * borrowed from https://stackoverflow.com/a/46352119 * * @param {HTMLElement} elem * @returns {boolean} */ const hasCssAnimation = elem => { const style = window.getComputedStyle(elem); const animDuration = parseFloat(style.getPropertyValue('animation-duration') || '0'); const transDuration = parseFloat(style.getPropertyValue('transition-duration') || '0'); return animDuration > 0 || transDuration > 0; }; /** * @param {number} timer * @param {boolean} reset */ const animateTimerProgressBar = (timer, reset = false) => { const timerProgressBar = getTimerProgressBar(); if (!timerProgressBar) { return; } if (isVisible$1(timerProgressBar)) { if (reset) { timerProgressBar.style.transition = 'none'; timerProgressBar.style.width = '100%'; } setTimeout(() => { timerProgressBar.style.transition = `width ${timer / 1000}s linear`; timerProgressBar.style.width = '0%'; }, 10); } }; const stopTimerProgressBar = () => { const timerProgressBar = getTimerProgressBar(); if (!timerProgressBar) { return; } const timerProgressBarWidth = parseInt(window.getComputedStyle(timerProgressBar).width); timerProgressBar.style.removeProperty('transition'); timerProgressBar.style.width = '100%'; const timerProgressBarFullWidth = parseInt(window.getComputedStyle(timerProgressBar).width); const timerProgressBarPercent = timerProgressBarWidth / timerProgressBarFullWidth * 100; timerProgressBar.style.width = `${timerProgressBarPercent}%`; }; /** * Detect Node env * * @returns {boolean} */ const isNodeEnv = () => typeof window === 'undefined' || typeof document === 'undefined'; const sweetHTML = `

    `.replace(/(^|\n)\s*/g, ''); /** * @returns {boolean} */ const resetOldContainer = () => { const oldContainer = getContainer(); if (!oldContainer) { return false; } oldContainer.remove(); removeClass([document.documentElement, document.body], [swalClasses['no-backdrop'], swalClasses['toast-shown'], swalClasses['has-column']]); return true; }; const resetValidationMessage$1 = () => { globalState.currentInstance.resetValidationMessage(); }; const addInputChangeListeners = () => { const popup = getPopup(); const input = getDirectChildByClass(popup, swalClasses.input); const file = getDirectChildByClass(popup, swalClasses.file); /** @type {HTMLInputElement} */ const range = popup.querySelector(`.${swalClasses.range} input`); /** @type {HTMLOutputElement} */ const rangeOutput = popup.querySelector(`.${swalClasses.range} output`); const select = getDirectChildByClass(popup, swalClasses.select); /** @type {HTMLInputElement} */ const checkbox = popup.querySelector(`.${swalClasses.checkbox} input`); const textarea = getDirectChildByClass(popup, swalClasses.textarea); input.oninput = resetValidationMessage$1; file.onchange = resetValidationMessage$1; select.onchange = resetValidationMessage$1; checkbox.onchange = resetValidationMessage$1; textarea.oninput = resetValidationMessage$1; range.oninput = () => { resetValidationMessage$1(); rangeOutput.value = range.value; }; range.onchange = () => { resetValidationMessage$1(); rangeOutput.value = range.value; }; }; /** * @param {string | HTMLElement} target * @returns {HTMLElement} */ const getTarget = target => typeof target === 'string' ? document.querySelector(target) : target; /** * @param {SweetAlertOptions} params */ const setupAccessibility = params => { const popup = getPopup(); popup.setAttribute('role', params.toast ? 'alert' : 'dialog'); popup.setAttribute('aria-live', params.toast ? 'polite' : 'assertive'); if (!params.toast) { popup.setAttribute('aria-modal', 'true'); } }; /** * @param {HTMLElement} targetElement */ const setupRTL = targetElement => { if (window.getComputedStyle(targetElement).direction === 'rtl') { addClass(getContainer(), swalClasses.rtl); } }; /** * Add modal + backdrop + no-war message for Russians to DOM * * @param {SweetAlertOptions} params */ const init = params => { // Clean up the old popup container if it exists const oldContainerExisted = resetOldContainer(); if (isNodeEnv()) { error('SweetAlert2 requires document to initialize'); return; } const container = document.createElement('div'); container.className = swalClasses.container; if (oldContainerExisted) { addClass(container, swalClasses['no-transition']); } setInnerHtml(container, sweetHTML); container.dataset['swal2Theme'] = params.theme; const targetElement = getTarget(params.target); targetElement.appendChild(container); if (params.topLayer) { container.setAttribute('popover', ''); container.showPopover(); } setupAccessibility(params); setupRTL(targetElement); addInputChangeListeners(); }; /** * @param {HTMLElement | object | string} param * @param {HTMLElement} target */ const parseHtmlToContainer = (param, target) => { // DOM element if (param instanceof HTMLElement) { target.appendChild(param); } // Object else if (typeof param === 'object') { handleObject(param, target); } // Plain string else if (param) { setInnerHtml(target, param); } }; /** * @param {any} param * @param {HTMLElement} target */ const handleObject = (param, target) => { // JQuery element(s) if (param.jquery) { handleJqueryElem(target, param); } // For other objects use their string representation else { setInnerHtml(target, param.toString()); } }; /** * @param {HTMLElement} target * @param {any} elem */ const handleJqueryElem = (target, elem) => { target.textContent = ''; if (0 in elem) { for (let i = 0; i in elem; i++) { target.appendChild(elem[i].cloneNode(true)); } } else { target.appendChild(elem.cloneNode(true)); } }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderActions = (instance, params) => { const actions = getActions(); const loader = getLoader(); if (!actions || !loader) { return; } // Actions (buttons) wrapper if (!params.showConfirmButton && !params.showDenyButton && !params.showCancelButton) { hide(actions); } else { show(actions); } // Custom class applyCustomClass(actions, params, 'actions'); // Render all the buttons renderButtons(actions, loader, params); // Loader setInnerHtml(loader, params.loaderHtml || ''); applyCustomClass(loader, params, 'loader'); }; /** * @param {HTMLElement} actions * @param {HTMLElement} loader * @param {SweetAlertOptions} params */ function renderButtons(actions, loader, params) { const confirmButton = getConfirmButton(); const denyButton = getDenyButton(); const cancelButton = getCancelButton(); if (!confirmButton || !denyButton || !cancelButton) { return; } // Render buttons renderButton(confirmButton, 'confirm', params); renderButton(denyButton, 'deny', params); renderButton(cancelButton, 'cancel', params); handleButtonsStyling(confirmButton, denyButton, cancelButton, params); if (params.reverseButtons) { if (params.toast) { actions.insertBefore(cancelButton, confirmButton); actions.insertBefore(denyButton, confirmButton); } else { actions.insertBefore(cancelButton, loader); actions.insertBefore(denyButton, loader); actions.insertBefore(confirmButton, loader); } } } /** * @param {HTMLElement} confirmButton * @param {HTMLElement} denyButton * @param {HTMLElement} cancelButton * @param {SweetAlertOptions} params */ function handleButtonsStyling(confirmButton, denyButton, cancelButton, params) { if (!params.buttonsStyling) { removeClass([confirmButton, denyButton, cancelButton], swalClasses.styled); return; } addClass([confirmButton, denyButton, cancelButton], swalClasses.styled); // Apply custom background colors to action buttons if (params.confirmButtonColor) { confirmButton.style.setProperty('--swal2-confirm-button-background-color', params.confirmButtonColor); } if (params.denyButtonColor) { denyButton.style.setProperty('--swal2-deny-button-background-color', params.denyButtonColor); } if (params.cancelButtonColor) { cancelButton.style.setProperty('--swal2-cancel-button-background-color', params.cancelButtonColor); } // Apply the outline color to action buttons applyOutlineColor(confirmButton); applyOutlineColor(denyButton); applyOutlineColor(cancelButton); } /** * @param {HTMLElement} button */ function applyOutlineColor(button) { const buttonStyle = window.getComputedStyle(button); if (buttonStyle.getPropertyValue('--swal2-action-button-focus-box-shadow')) { // If the button already has a custom outline color, no need to change it return; } const outlineColor = buttonStyle.backgroundColor.replace(/rgba?\((\d+), (\d+), (\d+).*/, 'rgba($1, $2, $3, 0.5)'); button.style.setProperty('--swal2-action-button-focus-box-shadow', buttonStyle.getPropertyValue('--swal2-outline').replace(/ rgba\(.*/, ` ${outlineColor}`)); } /** * @param {HTMLElement} button * @param {'confirm' | 'deny' | 'cancel'} buttonType * @param {SweetAlertOptions} params */ function renderButton(button, buttonType, params) { const buttonName = /** @type {'Confirm' | 'Deny' | 'Cancel'} */capitalizeFirstLetter(buttonType); toggle(button, params[`show${buttonName}Button`], 'inline-block'); setInnerHtml(button, params[`${buttonType}ButtonText`] || ''); // Set caption text button.setAttribute('aria-label', params[`${buttonType}ButtonAriaLabel`] || ''); // ARIA label // Add buttons custom classes button.className = swalClasses[buttonType]; applyCustomClass(button, params, `${buttonType}Button`); } /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderCloseButton = (instance, params) => { const closeButton = getCloseButton(); if (!closeButton) { return; } setInnerHtml(closeButton, params.closeButtonHtml || ''); // Custom class applyCustomClass(closeButton, params, 'closeButton'); toggle(closeButton, params.showCloseButton); closeButton.setAttribute('aria-label', params.closeButtonAriaLabel || ''); }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderContainer = (instance, params) => { const container = getContainer(); if (!container) { return; } handleBackdropParam(container, params.backdrop); handlePositionParam(container, params.position); handleGrowParam(container, params.grow); // Custom class applyCustomClass(container, params, 'container'); }; /** * @param {HTMLElement} container * @param {SweetAlertOptions['backdrop']} backdrop */ function handleBackdropParam(container, backdrop) { if (typeof backdrop === 'string') { container.style.background = backdrop; } else if (!backdrop) { addClass([document.documentElement, document.body], swalClasses['no-backdrop']); } } /** * @param {HTMLElement} container * @param {SweetAlertOptions['position']} position */ function handlePositionParam(container, position) { if (!position) { return; } if (position in swalClasses) { addClass(container, swalClasses[position]); } else { warn('The "position" parameter is not valid, defaulting to "center"'); addClass(container, swalClasses.center); } } /** * @param {HTMLElement} container * @param {SweetAlertOptions['grow']} grow */ function handleGrowParam(container, grow) { if (!grow) { return; } addClass(container, swalClasses[`grow-${grow}`]); } /** * This module contains `WeakMap`s for each effectively-"private property" that a `Swal` has. * For example, to set the private property "foo" of `this` to "bar", you can `privateProps.foo.set(this, 'bar')` * This is the approach that Babel will probably take to implement private methods/fields * https://github.com/tc39/proposal-private-methods * https://github.com/babel/babel/pull/7555 * Once we have the changes from that PR in Babel, and our core class fits reasonable in *one module* * then we can use that language feature. */ var privateProps = { innerParams: new WeakMap(), domCache: new WeakMap() }; /// /** @type {InputClass[]} */ const inputClasses = ['input', 'file', 'range', 'select', 'radio', 'checkbox', 'textarea']; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderInput = (instance, params) => { const popup = getPopup(); if (!popup) { return; } const innerParams = privateProps.innerParams.get(instance); const rerender = !innerParams || params.input !== innerParams.input; inputClasses.forEach(inputClass => { const inputContainer = getDirectChildByClass(popup, swalClasses[inputClass]); if (!inputContainer) { return; } // set attributes setAttributes(inputClass, params.inputAttributes); // set class inputContainer.className = swalClasses[inputClass]; if (rerender) { hide(inputContainer); } }); if (params.input) { if (rerender) { showInput(params); } // set custom class setCustomClass(params); } }; /** * @param {SweetAlertOptions} params */ const showInput = params => { if (!params.input) { return; } if (!renderInputType[params.input]) { error(`Unexpected type of input! Expected ${Object.keys(renderInputType).join(' | ')}, got "${params.input}"`); return; } const inputContainer = getInputContainer(params.input); if (!inputContainer) { return; } const input = renderInputType[params.input](inputContainer, params); show(inputContainer); // input autofocus if (params.inputAutoFocus) { setTimeout(() => { focusInput(input); }); } }; /** * @param {HTMLInputElement} input */ const removeAttributes = input => { for (let i = 0; i < input.attributes.length; i++) { const attrName = input.attributes[i].name; if (!['id', 'type', 'value', 'style'].includes(attrName)) { input.removeAttribute(attrName); } } }; /** * @param {InputClass} inputClass * @param {SweetAlertOptions['inputAttributes']} inputAttributes */ const setAttributes = (inputClass, inputAttributes) => { const popup = getPopup(); if (!popup) { return; } const input = getInput$1(popup, inputClass); if (!input) { return; } removeAttributes(input); for (const attr in inputAttributes) { input.setAttribute(attr, inputAttributes[attr]); } }; /** * @param {SweetAlertOptions} params */ const setCustomClass = params => { if (!params.input) { return; } const inputContainer = getInputContainer(params.input); if (inputContainer) { applyCustomClass(inputContainer, params, 'input'); } }; /** * @param {HTMLInputElement | HTMLTextAreaElement} input * @param {SweetAlertOptions} params */ const setInputPlaceholder = (input, params) => { if (!input.placeholder && params.inputPlaceholder) { input.placeholder = params.inputPlaceholder; } }; /** * @param {Input} input * @param {Input} prependTo * @param {SweetAlertOptions} params */ const setInputLabel = (input, prependTo, params) => { if (params.inputLabel) { const label = document.createElement('label'); const labelClass = swalClasses['input-label']; label.setAttribute('for', input.id); label.className = labelClass; if (typeof params.customClass === 'object') { addClass(label, params.customClass.inputLabel); } label.innerText = params.inputLabel; prependTo.insertAdjacentElement('beforebegin', label); } }; /** * @param {SweetAlertInput} inputType * @returns {HTMLElement | undefined} */ const getInputContainer = inputType => { const popup = getPopup(); if (!popup) { return; } return getDirectChildByClass(popup, swalClasses[(/** @type {SwalClass} */inputType)] || swalClasses.input); }; /** * @param {HTMLInputElement | HTMLOutputElement | HTMLTextAreaElement} input * @param {SweetAlertOptions['inputValue']} inputValue */ const checkAndSetInputValue = (input, inputValue) => { if (['string', 'number'].includes(typeof inputValue)) { input.value = `${inputValue}`; } else if (!isPromise(inputValue)) { warn(`Unexpected type of inputValue! Expected "string", "number" or "Promise", got "${typeof inputValue}"`); } }; /** @type {Record Input>} */ const renderInputType = {}; /** * @param {HTMLInputElement} input * @param {SweetAlertOptions} params * @returns {HTMLInputElement} */ renderInputType.text = renderInputType.email = renderInputType.password = renderInputType.number = renderInputType.tel = renderInputType.url = renderInputType.search = renderInputType.date = renderInputType['datetime-local'] = renderInputType.time = renderInputType.week = renderInputType.month = /** @type {(input: Input | HTMLElement, params: SweetAlertOptions) => Input} */ (input, params) => { checkAndSetInputValue(input, params.inputValue); setInputLabel(input, input, params); setInputPlaceholder(input, params); input.type = params.input; return input; }; /** * @param {HTMLInputElement} input * @param {SweetAlertOptions} params * @returns {HTMLInputElement} */ renderInputType.file = (input, params) => { setInputLabel(input, input, params); setInputPlaceholder(input, params); return input; }; /** * @param {HTMLInputElement} range * @param {SweetAlertOptions} params * @returns {HTMLInputElement} */ renderInputType.range = (range, params) => { const rangeInput = range.querySelector('input'); const rangeOutput = range.querySelector('output'); checkAndSetInputValue(rangeInput, params.inputValue); rangeInput.type = params.input; checkAndSetInputValue(rangeOutput, params.inputValue); setInputLabel(rangeInput, range, params); return range; }; /** * @param {HTMLSelectElement} select * @param {SweetAlertOptions} params * @returns {HTMLSelectElement} */ renderInputType.select = (select, params) => { select.textContent = ''; if (params.inputPlaceholder) { const placeholder = document.createElement('option'); setInnerHtml(placeholder, params.inputPlaceholder); placeholder.value = ''; placeholder.disabled = true; placeholder.selected = true; select.appendChild(placeholder); } setInputLabel(select, select, params); return select; }; /** * @param {HTMLInputElement} radio * @returns {HTMLInputElement} */ renderInputType.radio = radio => { radio.textContent = ''; return radio; }; /** * @param {HTMLLabelElement} checkboxContainer * @param {SweetAlertOptions} params * @returns {HTMLInputElement} */ renderInputType.checkbox = (checkboxContainer, params) => { const checkbox = getInput$1(getPopup(), 'checkbox'); checkbox.value = '1'; checkbox.checked = Boolean(params.inputValue); const label = checkboxContainer.querySelector('span'); setInnerHtml(label, params.inputPlaceholder || params.inputLabel); return checkbox; }; /** * @param {HTMLTextAreaElement} textarea * @param {SweetAlertOptions} params * @returns {HTMLTextAreaElement} */ renderInputType.textarea = (textarea, params) => { checkAndSetInputValue(textarea, params.inputValue); setInputPlaceholder(textarea, params); setInputLabel(textarea, textarea, params); /** * @param {HTMLElement} el * @returns {number} */ const getMargin = el => parseInt(window.getComputedStyle(el).marginLeft) + parseInt(window.getComputedStyle(el).marginRight); // https://github.com/sweetalert2/sweetalert2/issues/2291 setTimeout(() => { // https://github.com/sweetalert2/sweetalert2/issues/1699 if ('MutationObserver' in window) { const initialPopupWidth = parseInt(window.getComputedStyle(getPopup()).width); const textareaResizeHandler = () => { // check if texarea is still in document (i.e. popup wasn't closed in the meantime) if (!document.body.contains(textarea)) { return; } const textareaWidth = textarea.offsetWidth + getMargin(textarea); if (textareaWidth > initialPopupWidth) { getPopup().style.width = `${textareaWidth}px`; } else { applyNumericalStyle(getPopup(), 'width', params.width); } }; new MutationObserver(textareaResizeHandler).observe(textarea, { attributes: true, attributeFilter: ['style'] }); } }); return textarea; }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderContent = (instance, params) => { const htmlContainer = getHtmlContainer(); if (!htmlContainer) { return; } showWhenInnerHtmlPresent(htmlContainer); applyCustomClass(htmlContainer, params, 'htmlContainer'); // Content as HTML if (params.html) { parseHtmlToContainer(params.html, htmlContainer); show(htmlContainer, 'block'); } // Content as plain text else if (params.text) { htmlContainer.textContent = params.text; show(htmlContainer, 'block'); } // No content else { hide(htmlContainer); } renderInput(instance, params); }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderFooter = (instance, params) => { const footer = getFooter(); if (!footer) { return; } showWhenInnerHtmlPresent(footer); toggle(footer, params.footer, 'block'); if (params.footer) { parseHtmlToContainer(params.footer, footer); } // Custom class applyCustomClass(footer, params, 'footer'); }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderIcon = (instance, params) => { const innerParams = privateProps.innerParams.get(instance); const icon = getIcon(); if (!icon) { return; } // if the given icon already rendered, apply the styling without re-rendering the icon if (innerParams && params.icon === innerParams.icon) { // Custom or default content setContent(icon, params); applyStyles(icon, params); return; } if (!params.icon && !params.iconHtml) { hide(icon); return; } if (params.icon && Object.keys(iconTypes).indexOf(params.icon) === -1) { error(`Unknown icon! Expected "success", "error", "warning", "info" or "question", got "${params.icon}"`); hide(icon); return; } show(icon); // Custom or default content setContent(icon, params); applyStyles(icon, params); // Animate icon addClass(icon, params.showClass && params.showClass.icon); // Re-adjust the success icon on system theme change const colorSchemeQueryList = window.matchMedia('(prefers-color-scheme: dark)'); colorSchemeQueryList.addEventListener('change', adjustSuccessIconBackgroundColor); }; /** * @param {HTMLElement} icon * @param {SweetAlertOptions} params */ const applyStyles = (icon, params) => { for (const [iconType, iconClassName] of Object.entries(iconTypes)) { if (params.icon !== iconType) { removeClass(icon, iconClassName); } } addClass(icon, params.icon && iconTypes[params.icon]); // Icon color setColor(icon, params); // Success icon background color adjustSuccessIconBackgroundColor(); // Custom class applyCustomClass(icon, params, 'icon'); }; // Adjust success icon background color to match the popup background color const adjustSuccessIconBackgroundColor = () => { const popup = getPopup(); if (!popup) { return; } const popupBackgroundColor = window.getComputedStyle(popup).getPropertyValue('background-color'); /** @type {NodeListOf} */ const successIconParts = popup.querySelectorAll('[class^=swal2-success-circular-line], .swal2-success-fix'); for (let i = 0; i < successIconParts.length; i++) { successIconParts[i].style.backgroundColor = popupBackgroundColor; } }; /** * * @param {SweetAlertOptions} params * @returns {string} */ const successIconHtml = params => ` ${params.animation ? '
    ' : ''}
    ${params.animation ? '
    ' : ''} ${params.animation ? '
    ' : ''} `; const errorIconHtml = ` `; /** * @param {HTMLElement} icon * @param {SweetAlertOptions} params */ const setContent = (icon, params) => { if (!params.icon && !params.iconHtml) { return; } let oldContent = icon.innerHTML; let newContent = ''; if (params.iconHtml) { newContent = iconContent(params.iconHtml); } else if (params.icon === 'success') { newContent = successIconHtml(params); oldContent = oldContent.replace(/ style=".*?"/g, ''); // undo adjustSuccessIconBackgroundColor() } else if (params.icon === 'error') { newContent = errorIconHtml; } else if (params.icon) { const defaultIconHtml = { question: '?', warning: '!', info: 'i' }; newContent = iconContent(defaultIconHtml[params.icon]); } if (oldContent.trim() !== newContent.trim()) { setInnerHtml(icon, newContent); } }; /** * @param {HTMLElement} icon * @param {SweetAlertOptions} params */ const setColor = (icon, params) => { if (!params.iconColor) { return; } icon.style.color = params.iconColor; icon.style.borderColor = params.iconColor; for (const sel of ['.swal2-success-line-tip', '.swal2-success-line-long', '.swal2-x-mark-line-left', '.swal2-x-mark-line-right']) { setStyle(icon, sel, 'background-color', params.iconColor); } setStyle(icon, '.swal2-success-ring', 'border-color', params.iconColor); }; /** * @param {string} content * @returns {string} */ const iconContent = content => `
    ${content}
    `; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderImage = (instance, params) => { const image = getImage(); if (!image) { return; } if (!params.imageUrl) { hide(image); return; } show(image, ''); // Src, alt image.setAttribute('src', params.imageUrl); image.setAttribute('alt', params.imageAlt || ''); // Width, height applyNumericalStyle(image, 'width', params.imageWidth); applyNumericalStyle(image, 'height', params.imageHeight); // Class image.className = swalClasses.image; applyCustomClass(image, params, 'image'); }; let dragging = false; let mousedownX = 0; let mousedownY = 0; let initialX = 0; let initialY = 0; /** * @param {HTMLElement} popup */ const addDraggableListeners = popup => { popup.addEventListener('mousedown', down); document.body.addEventListener('mousemove', move); popup.addEventListener('mouseup', up); popup.addEventListener('touchstart', down); document.body.addEventListener('touchmove', move); popup.addEventListener('touchend', up); }; /** * @param {HTMLElement} popup */ const removeDraggableListeners = popup => { popup.removeEventListener('mousedown', down); document.body.removeEventListener('mousemove', move); popup.removeEventListener('mouseup', up); popup.removeEventListener('touchstart', down); document.body.removeEventListener('touchmove', move); popup.removeEventListener('touchend', up); }; /** * @param {MouseEvent | TouchEvent} event */ const down = event => { const popup = getPopup(); if (event.target === popup || getIcon().contains(/** @type {HTMLElement} */event.target)) { dragging = true; const clientXY = getClientXY(event); mousedownX = clientXY.clientX; mousedownY = clientXY.clientY; initialX = parseInt(popup.style.insetInlineStart) || 0; initialY = parseInt(popup.style.insetBlockStart) || 0; addClass(popup, 'swal2-dragging'); } }; /** * @param {MouseEvent | TouchEvent} event */ const move = event => { const popup = getPopup(); if (dragging) { let { clientX, clientY } = getClientXY(event); popup.style.insetInlineStart = `${initialX + (clientX - mousedownX)}px`; popup.style.insetBlockStart = `${initialY + (clientY - mousedownY)}px`; } }; const up = () => { const popup = getPopup(); dragging = false; removeClass(popup, 'swal2-dragging'); }; /** * @param {MouseEvent | TouchEvent} event * @returns {{ clientX: number, clientY: number }} */ const getClientXY = event => { let clientX = 0, clientY = 0; if (event.type.startsWith('mouse')) { clientX = /** @type {MouseEvent} */event.clientX; clientY = /** @type {MouseEvent} */event.clientY; } else if (event.type.startsWith('touch')) { clientX = /** @type {TouchEvent} */event.touches[0].clientX; clientY = /** @type {TouchEvent} */event.touches[0].clientY; } return { clientX, clientY }; }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderPopup = (instance, params) => { const container = getContainer(); const popup = getPopup(); if (!container || !popup) { return; } // Width // https://github.com/sweetalert2/sweetalert2/issues/2170 if (params.toast) { applyNumericalStyle(container, 'width', params.width); popup.style.width = '100%'; const loader = getLoader(); if (loader) { popup.insertBefore(loader, getIcon()); } } else { applyNumericalStyle(popup, 'width', params.width); } // Padding applyNumericalStyle(popup, 'padding', params.padding); // Color if (params.color) { popup.style.color = params.color; } // Background if (params.background) { popup.style.background = params.background; } hide(getValidationMessage()); // Classes addClasses$1(popup, params); if (params.draggable && !params.toast) { addClass(popup, swalClasses.draggable); addDraggableListeners(popup); } else { removeClass(popup, swalClasses.draggable); removeDraggableListeners(popup); } }; /** * @param {HTMLElement} popup * @param {SweetAlertOptions} params */ const addClasses$1 = (popup, params) => { const showClass = params.showClass || {}; // Default Class + showClass when updating Swal.update({}) popup.className = `${swalClasses.popup} ${isVisible$1(popup) ? showClass.popup : ''}`; if (params.toast) { addClass([document.documentElement, document.body], swalClasses['toast-shown']); addClass(popup, swalClasses.toast); } else { addClass(popup, swalClasses.modal); } // Custom class applyCustomClass(popup, params, 'popup'); // TODO: remove in the next major if (typeof params.customClass === 'string') { addClass(popup, params.customClass); } // Icon class (#1842) if (params.icon) { addClass(popup, swalClasses[`icon-${params.icon}`]); } }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderProgressSteps = (instance, params) => { const progressStepsContainer = getProgressSteps(); if (!progressStepsContainer) { return; } const { progressSteps, currentProgressStep } = params; if (!progressSteps || progressSteps.length === 0 || currentProgressStep === undefined) { hide(progressStepsContainer); return; } show(progressStepsContainer); progressStepsContainer.textContent = ''; if (currentProgressStep >= progressSteps.length) { warn('Invalid currentProgressStep parameter, it should be less than progressSteps.length ' + '(currentProgressStep like JS arrays starts from 0)'); } progressSteps.forEach((step, index) => { const stepEl = createStepElement(step); progressStepsContainer.appendChild(stepEl); if (index === currentProgressStep) { addClass(stepEl, swalClasses['active-progress-step']); } if (index !== progressSteps.length - 1) { const lineEl = createLineElement(params); progressStepsContainer.appendChild(lineEl); } }); }; /** * @param {string} step * @returns {HTMLLIElement} */ const createStepElement = step => { const stepEl = document.createElement('li'); addClass(stepEl, swalClasses['progress-step']); setInnerHtml(stepEl, step); return stepEl; }; /** * @param {SweetAlertOptions} params * @returns {HTMLLIElement} */ const createLineElement = params => { const lineEl = document.createElement('li'); addClass(lineEl, swalClasses['progress-step-line']); if (params.progressStepsDistance) { applyNumericalStyle(lineEl, 'width', params.progressStepsDistance); } return lineEl; }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const renderTitle = (instance, params) => { const title = getTitle(); if (!title) { return; } showWhenInnerHtmlPresent(title); toggle(title, params.title || params.titleText, 'block'); if (params.title) { parseHtmlToContainer(params.title, title); } if (params.titleText) { title.innerText = params.titleText; } // Custom class applyCustomClass(title, params, 'title'); }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const render = (instance, params) => { renderPopup(instance, params); renderContainer(instance, params); renderProgressSteps(instance, params); renderIcon(instance, params); renderImage(instance, params); renderTitle(instance, params); renderCloseButton(instance, params); renderContent(instance, params); renderActions(instance, params); renderFooter(instance, params); const popup = getPopup(); if (typeof params.didRender === 'function' && popup) { params.didRender(popup); } globalState.eventEmitter.emit('didRender', popup); }; /* * Global function to determine if SweetAlert2 popup is shown */ const isVisible = () => { return isVisible$1(getPopup()); }; /* * Global function to click 'Confirm' button */ const clickConfirm = () => { var _dom$getConfirmButton; return (_dom$getConfirmButton = getConfirmButton()) === null || _dom$getConfirmButton === void 0 ? void 0 : _dom$getConfirmButton.click(); }; /* * Global function to click 'Deny' button */ const clickDeny = () => { var _dom$getDenyButton; return (_dom$getDenyButton = getDenyButton()) === null || _dom$getDenyButton === void 0 ? void 0 : _dom$getDenyButton.click(); }; /* * Global function to click 'Cancel' button */ const clickCancel = () => { var _dom$getCancelButton; return (_dom$getCancelButton = getCancelButton()) === null || _dom$getCancelButton === void 0 ? void 0 : _dom$getCancelButton.click(); }; /** @typedef {'cancel' | 'backdrop' | 'close' | 'esc' | 'timer'} DismissReason */ /** @type {Record} */ const DismissReason = Object.freeze({ cancel: 'cancel', backdrop: 'backdrop', close: 'close', esc: 'esc', timer: 'timer' }); /** * @param {GlobalState} globalState */ const removeKeydownHandler = globalState => { if (globalState.keydownTarget && globalState.keydownHandlerAdded) { globalState.keydownTarget.removeEventListener('keydown', globalState.keydownHandler, { capture: globalState.keydownListenerCapture }); globalState.keydownHandlerAdded = false; } }; /** * @param {GlobalState} globalState * @param {SweetAlertOptions} innerParams * @param {*} dismissWith */ const addKeydownHandler = (globalState, innerParams, dismissWith) => { removeKeydownHandler(globalState); if (!innerParams.toast) { globalState.keydownHandler = e => keydownHandler(innerParams, e, dismissWith); globalState.keydownTarget = innerParams.keydownListenerCapture ? window : getPopup(); globalState.keydownListenerCapture = innerParams.keydownListenerCapture; globalState.keydownTarget.addEventListener('keydown', globalState.keydownHandler, { capture: globalState.keydownListenerCapture }); globalState.keydownHandlerAdded = true; } }; /** * @param {number} index * @param {number} increment */ const setFocus = (index, increment) => { var _dom$getPopup; const focusableElements = getFocusableElements(); // search for visible elements and select the next possible match if (focusableElements.length) { index = index + increment; // shift + tab when .swal2-popup is focused if (index === -2) { index = focusableElements.length - 1; } // rollover to first item if (index === focusableElements.length) { index = 0; // go to last item } else if (index === -1) { index = focusableElements.length - 1; } focusableElements[index].focus(); return; } // no visible focusable elements, focus the popup (_dom$getPopup = getPopup()) === null || _dom$getPopup === void 0 || _dom$getPopup.focus(); }; const arrowKeysNextButton = ['ArrowRight', 'ArrowDown']; const arrowKeysPreviousButton = ['ArrowLeft', 'ArrowUp']; /** * @param {SweetAlertOptions} innerParams * @param {KeyboardEvent} event * @param {Function} dismissWith */ const keydownHandler = (innerParams, event, dismissWith) => { if (!innerParams) { return; // This instance has already been destroyed } // Ignore keydown during IME composition // https://developer.mozilla.org/en-US/docs/Web/API/Document/keydown_event#ignoring_keydown_during_ime_composition // https://github.com/sweetalert2/sweetalert2/issues/720 // https://github.com/sweetalert2/sweetalert2/issues/2406 if (event.isComposing || event.keyCode === 229) { return; } if (innerParams.stopKeydownPropagation) { event.stopPropagation(); } // ENTER if (event.key === 'Enter') { handleEnter(event, innerParams); } // TAB else if (event.key === 'Tab') { handleTab(event); } // ARROWS - switch focus between buttons else if ([...arrowKeysNextButton, ...arrowKeysPreviousButton].includes(event.key)) { handleArrows(event.key); } // ESC else if (event.key === 'Escape') { handleEsc(event, innerParams, dismissWith); } }; /** * @param {KeyboardEvent} event * @param {SweetAlertOptions} innerParams */ const handleEnter = (event, innerParams) => { // https://github.com/sweetalert2/sweetalert2/issues/2386 if (!callIfFunction(innerParams.allowEnterKey)) { return; } const input = getInput$1(getPopup(), innerParams.input); if (event.target && input && event.target instanceof HTMLElement && event.target.outerHTML === input.outerHTML) { if (['textarea', 'file'].includes(innerParams.input)) { return; // do not submit } clickConfirm(); event.preventDefault(); } }; /** * @param {KeyboardEvent} event */ const handleTab = event => { const targetElement = event.target; const focusableElements = getFocusableElements(); let btnIndex = -1; for (let i = 0; i < focusableElements.length; i++) { if (targetElement === focusableElements[i]) { btnIndex = i; break; } } // Cycle to the next button if (!event.shiftKey) { setFocus(btnIndex, 1); } // Cycle to the prev button else { setFocus(btnIndex, -1); } event.stopPropagation(); event.preventDefault(); }; /** * @param {string} key */ const handleArrows = key => { const actions = getActions(); const confirmButton = getConfirmButton(); const denyButton = getDenyButton(); const cancelButton = getCancelButton(); if (!actions || !confirmButton || !denyButton || !cancelButton) { return; } /** @type HTMLElement[] */ const buttons = [confirmButton, denyButton, cancelButton]; if (document.activeElement instanceof HTMLElement && !buttons.includes(document.activeElement)) { return; } const sibling = arrowKeysNextButton.includes(key) ? 'nextElementSibling' : 'previousElementSibling'; let buttonToFocus = document.activeElement; if (!buttonToFocus) { return; } for (let i = 0; i < actions.children.length; i++) { buttonToFocus = buttonToFocus[sibling]; if (!buttonToFocus) { return; } if (buttonToFocus instanceof HTMLButtonElement && isVisible$1(buttonToFocus)) { break; } } if (buttonToFocus instanceof HTMLButtonElement) { buttonToFocus.focus(); } }; /** * @param {KeyboardEvent} event * @param {SweetAlertOptions} innerParams * @param {Function} dismissWith */ const handleEsc = (event, innerParams, dismissWith) => { event.preventDefault(); if (callIfFunction(innerParams.allowEscapeKey)) { dismissWith(DismissReason.esc); } }; /** * This module contains `WeakMap`s for each effectively-"private property" that a `Swal` has. * For example, to set the private property "foo" of `this` to "bar", you can `privateProps.foo.set(this, 'bar')` * This is the approach that Babel will probably take to implement private methods/fields * https://github.com/tc39/proposal-private-methods * https://github.com/babel/babel/pull/7555 * Once we have the changes from that PR in Babel, and our core class fits reasonable in *one module* * then we can use that language feature. */ var privateMethods = { swalPromiseResolve: new WeakMap(), swalPromiseReject: new WeakMap() }; // From https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/ // Adding aria-hidden="true" to elements outside of the active modal dialog ensures that // elements not within the active modal dialog will not be surfaced if a user opens a screen // reader’s list of elements (headings, form controls, landmarks, etc.) in the document. const setAriaHidden = () => { const container = getContainer(); const bodyChildren = Array.from(document.body.children); bodyChildren.forEach(el => { if (el.contains(container)) { return; } if (el.hasAttribute('aria-hidden')) { el.setAttribute('data-previous-aria-hidden', el.getAttribute('aria-hidden') || ''); } el.setAttribute('aria-hidden', 'true'); }); }; const unsetAriaHidden = () => { const bodyChildren = Array.from(document.body.children); bodyChildren.forEach(el => { if (el.hasAttribute('data-previous-aria-hidden')) { el.setAttribute('aria-hidden', el.getAttribute('data-previous-aria-hidden') || ''); el.removeAttribute('data-previous-aria-hidden'); } else { el.removeAttribute('aria-hidden'); } }); }; // @ts-ignore const isSafariOrIOS = typeof window !== 'undefined' && !!window.GestureEvent; // true for Safari desktop + all iOS browsers https://stackoverflow.com/a/70585394 /** * Fix iOS scrolling * http://stackoverflow.com/q/39626302 */ const iOSfix = () => { if (isSafariOrIOS && !hasClass(document.body, swalClasses.iosfix)) { const offset = document.body.scrollTop; document.body.style.top = `${offset * -1}px`; addClass(document.body, swalClasses.iosfix); lockBodyScroll(); } }; /** * https://github.com/sweetalert2/sweetalert2/issues/1246 */ const lockBodyScroll = () => { const container = getContainer(); if (!container) { return; } /** @type {boolean} */ let preventTouchMove; /** * @param {TouchEvent} event */ container.ontouchstart = event => { preventTouchMove = shouldPreventTouchMove(event); }; /** * @param {TouchEvent} event */ container.ontouchmove = event => { if (preventTouchMove) { event.preventDefault(); event.stopPropagation(); } }; }; /** * @param {TouchEvent} event * @returns {boolean} */ const shouldPreventTouchMove = event => { const target = event.target; const container = getContainer(); const htmlContainer = getHtmlContainer(); if (!container || !htmlContainer) { return false; } if (isStylus(event) || isZoom(event)) { return false; } if (target === container) { return true; } if (!isScrollable(container) && target instanceof HTMLElement && !selfOrParentIsScrollable(target, htmlContainer) && // #2823 target.tagName !== 'INPUT' && // #1603 target.tagName !== 'TEXTAREA' && // #2266 !(isScrollable(htmlContainer) && // #1944 htmlContainer.contains(target))) { return true; } return false; }; /** * https://github.com/sweetalert2/sweetalert2/issues/1786 * * @param {*} event * @returns {boolean} */ const isStylus = event => { return event.touches && event.touches.length && event.touches[0].touchType === 'stylus'; }; /** * https://github.com/sweetalert2/sweetalert2/issues/1891 * * @param {TouchEvent} event * @returns {boolean} */ const isZoom = event => { return event.touches && event.touches.length > 1; }; const undoIOSfix = () => { if (hasClass(document.body, swalClasses.iosfix)) { const offset = parseInt(document.body.style.top, 10); removeClass(document.body, swalClasses.iosfix); document.body.style.top = ''; document.body.scrollTop = offset * -1; } }; /** * Measure scrollbar width for padding body during modal show/hide * https://github.com/twbs/bootstrap/blob/master/js/src/modal.js * * @returns {number} */ const measureScrollbar = () => { const scrollDiv = document.createElement('div'); scrollDiv.className = swalClasses['scrollbar-measure']; document.body.appendChild(scrollDiv); const scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth; document.body.removeChild(scrollDiv); return scrollbarWidth; }; /** * Remember state in cases where opening and handling a modal will fiddle with it. * @type {number | null} */ let previousBodyPadding = null; /** * @param {string} initialBodyOverflow */ const replaceScrollbarWithPadding = initialBodyOverflow => { // for queues, do not do this more than once if (previousBodyPadding !== null) { return; } // if the body has overflow if (document.body.scrollHeight > window.innerHeight || initialBodyOverflow === 'scroll' // https://github.com/sweetalert2/sweetalert2/issues/2663 ) { // add padding so the content doesn't shift after removal of scrollbar previousBodyPadding = parseInt(window.getComputedStyle(document.body).getPropertyValue('padding-right')); document.body.style.paddingRight = `${previousBodyPadding + measureScrollbar()}px`; } }; const undoReplaceScrollbarWithPadding = () => { if (previousBodyPadding !== null) { document.body.style.paddingRight = `${previousBodyPadding}px`; previousBodyPadding = null; } }; /** * @param {SweetAlert} instance * @param {HTMLElement} container * @param {boolean} returnFocus * @param {Function} didClose */ function removePopupAndResetState(instance, container, returnFocus, didClose) { if (isToast()) { triggerDidCloseAndDispose(instance, didClose); } else { restoreActiveElement(returnFocus).then(() => triggerDidCloseAndDispose(instance, didClose)); removeKeydownHandler(globalState); } // workaround for https://github.com/sweetalert2/sweetalert2/issues/2088 // for some reason removing the container in Safari will scroll the document to bottom if (isSafariOrIOS) { container.setAttribute('style', 'display:none !important'); container.removeAttribute('class'); container.innerHTML = ''; } else { container.remove(); } if (isModal()) { undoReplaceScrollbarWithPadding(); undoIOSfix(); unsetAriaHidden(); } removeBodyClasses(); } /** * Remove SweetAlert2 classes from body */ function removeBodyClasses() { removeClass([document.documentElement, document.body], [swalClasses.shown, swalClasses['height-auto'], swalClasses['no-backdrop'], swalClasses['toast-shown']]); } /** * Instance method to close sweetAlert * * @param {any} resolveValue */ function close(resolveValue) { resolveValue = prepareResolveValue(resolveValue); const swalPromiseResolve = privateMethods.swalPromiseResolve.get(this); const didClose = triggerClosePopup(this); if (this.isAwaitingPromise) { // A swal awaiting for a promise (after a click on Confirm or Deny) cannot be dismissed anymore #2335 if (!resolveValue.isDismissed) { handleAwaitingPromise(this); swalPromiseResolve(resolveValue); } } else if (didClose) { // Resolve Swal promise swalPromiseResolve(resolveValue); } } const triggerClosePopup = instance => { const popup = getPopup(); if (!popup) { return false; } const innerParams = privateProps.innerParams.get(instance); if (!innerParams || hasClass(popup, innerParams.hideClass.popup)) { return false; } removeClass(popup, innerParams.showClass.popup); addClass(popup, innerParams.hideClass.popup); const backdrop = getContainer(); removeClass(backdrop, innerParams.showClass.backdrop); addClass(backdrop, innerParams.hideClass.backdrop); handlePopupAnimation(instance, popup, innerParams); return true; }; /** * @param {any} error */ function rejectPromise(error) { const rejectPromise = privateMethods.swalPromiseReject.get(this); handleAwaitingPromise(this); if (rejectPromise) { // Reject Swal promise rejectPromise(error); } } /** * @param {SweetAlert} instance */ const handleAwaitingPromise = instance => { if (instance.isAwaitingPromise) { delete instance.isAwaitingPromise; // The instance might have been previously partly destroyed, we must resume the destroy process in this case #2335 if (!privateProps.innerParams.get(instance)) { instance._destroy(); } } }; /** * @param {any} resolveValue * @returns {SweetAlertResult} */ const prepareResolveValue = resolveValue => { // When user calls Swal.close() if (typeof resolveValue === 'undefined') { return { isConfirmed: false, isDenied: false, isDismissed: true }; } return Object.assign({ isConfirmed: false, isDenied: false, isDismissed: false }, resolveValue); }; /** * @param {SweetAlert} instance * @param {HTMLElement} popup * @param {SweetAlertOptions} innerParams */ const handlePopupAnimation = (instance, popup, innerParams) => { var _globalState$eventEmi; const container = getContainer(); // If animation is supported, animate const animationIsSupported = hasCssAnimation(popup); if (typeof innerParams.willClose === 'function') { innerParams.willClose(popup); } (_globalState$eventEmi = globalState.eventEmitter) === null || _globalState$eventEmi === void 0 || _globalState$eventEmi.emit('willClose', popup); if (animationIsSupported) { animatePopup(instance, popup, container, innerParams.returnFocus, innerParams.didClose); } else { // Otherwise, remove immediately removePopupAndResetState(instance, container, innerParams.returnFocus, innerParams.didClose); } }; /** * @param {SweetAlert} instance * @param {HTMLElement} popup * @param {HTMLElement} container * @param {boolean} returnFocus * @param {Function} didClose */ const animatePopup = (instance, popup, container, returnFocus, didClose) => { globalState.swalCloseEventFinishedCallback = removePopupAndResetState.bind(null, instance, container, returnFocus, didClose); /** * @param {AnimationEvent | TransitionEvent} e */ const swalCloseAnimationFinished = function (e) { if (e.target === popup) { var _globalState$swalClos; (_globalState$swalClos = globalState.swalCloseEventFinishedCallback) === null || _globalState$swalClos === void 0 || _globalState$swalClos.call(globalState); delete globalState.swalCloseEventFinishedCallback; popup.removeEventListener('animationend', swalCloseAnimationFinished); popup.removeEventListener('transitionend', swalCloseAnimationFinished); } }; popup.addEventListener('animationend', swalCloseAnimationFinished); popup.addEventListener('transitionend', swalCloseAnimationFinished); }; /** * @param {SweetAlert} instance * @param {Function} didClose */ const triggerDidCloseAndDispose = (instance, didClose) => { setTimeout(() => { var _globalState$eventEmi2; if (typeof didClose === 'function') { didClose.bind(instance.params)(); } (_globalState$eventEmi2 = globalState.eventEmitter) === null || _globalState$eventEmi2 === void 0 || _globalState$eventEmi2.emit('didClose'); // instance might have been destroyed already if (instance._destroy) { instance._destroy(); } }); }; /** * Shows loader (spinner), this is useful with AJAX requests. * By default the loader be shown instead of the "Confirm" button. * * @param {HTMLButtonElement | null} [buttonToReplace] */ const showLoading = buttonToReplace => { let popup = getPopup(); if (!popup) { new Swal(); } popup = getPopup(); if (!popup) { return; } const loader = getLoader(); if (isToast()) { hide(getIcon()); } else { replaceButton(popup, buttonToReplace); } show(loader); popup.setAttribute('data-loading', 'true'); popup.setAttribute('aria-busy', 'true'); popup.focus(); }; /** * @param {HTMLElement} popup * @param {HTMLButtonElement | null} [buttonToReplace] */ const replaceButton = (popup, buttonToReplace) => { const actions = getActions(); const loader = getLoader(); if (!actions || !loader) { return; } if (!buttonToReplace && isVisible$1(getConfirmButton())) { buttonToReplace = getConfirmButton(); } show(actions); if (buttonToReplace) { hide(buttonToReplace); loader.setAttribute('data-button-to-replace', buttonToReplace.className); actions.insertBefore(loader, buttonToReplace); } addClass([popup, actions], swalClasses.loading); }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const handleInputOptionsAndValue = (instance, params) => { if (params.input === 'select' || params.input === 'radio') { handleInputOptions(instance, params); } else if (['text', 'email', 'number', 'tel', 'textarea'].some(i => i === params.input) && (hasToPromiseFn(params.inputValue) || isPromise(params.inputValue))) { showLoading(getConfirmButton()); handleInputValue(instance, params); } }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} innerParams * @returns {SweetAlertInputValue} */ const getInputValue = (instance, innerParams) => { const input = instance.getInput(); if (!input) { return null; } switch (innerParams.input) { case 'checkbox': return getCheckboxValue(input); case 'radio': return getRadioValue(input); case 'file': return getFileValue(input); default: return innerParams.inputAutoTrim ? input.value.trim() : input.value; } }; /** * @param {HTMLInputElement} input * @returns {number} */ const getCheckboxValue = input => input.checked ? 1 : 0; /** * @param {HTMLInputElement} input * @returns {string | null} */ const getRadioValue = input => input.checked ? input.value : null; /** * @param {HTMLInputElement} input * @returns {FileList | File | null} */ const getFileValue = input => input.files && input.files.length ? input.getAttribute('multiple') !== null ? input.files : input.files[0] : null; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const handleInputOptions = (instance, params) => { const popup = getPopup(); if (!popup) { return; } /** * @param {Record} inputOptions */ const processInputOptions = inputOptions => { if (params.input === 'select') { populateSelectOptions(popup, formatInputOptions(inputOptions), params); } else if (params.input === 'radio') { populateRadioOptions(popup, formatInputOptions(inputOptions), params); } }; if (hasToPromiseFn(params.inputOptions) || isPromise(params.inputOptions)) { showLoading(getConfirmButton()); asPromise(params.inputOptions).then(inputOptions => { instance.hideLoading(); processInputOptions(inputOptions); }); } else if (typeof params.inputOptions === 'object') { processInputOptions(params.inputOptions); } else { error(`Unexpected type of inputOptions! Expected object, Map or Promise, got ${typeof params.inputOptions}`); } }; /** * @param {SweetAlert} instance * @param {SweetAlertOptions} params */ const handleInputValue = (instance, params) => { const input = instance.getInput(); if (!input) { return; } hide(input); asPromise(params.inputValue).then(inputValue => { input.value = params.input === 'number' ? `${parseFloat(inputValue) || 0}` : `${inputValue}`; show(input); input.focus(); instance.hideLoading(); }).catch(err => { error(`Error in inputValue promise: ${err}`); input.value = ''; show(input); input.focus(); instance.hideLoading(); }); }; /** * @param {HTMLElement} popup * @param {InputOptionFlattened[]} inputOptions * @param {SweetAlertOptions} params */ function populateSelectOptions(popup, inputOptions, params) { const select = getDirectChildByClass(popup, swalClasses.select); if (!select) { return; } /** * @param {HTMLElement} parent * @param {string} optionLabel * @param {string} optionValue */ const renderOption = (parent, optionLabel, optionValue) => { const option = document.createElement('option'); option.value = optionValue; setInnerHtml(option, optionLabel); option.selected = isSelected(optionValue, params.inputValue); parent.appendChild(option); }; inputOptions.forEach(inputOption => { const optionValue = inputOption[0]; const optionLabel = inputOption[1]; // spec: // https://www.w3.org/TR/html401/interact/forms.html#h-17.6 // "...all OPTGROUP elements must be specified directly within a SELECT element (i.e., groups may not be nested)..." // check whether this is a if (Array.isArray(optionLabel)) { // if it is an array, then it is an const optgroup = document.createElement('optgroup'); optgroup.label = optionValue; optgroup.disabled = false; // not configurable for now select.appendChild(optgroup); optionLabel.forEach(o => renderOption(optgroup, o[1], o[0])); } else { // case of