${window.lpCourseBuilder?.i18n?.click_to_upload || 'Click to upload'}
${window.lpCourseBuilder?.i18n?.image_hint || 'JPG, JPEG, PNG less than 1MB'}
`;
dropzone.classList.remove('has-image');
// Clear thumbnail ID
if (thumbnailInput) {
thumbnailInput.value = '';
// Mark form as having unsaved changes
(0,_builder_form_state_js__WEBPACK_IMPORTED_MODULE_5__.getFormState)().markAsChanged();
}
// Hide action buttons
if (actionsContainer) {
actionsContainer.innerHTML = '';
}
}
buildPermalinkDisplayUrl(baseUrl = '', slug = '', fallbackUrl = '') {
const normalizedBaseUrl = typeof baseUrl === 'string' ? baseUrl : '';
const normalizedSlug = typeof slug === 'string' ? slug.trim() : '';
if (normalizedBaseUrl && normalizedSlug) {
return `${normalizedBaseUrl}${normalizedSlug}`;
}
return typeof fallbackUrl === 'string' ? fallbackUrl : '';
}
/**
* Handle permalink Edit button click.
* Shows editor mode, hides display mode.
*/
handlePermalinkEdit(args) {
const {
e
} = args;
if (e) e.preventDefault();
const display = document.querySelector(BuilderEditCourse.selectors.elPermalinkDisplay);
const editor = document.querySelector(BuilderEditCourse.selectors.elPermalinkEditor);
const input = document.querySelector(BuilderEditCourse.selectors.elPermalinkSlugInput);
if (!display || !editor || !input) return;
// Store original value for cancel
input.dataset.originalValue = input.value;
// Toggle visibility
display.classList.add('lp-hidden');
editor.classList.remove('lp-hidden');
// Focus input and select text
input.focus();
input.select();
}
/**
* Handle permalink OK button click.
* Validates and sanitizes slug, updates display.
*/
handlePermalinkOk(args) {
const {
e
} = args;
if (e) e.preventDefault();
const display = document.querySelector(BuilderEditCourse.selectors.elPermalinkDisplay);
const editor = document.querySelector(BuilderEditCourse.selectors.elPermalinkEditor);
const input = document.querySelector(BuilderEditCourse.selectors.elPermalinkSlugInput);
const urlLink = document.querySelector(BuilderEditCourse.selectors.elPermalinkUrl);
const baseUrlInput = document.querySelector(BuilderEditCourse.selectors.elPermalinkBaseUrl);
if (!display || !editor || !input || !urlLink) return;
// Sanitize the slug
let newSlug = input.value.trim();
// If empty after sanitizing, restore original
if (!newSlug) {
newSlug = input.dataset.originalValue || 'course';
}
// Update input value with sanitized slug
input.value = newSlug;
// Get base URL
const baseUrl = baseUrlInput ? baseUrlInput.value : '';
const newUrl = this.buildPermalinkDisplayUrl(baseUrl, newSlug, urlLink.textContent || '');
// Keep href as the current saved link and only update display text.
urlLink.textContent = newUrl;
// Toggle visibility back to display mode
editor.classList.add('lp-hidden');
display.classList.remove('lp-hidden');
// Mark form as changed if slug differs from original
if (newSlug !== input.dataset.originalValue) {
(0,_builder_form_state_js__WEBPACK_IMPORTED_MODULE_5__.getFormState)().markAsChanged();
}
}
/**
* Handle permalink Cancel button click.
* Restores original value and returns to display mode.
*/
handlePermalinkCancel(args) {
const {
e
} = args;
if (e) e.preventDefault();
const display = document.querySelector(BuilderEditCourse.selectors.elPermalinkDisplay);
const editor = document.querySelector(BuilderEditCourse.selectors.elPermalinkEditor);
const input = document.querySelector(BuilderEditCourse.selectors.elPermalinkSlugInput);
if (!display || !editor || !input) return;
// Restore original value
input.value = input.dataset.originalValue || '';
// Toggle visibility back to display mode
editor.classList.add('lp-hidden');
display.classList.remove('lp-hidden');
}
initTabTitles() {
const tabLinks = document.querySelectorAll(BuilderEditCourse.selectors.elTabLinks);
tabLinks.forEach(link => {
const textSpan = link.querySelector('span');
const title = textSpan ? textSpan.textContent.trim() : link.textContent.trim();
const href = link.getAttribute('href');
if (!href) return;
const targetId = href.substring(1);
const panel = document.getElementById(targetId);
if (panel) {
panel.setAttribute('data-tab-title', title);
}
});
}
initTitleCharCount() {
const titleInput = document.querySelector(BuilderEditCourse.selectors.elTitleInput);
if (titleInput) {
this.updateTitleCharCount(titleInput.value);
}
}
updateTitleCharCount(text) {
const charCountEl = document.querySelector(BuilderEditCourse.selectors.elTitleCharCount);
if (!charCountEl) return;
const charCount = text.length;
const charText = charCount === 1 ? 'character' : 'characters';
charCountEl.textContent = `${charCount} ${charText}`;
}
handleTitleInput(args) {
const {
target
} = args;
this.updateTitleCharCount(target.value);
}
initDescWordCount() {
// Wait for TinyMCE to be ready
if (typeof tinymce !== 'undefined') {
tinymce.on('AddEditor', e => {
if (e.editor.id === 'course_description_editor') {
e.editor.on('init', () => {
this.updateDescWordCount(e.editor);
// Listen for content changes
e.editor.on('keyup change input NodeChange', () => {
this.updateDescWordCount(e.editor);
});
});
}
});
// If editor already exists
const existingEditor = tinymce.get('course_description_editor');
if (existingEditor) {
this.updateDescWordCount(existingEditor);
existingEditor.on('keyup change input NodeChange', () => {
this.updateDescWordCount(existingEditor);
});
}
}
}
updateDescWordCount(editor) {
const wordCountEl = document.querySelector(BuilderEditCourse.selectors.elDescWordCount);
if (!wordCountEl) return;
// Use TinyMCE's built-in word count plugin
const wordcount = editor.plugins.wordcount;
let count = 0;
if (wordcount && typeof wordcount.body !== 'undefined') {
count = wordcount.body.getWordCount();
} else if (wordcount && typeof wordcount.getCount !== 'undefined') {
count = wordcount.getCount();
} else {
// Fallback: manual count
const content = editor.getContent({
format: 'text'
});
count = this.countWords(content);
}
const wordText = count === 1 ? 'word' : 'words';
wordCountEl.textContent = `${count} ${wordText}`;
}
updateHeaderTitle(title) {
const headerTitle = document.querySelector('.lp-cb-header__title');
if (headerTitle && title) {
headerTitle.textContent = title;
}
}
countWords(text) {
const trimmedText = text.replace(/<[^>]*>/g, '').trim();
if (trimmedText.length === 0) return 0;
const words = trimmedText.split(/\s+/).filter(word => word.length > 0);
return words.length;
}
/**
* Initialize Header Actions Dropdown
* Handles toggle open/close for dropdown menu in header actions
*/
initHeaderActionsDropdown() {
const dropdownWrapper = document.querySelector(BuilderEditCourse.selectors.elHeaderActionsDropdown);
if (!dropdownWrapper) return;
const toggleBtn = dropdownWrapper.querySelector(BuilderEditCourse.selectors.elDropdownToggle);
const dropdownMenu = dropdownWrapper.querySelector(BuilderEditCourse.selectors.elDropdownMenu);
if (!toggleBtn || !dropdownMenu) return;
// Toggle dropdown on button click
toggleBtn.addEventListener('click', e => {
e.stopPropagation();
const isOpen = dropdownMenu.classList.contains('is-open');
if (isOpen) {
this.closeHeaderDropdown(toggleBtn, dropdownMenu);
} else {
this.openHeaderDropdown(toggleBtn, dropdownMenu);
}
});
// Close dropdown when clicking outside
document.addEventListener('click', e => {
if (!dropdownWrapper.contains(e.target)) {
this.closeHeaderDropdown(toggleBtn, dropdownMenu);
}
});
// Close dropdown on Escape key
document.addEventListener('keydown', e => {
if (e.key === 'Escape') {
this.closeHeaderDropdown(toggleBtn, dropdownMenu);
}
});
// Close dropdown after clicking an item (except when it triggers an action that keeps page)
const dropdownItems = dropdownMenu.querySelectorAll('.cb-dropdown-item');
dropdownItems.forEach(item => {
item.addEventListener('click', () => {
// Small delay to allow action to process before closing
setTimeout(() => {
this.closeHeaderDropdown(toggleBtn, dropdownMenu);
}, 100);
});
});
}
openHeaderDropdown(toggleBtn, dropdownMenu) {
dropdownMenu.classList.add('is-open');
toggleBtn.setAttribute('aria-expanded', 'true');
}
closeHeaderDropdown(toggleBtn, dropdownMenu) {
dropdownMenu.classList.remove('is-open');
toggleBtn.setAttribute('aria-expanded', 'false');
}
}
/***/ },
/***/ "./assets/src/js/frontend/course-builder/builder-course/builder-tab-course.js"
/*!************************************************************************************!*\
!*** ./assets/src/js/frontend/course-builder/builder-course/builder-tab-course.js ***!
\************************************************************************************/
(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BuilderTabCourse: () => (/* binding */ BuilderTabCourse)
/* harmony export */ });
/* harmony import */ var lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lpAssetsJsPath/utils.js */ "./assets/src/js/utils.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 lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! lpAssetsJsPath/lpToastify.js */ "./assets/src/js/lpToastify.js");
/* harmony import */ var _swal_icons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../swal-icons.js */ "./assets/src/js/frontend/course-builder/swal-icons.js");
class BuilderTabCourse {
constructor() {
this.init();
}
static selectors = {
elBtnCreateCourse: 'a.cb-btn-add-new[href]',
elCourseItem: '.course-item',
elCourseExpandedItems: '.course-action-expanded__items',
elCourseDuplicate: '.course-action-expanded__duplicate',
elCourseTrash: '.course-action-expanded__trash',
elCourseDraft: '.course-action-expanded__draft',
elCourseDelete: '.course-action-expanded__delete',
elCourseActionExpanded: '.course-action-expanded',
elCourseStatus: '.course-status'
};
init() {
this.events();
}
events() {
if (BuilderTabCourse._loadedEvents) {
return;
}
BuilderTabCourse._loadedEvents = true;
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.eventHandlers('click', [{
selector: BuilderTabCourse.selectors.elCourseDuplicate,
class: this,
callBack: this.duplicateCourse.name
}, {
selector: BuilderTabCourse.selectors.elCourseTrash,
class: this,
callBack: this.trashCourse.name
}, {
selector: BuilderTabCourse.selectors.elCourseDraft,
class: this,
callBack: this.draftCourse.name
}, {
selector: BuilderTabCourse.selectors.elCourseDelete,
class: this,
callBack: this.deleteCourse.name
}, {
selector: BuilderTabCourse.selectors.elCourseActionExpanded,
class: this,
callBack: this.toggleExpandedAction.name
}, {
selector: BuilderTabCourse.selectors.elBtnCreateCourse,
callBack: args => {
const {
target
} = args;
const elBtnCreateCourse = target.closest(BuilderTabCourse.selectors.elBtnCreateCourse);
if (!elBtnCreateCourse) {
return;
}
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elBtnCreateCourse, 1);
}
}]);
document.addEventListener('click', e => {
if (!e.target.closest(BuilderTabCourse.selectors.elCourseActionExpanded)) {
this.closeAllExpanded();
}
});
}
duplicateCourse(args) {
const {
target
} = args;
const elCourseDuplicate = target.closest(BuilderTabCourse.selectors.elCourseDuplicate);
const elCourseItem = elCourseDuplicate.closest(BuilderTabCourse.selectors.elCourseItem);
if (!elCourseItem) {
return;
}
const courseId = elCourseItem.dataset.courseId || '';
if (!courseId) {
return;
}
sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().fire({
title: elCourseDuplicate.dataset.title || 'Duplicate Course',
text: elCourseDuplicate.dataset.content || 'Are you sure you want to duplicate this course?',
iconHtml: _swal_icons_js__WEBPACK_IMPORTED_MODULE_3__.SWAL_ICON_DUPLICATE,
customClass: {
icon: 'lp-cb-swal-icon-html'
},
showCloseButton: true,
showCancelButton: true,
cancelButtonText: lpData.i18n.cancel,
confirmButtonText: lpData.i18n.yes,
reverseButtons: true
}).then(result => {
if (result.isConfirmed) {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elCourseDuplicate, 1);
const dataSend = {
action: 'duplicate_course',
args: {
id_url: 'duplicate-course'
},
course_id: courseId
};
const callBack = {
success: response => {
const {
status,
message,
data
} = response;
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(message || 'Duplicated successfully!', status);
if (data?.html) {
const elCourse = elCourseDuplicate.closest('.course');
const elCourseList = elCourse.closest('.courses-list') || elCourse.parentElement;
if (elCourseList) {
elCourseList.insertAdjacentHTML('afterbegin', data.html);
const newCourse = elCourseList.firstElementChild;
if (newCourse) {
newCourse.scrollIntoView({
behavior: 'smooth',
block: 'nearest'
});
newCourse.classList.add('highlight-new-course');
setTimeout(() => {
newCourse.classList.remove('highlight-new-course');
}, 1500);
}
}
}
},
error: error => {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(error.message || error, 'error');
},
completed: () => {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elCourseDuplicate, 0);
}
};
window.lpAJAXG.fetchAJAX(dataSend, callBack);
}
});
}
trashCourse(args) {
const {
target
} = args;
const elCourseTrash = target.closest(BuilderTabCourse.selectors.elCourseTrash);
const elCourseItem = elCourseTrash.closest(BuilderTabCourse.selectors.elCourseItem);
if (!elCourseItem) {
return;
}
const courseId = elCourseItem.dataset.courseId || '';
sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().fire({
title: elCourseTrash.dataset.title || 'Trash Course',
text: elCourseTrash.dataset.content || 'Are you sure you want to move this course to trash?',
iconHtml: _swal_icons_js__WEBPACK_IMPORTED_MODULE_3__.SWAL_ICON_TRASH_DRAFT,
customClass: {
icon: 'lp-cb-swal-icon-html'
},
showCloseButton: true,
showCancelButton: true,
cancelButtonText: lpData.i18n.cancel,
confirmButtonText: lpData.i18n.yes,
reverseButtons: true
}).then(result => {
if (result.isConfirmed) {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elCourseTrash, 1);
const dataSend = {
action: 'move_trash_course',
args: {
id_url: 'move-trash-course'
},
course_id: courseId
};
const callBack = {
success: response => {
const {
status,
message,
data
} = response;
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(message, status);
if (data?.status) {
const elCourse = elCourseTrash.closest('.course');
this.updateStatusUI(elCourse, data.status);
}
},
error: error => {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(error.message || error, 'error');
},
completed: () => {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elCourseTrash, 0);
}
};
window.lpAJAXG.fetchAJAX(dataSend, callBack);
}
});
}
draftCourse(args) {
const {
target
} = args;
const elCourseDraft = target.closest(BuilderTabCourse.selectors.elCourseDraft);
const elCourseItem = elCourseDraft.closest(BuilderTabCourse.selectors.elCourseItem);
if (!elCourseItem) {
return;
}
// Check if published to show confirm unpublish modal
const statusEl = elCourseItem.querySelector(BuilderTabCourse.selectors.elCourseStatus);
const isPublished = statusEl && statusEl.classList.contains('publish');
if (isPublished) {
const confirmMsg = elCourseDraft.dataset.confirmUnpublish || 'Saving as draft will unpublish this item. Are you sure?';
sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().fire({
title: 'Draft Course',
text: confirmMsg,
iconHtml: _swal_icons_js__WEBPACK_IMPORTED_MODULE_3__.SWAL_ICON_TRASH_DRAFT,
customClass: {
icon: 'lp-cb-swal-icon-html'
},
showCloseButton: true,
showCancelButton: true,
cancelButtonText: lpData.i18n.cancel,
confirmButtonText: lpData.i18n.yes,
reverseButtons: true
}).then(result => {
if (result.isConfirmed) {
this.draftCourseExecute(elCourseDraft, elCourseItem);
}
});
return;
}
this.draftCourseExecute(elCourseDraft, elCourseItem);
}
draftCourseExecute(elCourseDraft, elCourseItem) {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elCourseDraft, 1);
const courseId = elCourseItem.dataset.courseId || '';
const dataSend = {
action: 'move_trash_course',
args: {
id_url: 'move-trash-course'
},
course_id: courseId || 0,
status: 'draft'
};
const callBack = {
success: response => {
const {
status,
message,
data
} = response;
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(message, status);
if (data?.status) {
const elCourse = elCourseDraft.closest('.course');
this.updateStatusUI(elCourse, data.status);
}
},
error: error => {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(error.message || error, 'error');
},
completed: () => {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elCourseDraft, 0);
}
};
window.lpAJAXG.fetchAJAX(dataSend, callBack);
}
deleteCourse(args) {
const {
target
} = args;
const elCourseDelete = target.closest(BuilderTabCourse.selectors.elCourseDelete);
const elCourseItem = elCourseDelete.closest(BuilderTabCourse.selectors.elCourseItem);
if (!elCourseItem) {
return;
}
const courseId = elCourseItem.dataset.courseId || '';
if (!courseId) {
return;
}
sweetalert2__WEBPACK_IMPORTED_MODULE_1___default().fire({
title: elCourseDelete.dataset.title || 'Delete Course',
text: elCourseDelete.dataset.content || 'Are you sure you want to permanently delete this course?',
iconHtml: _swal_icons_js__WEBPACK_IMPORTED_MODULE_3__.SWAL_ICON_DELETE,
customClass: {
icon: 'lp-cb-swal-icon-html'
},
showCloseButton: true,
showCancelButton: true,
cancelButtonText: lpData.i18n.cancel,
confirmButtonText: lpData.i18n.yes,
reverseButtons: true
}).then(result => {
if (result.isConfirmed) {
const dataSend = {
action: 'move_trash_course',
args: {
id_url: 'move-trash-course'
},
course_id: courseId,
status: 'delete'
};
const callBack = {
success: response => {
const {
status,
message
} = response;
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(message, status);
const elCourse = elCourseDelete.closest('.course');
elCourse.style.transition = 'opacity 0.4s ease-out, transform 0.4s ease-out';
elCourse.style.opacity = '0';
elCourse.style.transform = 'translateX(160px)';
setTimeout(() => {
elCourse.remove();
}, 400);
},
error: error => {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_2__.show(error.message || error, 'error');
}
};
window.lpAJAXG.fetchAJAX(dataSend, callBack);
}
});
}
toggleExpandedAction(args) {
const {
target
} = args;
const elCourseActionExpanded = target.closest(BuilderTabCourse.selectors.elCourseActionExpanded);
if (!elCourseActionExpanded) {
return;
}
const elCourseItem = elCourseActionExpanded.closest(BuilderTabCourse.selectors.elCourseItem);
if (!elCourseItem) {
return;
}
const elExpandedItems = elCourseItem.querySelector(BuilderTabCourse.selectors.elCourseExpandedItems);
if (!elExpandedItems) {
return;
}
// Close others
this.closeAllExpanded(elExpandedItems);
elExpandedItems.classList.toggle('active');
elCourseActionExpanded.classList.toggle('active');
}
closeAllExpanded(excludeElement = null) {
const allExpandedItems = document.querySelectorAll(`${BuilderTabCourse.selectors.elCourseExpandedItems}.active`);
allExpandedItems.forEach(item => {
if (item === excludeElement) {
return;
}
item.classList.remove('active');
const courseItem = item.closest(BuilderTabCourse.selectors.elCourseItem);
if (!courseItem) {
return;
}
const expandedBtn = courseItem.querySelector(BuilderTabCourse.selectors.elCourseActionExpanded);
if (expandedBtn) {
expandedBtn.classList.remove('active');
}
});
}
updateStatusUI(elCourse, status) {
const elStatus = elCourse.querySelector(BuilderTabCourse.selectors.elCourseStatus);
const elSpanStatus = elCourse.querySelector(`${BuilderTabCourse.selectors.elCourseStatus} span`);
if (elSpanStatus && elStatus) {
elStatus.className = 'course-status ' + status;
elSpanStatus.textContent = status;
}
}
}
/***/ },
/***/ "./assets/src/js/frontend/course-builder/builder-course/extra-info.js"
/*!****************************************************************************!*\
!*** ./assets/src/js/frontend/course-builder/builder-course/extra-info.js ***!
\****************************************************************************/
(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ MetaboxExtraInfo: () => (/* binding */ MetaboxExtraInfo)
/* harmony export */ });
/* harmony import */ var lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lpAssetsJsPath/utils.js */ "./assets/src/js/utils.js");
/* harmony import */ var sortablejs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! sortablejs */ "./node_modules/sortablejs/modular/sortable.esm.js");
class MetaboxExtraInfo {
constructor() {
this.init();
}
static selectors = {
elExtraMetaboxAdd: '.lp_course_extra_meta_box__add',
elExtraMetaboxContent: '.lp_course_extra_meta_box__content',
elExtraMetaboxFields: '.lp_course_extra_meta_box__fields',
elExtraMetaboxField: '.lp_course_extra_meta_box__field',
elExtraMetaboxDelete: '.lp_course_extra_meta_box__fields a.delete',
elFaqMetaboxAdd: '.lp_course_faq_meta_box__add',
elFaqMetaboxContent: '.lp_course_faq_meta_box__content',
elFaqMetaboxFields: '.lp_course_faq_meta_box__fields',
elFaqMetaboxField: '.lp_course_faq_meta_box__field',
elFaqMetaboxDelete: '.lp_course_faq_meta_box__fields a.delete'
};
init() {
this.initSortable();
this.events();
}
events() {
if (MetaboxExtraInfo._loadedEvents) {
return;
}
MetaboxExtraInfo._loadedEvents = true;
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.eventHandlers('click', [{
selector: MetaboxExtraInfo.selectors.elExtraMetaboxAdd,
class: this,
callBack: this.handleExtraMetaboxAdd.name
}, {
selector: MetaboxExtraInfo.selectors.elExtraMetaboxDelete,
class: this,
callBack: this.handleExtraMetaboxDelete.name
}, {
selector: MetaboxExtraInfo.selectors.elFaqMetaboxAdd,
class: this,
callBack: this.handleFaqMetaboxAdd.name
}, {
selector: MetaboxExtraInfo.selectors.elFaqMetaboxDelete,
class: this,
callBack: this.handleFaqMetaboxDelete.name
}]);
}
handleExtraMetaboxAdd(args) {
const {
e,
target
} = args;
e.preventDefault();
const content = target.closest(MetaboxExtraInfo.selectors.elExtraMetaboxContent);
if (!content) return;
const fields = content.querySelector(MetaboxExtraInfo.selectors.elExtraMetaboxFields);
const addData = target.dataset.add;
if (fields && addData) {
fields.insertAdjacentHTML('beforeend', addData);
const lastField = fields.querySelector(`${MetaboxExtraInfo.selectors.elExtraMetaboxField}:last-child`);
if (lastField) {
const input = lastField.querySelector('input');
if (input) {
setTimeout(() => input.focus(), 100);
}
}
}
return false;
}
handleExtraMetaboxDelete(args) {
const {
e,
target
} = args;
e.preventDefault();
const field = target.closest(MetaboxExtraInfo.selectors.elExtraMetaboxField);
if (field) {
field.remove();
}
return false;
}
handleFaqMetaboxAdd(args) {
const {
e,
target
} = args;
e.preventDefault();
const content = target.closest(MetaboxExtraInfo.selectors.elFaqMetaboxContent);
if (!content) return;
const fields = content.querySelector(MetaboxExtraInfo.selectors.elFaqMetaboxFields);
const addData = target.dataset.add;
if (fields && addData) {
fields.insertAdjacentHTML('beforeend', addData);
}
return false;
}
handleFaqMetaboxDelete(args) {
const {
e,
target
} = args;
e.preventDefault();
const field = target.closest(MetaboxExtraInfo.selectors.elFaqMetaboxField);
if (field) {
field.remove();
}
return false;
}
initSortable() {
const extraFieldsContainers = document.querySelectorAll('.lp_course_extra_meta_box__fields');
extraFieldsContainers.forEach(container => {
new sortablejs__WEBPACK_IMPORTED_MODULE_1__["default"](container, {
animation: 150,
handle: '.sort',
draggable: '.lp_course_extra_meta_box__field',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
dragClass: 'sortable-drag',
forceFallback: false,
scrollSensitivity: 40,
onStart: evt => {
evt.item.classList.add('is-dragging');
},
onEnd: evt => {
evt.item.classList.remove('is-dragging');
}
});
});
const faqFieldsContainers = document.querySelectorAll('.lp_course_faq_meta_box__fields');
faqFieldsContainers.forEach(container => {
new sortablejs__WEBPACK_IMPORTED_MODULE_1__["default"](container, {
animation: 150,
handle: '.sort',
draggable: '.lp_course_faq_meta_box__field',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
dragClass: 'sortable-drag',
forceFallback: false,
scrollSensitivity: 40,
onStart: evt => {
evt.item.classList.add('is-dragging');
},
onEnd: evt => {
evt.item.classList.remove('is-dragging');
}
});
});
}
}
/***/ },
/***/ "./assets/src/js/frontend/course-builder/builder-dashboard.js"
/*!********************************************************************!*\
!*** ./assets/src/js/frontend/course-builder/builder-dashboard.js ***!
\********************************************************************/
(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BuilderDashboard: () => (/* binding */ BuilderDashboard)
/* harmony export */ });
/* harmony import */ var chart_js_auto__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! chart.js/auto */ "./node_modules/chart.js/auto/auto.js");
/**
* Dashboard charts and interactions for Course Builder.
*
* @since 4.3.0
* @version 1.0.0
*/
class BuilderDashboard {
constructor() {
this.charts = {};
this.init();
}
init() {
const dataEl = document.getElementById('lp-cb-dashboard-chart-data');
if (!dataEl) {
return;
}
try {
this.chartData = JSON.parse(dataEl.textContent);
} catch (e) {
console.warn('Dashboard: Failed to parse chart data', e);
return;
}
this.initSalesChart();
this.initStudentsChart();
this.bindFilterEvents();
}
createGradient(ctx, color) {
const gradient = ctx.createLinearGradient(0, 0, 0, ctx.canvas.height);
gradient.addColorStop(0, color + '40');
gradient.addColorStop(1, color + '05');
return gradient;
}
getChartConfig(labels, data, color, prefix = '', isInteger = false) {
return {
type: 'line',
data: {
labels,
datasets: [{
data,
borderColor: color,
borderWidth: 2.5,
backgroundColor: context => {
const {
ctx
} = context.chart;
return this.createGradient(ctx, color);
},
fill: true,
tension: 0.4,
pointBackgroundColor: color,
pointBorderColor: '#fff',
pointBorderWidth: 2,
pointRadius: 0,
pointHoverRadius: 6,
pointHoverBorderWidth: 2
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
display: false
},
tooltip: {
backgroundColor: '#1e1e1e',
titleColor: '#fff',
bodyColor: '#fff',
borderColor: 'rgba(255,255,255,0.1)',
borderWidth: 1,
cornerRadius: 8,
padding: 12,
displayColors: false,
callbacks: {
label: context => {
const val = context.parsed.y || 0;
return prefix + val.toLocaleString();
}
}
}
},
scales: {
x: {
grid: {
display: false
},
ticks: {
color: '#9ca3af',
font: {
size: 11
},
maxRotation: 0
},
border: {
display: false
}
},
y: {
grid: {
color: 'rgba(0,0,0,0.04)',
drawBorder: false
},
ticks: {
stepSize: isInteger ? 1 : undefined,
color: '#9ca3af',
font: {
size: 11
},
callback: value => prefix + value.toLocaleString()
},
border: {
display: false
},
beginAtZero: true
}
},
interaction: {
intersect: false,
mode: 'index'
}
}
};
}
initSalesChart() {
const canvas = document.getElementById('lp-cb-chart-sales');
if (!canvas) {
return;
}
const {
labels = [],
data = []
} = this.chartData.sales || {};
const config = this.getChartConfig(labels, data, '#10b981', '$');
this.charts.sales = new chart_js_auto__WEBPACK_IMPORTED_MODULE_0__["default"](canvas, config);
}
initStudentsChart() {
const canvas = document.getElementById('lp-cb-chart-students');
if (!canvas) {
return;
}
const {
labels = [],
data = []
} = this.chartData.students || {};
const config = this.getChartConfig(labels, data, '#f59e0b', '', true);
this.charts.students = new chart_js_auto__WEBPACK_IMPORTED_MODULE_0__["default"](canvas, config);
}
bindFilterEvents() {
const filters = document.querySelectorAll('.chart-card__filter');
filters.forEach(select => {
select.addEventListener('change', e => {
const chartType = e.target.dataset.chart;
const period = e.target.value;
this.fetchChartData(chartType, period);
});
});
}
async fetchChartData(chartType, period) {
const chart = this.charts[chartType];
if (!chart) {
return;
}
const formData = new FormData();
formData.append('action', 'lp_cb_dashboard_chart_data');
formData.append('chart_type', chartType);
formData.append('period', period);
formData.append('nonce', this.chartData.nonce);
try {
const response = await fetch(this.chartData.ajaxUrl, {
method: 'POST',
body: formData
});
const result = await response.json();
if (result.success && result.data) {
chart.data.labels = result.data.labels || [];
chart.data.datasets[0].data = result.data.data || [];
chart.update('none');
}
} catch (e) {
console.warn('Dashboard: Failed to fetch chart data', e);
}
}
}
/***/ },
/***/ "./assets/src/js/frontend/course-builder/builder-form-state.js"
/*!*********************************************************************!*\
!*** ./assets/src/js/frontend/course-builder/builder-form-state.js ***!
\*********************************************************************/
(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BuilderFormState: () => (/* binding */ BuilderFormState),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
/* harmony export */ getFormState: () => (/* binding */ getFormState)
/* harmony export */ });
/**
* Course Builder - Form State Management
* Track unsaved changes and handle tab navigation
*
* @since 4.3.0
* @version 1.0.0
*/
class BuilderFormState {
constructor() {
this.hasUnsavedChanges = false;
this.formElements = [];
this.originalValues = new Map();
this.init();
}
init() {
this.bindEvents();
this.captureOriginalValues();
}
/**
* Capture original form values for comparison
*/
captureOriginalValues() {
const forms = document.querySelectorAll('.cb-section__course-edit, .lp-cb-tab-content');
forms.forEach(form => {
const inputs = form.querySelectorAll('input, textarea, select');
inputs.forEach(input => {
const key = input.name || input.id;
if (key) {
this.originalValues.set(key, this.getInputValue(input));
}
});
});
}
/**
* Get input value based on type
*/
getInputValue(input) {
if (input.type === 'checkbox') {
return input.checked;
}
if (input.type === 'radio') {
return input.checked ? input.value : null;
}
return input.value;
}
/**
* Bind all events
*/
bindEvents() {
// Track form changes
document.addEventListener('input', this.handleFormChange.bind(this));
document.addEventListener('change', this.handleFormChange.bind(this));
// TinyMCE changes (if available)
this.bindTinyMCEChanges();
// Tab navigation warning
document.addEventListener('click', this.handleTabClick.bind(this));
// Browser navigation warning
window.addEventListener('beforeunload', this.handleBeforeUnload.bind(this));
// Reset state after successful save
document.addEventListener('lp-course-builder-saved', this.resetState.bind(this));
}
/**
* Bind TinyMCE editor changes
*/
bindTinyMCEChanges() {
// Wait for TinyMCE to be ready
if (typeof tinymce !== 'undefined') {
tinymce.on('AddEditor', e => {
e.editor.on('change', () => {
this.markAsChanged();
});
e.editor.on('keyup', () => {
this.markAsChanged();
});
});
}
}
/**
* Handle form input changes
*/
handleFormChange(e) {
const target = e.target;
// Ignore curriculum changes
if (target.closest('#lp-course-edit-curriculum')) {
return;
}
// Ignore question settings form - it auto-saves via AJAX
if (target.closest('.lp-form-setting-question')) {
return;
}
// Ignore lesson settings form - it auto-saves via AJAX
if (target.closest('.lp-form-setting-lesson')) {
return;
}
// Ignore quiz questions list - question changes are tracked separately
if (target.closest('.lp-quiz-questions-list') || target.closest('.lp-edit-quiz-wrap')) {
return;
}
// Check if target is within course builder forms
if (target.closest('.cb-section__course-edit') || target.closest('.lp-cb-tab-content') || target.closest('.lp-form-setting-course') || target.closest('.lp-form-setting-quiz') || target.closest('.cb-section__quiz-edit')) {
this.markAsChanged();
}
}
/**
* Mark form as having unsaved changes
*/
markAsChanged() {
if (!this.hasUnsavedChanges) {
this.hasUnsavedChanges = true;
this.updateSaveButtonState();
}
}
/**
* Update save button visual state
*/
updateSaveButtonState() {
const saveButtons = document.querySelectorAll('.cb-btn-update, .lp-cb-save-btn, .cb-btn-main-action');
saveButtons.forEach(btn => {
if (this.hasUnsavedChanges) {
btn.classList.add('has-changes');
} else {
btn.classList.remove('has-changes');
}
});
}
/**
* Handle tab navigation click
*/
handleTabClick(e) {
const tabLink = e.target.closest('.lp-cb-tabs__item, .lp-cb-sidebar__item a');
if (!tabLink) {
return;
}
if (tabLink.hasAttribute('data-tab-section') || tabLink.getAttribute('href') === '#') {
return;
}
if (tabLink.classList.contains('is-active') || tabLink.closest('.is-active')) {
return;
}
if (this.hasUnsavedChanges) {
const confirmLeave = confirm(wp?.i18n?.__('You have unsaved changes. Are you sure you want to leave this page?', 'learnpress') || 'You have unsaved changes. Are you sure you want to leave this page?');
if (!confirmLeave) {
e.preventDefault();
e.stopPropagation();
return false;
}
}
}
/**
* Handle browser back/forward/close
*/
handleBeforeUnload(e) {
if (this.hasUnsavedChanges) {
e.preventDefault();
e.returnValue = '';
return '';
}
}
/**
* Reset state after successful save
*/
resetState() {
this.hasUnsavedChanges = false;
this.updateSaveButtonState();
this.captureOriginalValues();
}
/**
* Check if form has unsaved changes
*/
hasChanges() {
return this.hasUnsavedChanges;
}
/**
* Manually set changed state
*/
setChanged(changed = true) {
this.hasUnsavedChanges = changed;
this.updateSaveButtonState();
}
}
// Export singleton instance
let formStateInstance = null;
const getFormState = () => {
if (!formStateInstance) {
formStateInstance = new BuilderFormState();
}
return formStateInstance;
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BuilderFormState);
/***/ },
/***/ "./assets/src/js/frontend/course-builder/builder-lesson/builder-edit-lesson.js"
/*!*************************************************************************************!*\
!*** ./assets/src/js/frontend/course-builder/builder-lesson/builder-edit-lesson.js ***!
\*************************************************************************************/
(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BuilderEditLesson: () => (/* binding */ BuilderEditLesson)
/* harmony export */ });
/* harmony import */ var lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lpAssetsJsPath/utils.js */ "./assets/src/js/utils.js");
/* harmony import */ var lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lpAssetsJsPath/lpToastify.js */ "./assets/src/js/lpToastify.js");
class BuilderEditLesson {
constructor() {
// Events use document-level event delegation, so always register them
// The page context check happens in individual handlers via target.closest()
this.init();
}
static selectors = {
// Context selector - indicates we're on lesson edit page
elDataLesson: '.cb-section__lesson-edit',
// Shared header action buttons (generic selectors)
elBtnMainAction: '.cb-btn-main-action',
elBtnUpdate: '.cb-btn-update, .cb-btn-publish',
elBtnDraft: '.cb-btn-darft, .cb-dropdown-item[data-status="draft"]',
elBtnTrash: '.cb-btn-trash',
// Status badge
elLessonStatus: '.lesson-status',
// Form fields
idTitle: 'title',
idDescEditor: 'lesson_description_editor',
elFormSetting: '.lp-form-setting-lesson',
// Permalink component
elPermalinkDisplay: '.cb-permalink-display',
elPermalinkEditor: '.cb-permalink-editor',
elPermalinkEditBtn: '.cb-permalink-edit-btn',
elPermalinkOkBtn: '.cb-permalink-ok-btn',
elPermalinkCancelBtn: '.cb-permalink-cancel-btn',
elPermalinkSlugInput: '.cb-permalink-slug-input',
elPermalinkUrl: '.cb-permalink-url',
elPermalinkBaseUrl: '#cb-permalink-base-url',
elPermalinkRoot: '.cb-item-edit-permalink, .cb-course-edit-permalink',
elPermalinkPlaceholder: '.cb-item-edit-permalink__placeholder',
// Tab handling selectors
elCBHorizontalTabs: '.lp-cb-tabs__item',
elCBTabPanels: '.lp-cb-tab-panel',
// Dropdown selectors
elDropdownToggle: '.cb-btn-dropdown-toggle',
elDropdownMenu: '.cb-dropdown-menu',
elHeaderActionsDropdown: '.cb-header-actions-dropdown'
};
init() {
this.initTabs();
this.initHeaderActionsDropdown();
this.events();
}
/**
* Initialize header actions dropdown (toggle behavior)
*/
initHeaderActionsDropdown() {
// Close dropdown when clicking outside
document.addEventListener('click', e => {
const dropdown = document.querySelector(BuilderEditLesson.selectors.elHeaderActionsDropdown);
if (dropdown && !dropdown.contains(e.target)) {
const menu = dropdown.querySelector(BuilderEditLesson.selectors.elDropdownMenu);
const toggle = dropdown.querySelector(BuilderEditLesson.selectors.elDropdownToggle);
if (menu) {
menu.classList.remove('is-open');
}
if (toggle) {
toggle.setAttribute('aria-expanded', 'false');
}
}
});
}
/**
* Handle dropdown toggle click
*/
handleDropdownToggle(args) {
const {
target
} = args;
const toggleBtn = target.closest(BuilderEditLesson.selectors.elDropdownToggle);
if (!toggleBtn) {
return;
}
const dropdown = toggleBtn.closest(BuilderEditLesson.selectors.elHeaderActionsDropdown);
if (!dropdown) {
return;
}
const menu = dropdown.querySelector(BuilderEditLesson.selectors.elDropdownMenu);
if (menu) {
menu.classList.toggle('is-open');
const isOpen = menu.classList.contains('is-open');
toggleBtn.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
}
}
/**
* Initialize horizontal tabs for client-side tab switching
*/
initTabs() {
const tabs = document.querySelectorAll(BuilderEditLesson.selectors.elCBHorizontalTabs);
if (tabs.length === 0) {
return;
}
// Activate first tab by default if none is active
const activeTab = document.querySelector(`${BuilderEditLesson.selectors.elCBHorizontalTabs}.is-active`);
if (!activeTab && tabs.length > 0) {
tabs[0].classList.add('is-active');
const section = tabs[0].getAttribute('data-tab-section');
if (section) {
const panel = document.querySelector(`${BuilderEditLesson.selectors.elCBTabPanels}[data-section="${section}"]`);
if (panel) {
panel.classList.remove('lp-hidden');
}
}
}
}
/**
* Handle horizontal tab click for client-side tab switching
*/
handleTabClick(args) {
const {
e,
target
} = args;
const tabLink = target.closest(BuilderEditLesson.selectors.elCBHorizontalTabs);
if (!tabLink) {
return;
}
e.preventDefault();
const section = tabLink.getAttribute('data-tab-section');
if (!section) {
return;
}
// Update active tab
const allTabs = document.querySelectorAll(BuilderEditLesson.selectors.elCBHorizontalTabs);
allTabs.forEach(tab => tab.classList.remove('is-active'));
tabLink.classList.add('is-active');
// Show/hide panels
const allPanels = document.querySelectorAll(BuilderEditLesson.selectors.elCBTabPanels);
allPanels.forEach(panel => {
if (panel.getAttribute('data-section') === section) {
panel.classList.remove('lp-hidden');
} else {
panel.classList.add('lp-hidden');
}
});
}
events() {
if (BuilderEditLesson._loadedEvents) {
return;
}
BuilderEditLesson._loadedEvents = true;
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.eventHandlers('click', [{
selector: BuilderEditLesson.selectors.elBtnMainAction,
class: this,
callBack: this.updateLesson.name
}, {
selector: BuilderEditLesson.selectors.elBtnDraft,
class: this,
callBack: this.saveDraftLesson.name
}, {
selector: BuilderEditLesson.selectors.elBtnTrash,
class: this,
callBack: this.trashLesson.name
}, {
selector: BuilderEditLesson.selectors.elCBHorizontalTabs,
class: this,
callBack: this.handleTabClick.name
}, {
selector: BuilderEditLesson.selectors.elDropdownToggle,
class: this,
callBack: this.handleDropdownToggle.name
}, {
selector: BuilderEditLesson.selectors.elPermalinkEditBtn,
class: this,
callBack: this.handlePermalinkEdit.name
}, {
selector: BuilderEditLesson.selectors.elPermalinkOkBtn,
class: this,
callBack: this.handlePermalinkOk.name
}, {
selector: BuilderEditLesson.selectors.elPermalinkCancelBtn,
class: this,
callBack: this.handlePermalinkCancel.name
}]);
}
/**
* Validate title is not empty before update
* @return {boolean} True if valid, false if invalid
*/
validateTitleBeforeUpdate() {
const titleInput = document.getElementById(BuilderEditLesson.selectors.idTitle);
if (!titleInput) {
return true;
}
const title = titleInput.value.trim();
if (!title) {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__.show('Lesson title is required.', 'error');
titleInput.focus();
return false;
}
return true;
}
/**
* Update action button text after status change
* @param {string} newStatus - The new lesson status
*/
updateActionButtons(newStatus) {
const elBtnUpdate = document.querySelector(BuilderEditLesson.selectors.elBtnMainAction);
if (!elBtnUpdate) {
return;
}
const titleUpdate = elBtnUpdate.getAttribute('data-title-update') || 'Update';
const titlePublish = elBtnUpdate.getAttribute('data-title-publish') || 'Publish';
if (newStatus === 'publish') {
elBtnUpdate.textContent = titleUpdate;
} else {
elBtnUpdate.textContent = titlePublish;
}
}
/**
* Check if we're in lesson edit context
* @return {boolean}
*/
isLessonContext() {
return !!document.querySelector(BuilderEditLesson.selectors.elDataLesson);
}
slugify(str) {
return (str || '').toString().normalize('NFD').replace(/[\u0300-\u036f]/g, '').replace(/đ/g, 'd').replace(/Đ/g, 'D').toLowerCase().replace(/\s+/g, '-').replace(/[^\w-]+/g, '').replace(/--+/g, '-').replace(/^-+/, '').replace(/-+$/, '');
}
buildPermalinkDisplayUrl(baseUrl = '', slug = '', fallbackUrl = '') {
const normalizedBaseUrl = typeof baseUrl === 'string' ? baseUrl : '';
const normalizedSlug = typeof slug === 'string' ? slug.trim() : '';
if (normalizedBaseUrl && normalizedSlug) {
return `${normalizedBaseUrl}${normalizedSlug}`;
}
return typeof fallbackUrl === 'string' ? fallbackUrl : '';
}
getPermalinkRoot(target = null) {
if (target?.closest) {
const fromTarget = target.closest(BuilderEditLesson.selectors.elPermalinkRoot);
if (fromTarget) {
return fromTarget;
}
}
return document.querySelector(`.cb-section__lesson-edit ${BuilderEditLesson.selectors.elPermalinkRoot}`);
}
isDescriptionEditorInCodeMode() {
const editorId = BuilderEditLesson.selectors.idDescEditor;
const wrapper = document.getElementById(`wp-${editorId}-wrap`) || document.getElementById(`${editorId}-wrap`);
if (wrapper?.classList.contains('html-active')) {
return true;
}
const editor = typeof tinymce !== 'undefined' ? tinymce.get(editorId) : null;
return !!(editor?.isHidden && editor.isHidden());
}
getDescriptionContentForUpdate() {
const editorId = BuilderEditLesson.selectors.idDescEditor;
const descEditor = document.getElementById(editorId);
if (this.isDescriptionEditorInCodeMode()) {
return descEditor ? descEditor.value : '';
}
if (typeof tinymce !== 'undefined') {
const editor = tinymce.get(editorId);
if (editor) {
return editor.getContent();
}
}
return descEditor ? descEditor.value : '';
}
showPermalinkUnavailable(permalinkRoot, message = '') {
if (!permalinkRoot) {
return;
}
const label = permalinkRoot.querySelector('.cb-item-edit-permalink__label') || permalinkRoot.querySelector('.cb-permalink-label');
const display = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkDisplay);
const editor = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkEditor);
let placeholder = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkPlaceholder);
if (!placeholder) {
placeholder = document.createElement('span');
placeholder.className = 'cb-item-edit-permalink__placeholder';
if (label) {
label.insertAdjacentElement('afterend', placeholder);
} else {
permalinkRoot.prepend(placeholder);
}
}
placeholder.textContent = message || 'Permalink is only available if the item is already assigned to a course.';
placeholder.classList.remove('lp-hidden');
if (display) {
display.classList.add('lp-hidden');
}
if (editor) {
editor.classList.add('lp-hidden');
}
}
getLessonDataForUpdate() {
const data = {};
const wrapperEl = document.querySelector(BuilderEditLesson.selectors.elDataLesson);
data.lesson_id = wrapperEl ? parseInt(wrapperEl.dataset.lessonId) || 0 : 0;
const titleInput = document.getElementById(BuilderEditLesson.selectors.idTitle);
data.lesson_title = titleInput ? titleInput.value : '';
data.lesson_description = this.getDescriptionContentForUpdate();
const permalinkInput = document.querySelector(`input[name="lesson_permalink"], #lesson_permalink, ${BuilderEditLesson.selectors.elPermalinkSlugInput}`);
if (permalinkInput && permalinkInput.value) {
data.lesson_permalink = permalinkInput.value;
}
const elFormSetting = document.querySelector(BuilderEditLesson.selectors.elFormSetting);
if (elFormSetting) {
data.lesson_settings = true;
const formElements = elFormSetting.querySelectorAll('input, select, textarea');
formElements.forEach(element => {
const name = element.name || element.id;
if (!name || name === 'learnpress_meta_box_nonce' || name === '_wp_http_referer') {
return;
}
if (element.type === 'checkbox') {
const fieldName = name.replace('[]', '');
if (!data.hasOwnProperty(fieldName)) {
data[fieldName] = element.checked ? 'yes' : 'no';
}
} else if (element.type === 'radio') {
if (element.checked) {
const fieldName = name.replace('[]', '');
data[fieldName] = element.value;
}
} else if (element.type === 'file') {
const fieldName = name.replace('[]', '');
if (element.files && element.files.length > 0) {
data[fieldName] = element.files;
}
} else {
const fieldName = name.replace('[]', '');
if (name.endsWith('[]')) {
if (!data.hasOwnProperty(fieldName)) {
data[fieldName] = [];
}
if (Array.isArray(data[fieldName])) {
data[fieldName].push(element.value);
}
} else {
if (!data.hasOwnProperty(fieldName)) {
data[fieldName] = element.value;
}
}
}
});
Object.keys(data).forEach(key => {
if (Array.isArray(data[key])) {
data[key] = data[key].join(',');
}
});
}
return data;
}
updatePermalinkUIAfterSave(data = {}) {
const permalinkRoot = this.getPermalinkRoot();
if (!permalinkRoot) {
return;
}
const slugInput = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkSlugInput);
const urlLink = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkUrl);
const baseUrlInput = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkBaseUrl);
const display = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkDisplay);
const placeholder = permalinkRoot.querySelector(BuilderEditLesson.selectors.elPermalinkPlaceholder);
const permalinkDisplayUrl = this.buildPermalinkDisplayUrl(baseUrlInput ? baseUrlInput.value : '', data?.lesson_slug, data?.lesson_permalink);
if (slugInput && data?.lesson_slug) {
slugInput.value = data.lesson_slug;
slugInput.dataset.originalValue = data.lesson_slug;
}
const shouldShowUnavailable = data?.permalink_available === false || data?.status === 'draft' || data?.status === 'trash' || !data?.lesson_permalink;
if (shouldShowUnavailable) {
this.showPermalinkUnavailable(permalinkRoot, data?.permalink_notice);
return;
}
if (placeholder) {
placeholder.classList.add('lp-hidden');
}
if (display) {
display.classList.remove('lp-hidden');
}
if (urlLink && data?.lesson_permalink) {
urlLink.href = data.lesson_permalink;
urlLink.textContent = permalinkDisplayUrl || data.lesson_permalink;
} else if (urlLink && permalinkDisplayUrl) {
urlLink.textContent = permalinkDisplayUrl;
}
}
handlePermalinkEdit(args) {
if (!this.isLessonContext()) {
return;
}
const {
e,
target
} = args;
if (e) e.preventDefault();
const trigger = target?.closest(BuilderEditLesson.selectors.elPermalinkEditBtn);
const lessonRoot = trigger?.closest(BuilderEditLesson.selectors.elDataLesson) || document.querySelector(BuilderEditLesson.selectors.elDataLesson);
if (!lessonRoot) {
return;
}
const display = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkDisplay);
const editor = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkEditor);
const input = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkSlugInput);
if (!display || !editor || !input) {
return;
}
input.dataset.originalValue = input.value;
display.classList.add('lp-hidden');
editor.classList.remove('lp-hidden');
input.focus();
input.select();
}
handlePermalinkOk(args) {
if (!this.isLessonContext()) {
return;
}
const {
e,
target
} = args;
if (e) e.preventDefault();
const trigger = target?.closest(BuilderEditLesson.selectors.elPermalinkOkBtn);
const lessonRoot = trigger?.closest(BuilderEditLesson.selectors.elDataLesson) || document.querySelector(BuilderEditLesson.selectors.elDataLesson);
if (!lessonRoot) {
return;
}
const display = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkDisplay);
const editor = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkEditor);
const input = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkSlugInput);
const urlLink = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkUrl);
const baseUrlInput = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkBaseUrl);
if (!display || !editor || !input || !urlLink) {
return;
}
let newSlug = this.slugify(input.value.trim());
if (!newSlug) {
newSlug = input.dataset.originalValue || 'lesson';
}
input.value = newSlug;
const baseUrl = baseUrlInput ? baseUrlInput.value : '';
const newUrl = this.buildPermalinkDisplayUrl(baseUrl, newSlug, urlLink.textContent || '');
// Keep href as the current saved link and only update display text.
urlLink.textContent = newUrl;
editor.classList.add('lp-hidden');
display.classList.remove('lp-hidden');
}
handlePermalinkCancel(args) {
if (!this.isLessonContext()) {
return;
}
const {
e,
target
} = args;
if (e) e.preventDefault();
const trigger = target?.closest(BuilderEditLesson.selectors.elPermalinkCancelBtn);
const lessonRoot = trigger?.closest(BuilderEditLesson.selectors.elDataLesson) || document.querySelector(BuilderEditLesson.selectors.elDataLesson);
if (!lessonRoot) {
return;
}
const display = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkDisplay);
const editor = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkEditor);
const input = lessonRoot.querySelector(BuilderEditLesson.selectors.elPermalinkSlugInput);
if (!display || !editor || !input) {
return;
}
input.value = input.dataset.originalValue || '';
editor.classList.add('lp-hidden');
display.classList.remove('lp-hidden');
}
updateLesson(args) {
// Context check: only handle if on lesson edit page
if (!this.isLessonContext()) {
return;
}
const {
target
} = args;
const elBtnUpdateLesson = target.closest(BuilderEditLesson.selectors.elBtnMainAction);
if (!elBtnUpdateLesson) {
return;
}
// Validate title before update
if (!this.validateTitleBeforeUpdate()) {
return;
}
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elBtnUpdateLesson, 1);
const lessonData = this.getLessonDataForUpdate();
const targetStatus = elBtnUpdateLesson.dataset.status || 'publish';
const dataSend = {
...lessonData,
action: 'builder_update_lesson',
args: {
id_url: 'builder-update-lesson'
},
lesson_status: targetStatus
};
if (typeof lpLessonBuilder !== 'undefined' && lpLessonBuilder.nonce) {
dataSend.nonce = lpLessonBuilder.nonce;
}
const callBack = {
success: response => {
const {
status,
message,
data
} = response;
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__.show(message, status);
if (status === 'success') {
// Update action button text
this.updateActionButtons(targetStatus);
if (data?.lesson_id_new) {
const currentUrl = window.location.href;
window.location.href = currentUrl.replace(/post-new\/?/, `${data.lesson_id_new}/`);
}
if (data?.status) {
const elStatus = document.querySelector(BuilderEditLesson.selectors.elLessonStatus);
if (elStatus) {
elStatus.className = 'lesson-status ' + data.status;
elStatus.textContent = data.status;
}
if (data.status === 'trash' || data.status === 'draft') {
const curriculumItem = document.querySelector(`.lesson-item[data-lesson-id="${lessonData.lesson_id}"]`);
if (curriculumItem) {
const elCurriculumLesson = curriculumItem.closest('.lesson');
if (elCurriculumLesson) {
elCurriculumLesson.remove();
}
}
}
}
this.updatePermalinkUIAfterSave(data);
// Reset form state to prevent "leave site" warning
document.dispatchEvent(new CustomEvent('lp-course-builder-saved'));
}
},
error: error => {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__.show(error.message || error, 'error');
},
completed: () => {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elBtnUpdateLesson, 0);
}
};
window.lpAJAXG.fetchAJAX(dataSend, callBack);
}
saveDraftLesson(args) {
// Context check: only handle if on lesson edit page
if (!this.isLessonContext()) {
return;
}
const {
target
} = args;
const elBtnDraftLesson = target.closest(BuilderEditLesson.selectors.elBtnDraft);
if (!elBtnDraftLesson) {
return;
}
// Check if published to show confirm unpublish modal
const statusEl = document.querySelector(BuilderEditLesson.selectors.elLessonStatus);
const isPublished = statusEl && statusEl.classList.contains('publish');
if (isPublished) {
const confirmMsg = elBtnDraftLesson.dataset.confirmUnpublish || 'Saving as draft will unpublish this item. Are you sure?';
if (!confirm(confirmMsg)) {
return;
}
}
// Validate title before saving draft
if (!this.validateTitleBeforeUpdate()) {
return;
}
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elBtnDraftLesson, 1);
const lessonData = this.getLessonDataForUpdate();
const dataSend = {
...lessonData,
action: 'builder_update_lesson',
args: {
id_url: 'builder-update-lesson'
},
lesson_status: 'draft'
};
if (typeof lpLessonBuilder !== 'undefined' && lpLessonBuilder.nonce) {
dataSend.nonce = lpLessonBuilder.nonce;
}
const callBack = {
success: response => {
const {
status,
message,
data
} = response;
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__.show(message, status);
if (status === 'success') {
// Update action button text
this.updateActionButtons('draft');
if (data?.lesson_id_new) {
const currentUrl = window.location.href;
window.location.href = currentUrl.replace(/post-new\/?/, `${data.lesson_id_new}/`);
}
if (data?.status) {
const elStatus = document.querySelector(BuilderEditLesson.selectors.elLessonStatus);
if (elStatus) {
elStatus.className = 'lesson-status ' + data.status;
elStatus.textContent = data.status;
}
if (data.status === 'trash' || data.status === 'draft') {
const curriculumItem = document.querySelector(`.lesson-item[data-lesson-id="${lessonData.lesson_id}"]`);
if (curriculumItem) {
const elCurriculumLesson = curriculumItem.closest('.lesson');
if (elCurriculumLesson) {
elCurriculumLesson.remove();
}
}
}
}
this.updatePermalinkUIAfterSave(data);
// Reset form state to prevent "leave site" warning
document.dispatchEvent(new CustomEvent('lp-course-builder-saved'));
}
},
error: error => {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__.show(error.message || error, 'error');
},
completed: () => {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elBtnDraftLesson, 0);
}
};
window.lpAJAXG.fetchAJAX(dataSend, callBack);
}
trashLesson(args) {
// Context check: only handle if on lesson edit page
if (!this.isLessonContext()) {
return;
}
const {
target
} = args;
const elBtnTrashLesson = target.closest(BuilderEditLesson.selectors.elBtnTrash);
if (!elBtnTrashLesson) {
return;
}
if (!confirm('Are you sure you want to trash this lesson?')) {
return;
}
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elBtnTrashLesson, 1);
const lessonData = this.getLessonDataForUpdate();
const dataSend = {
action: 'move_trash_lesson',
args: {
id_url: 'move-trash-lesson'
},
lesson_id: lessonData.lesson_id
};
const callBack = {
success: response => {
const {
status,
message,
data
} = response;
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__.show(message, status);
if (status === 'success') {
if (data?.redirect_url) {
window.location.href = data.redirect_url;
}
if (data?.status) {
const elStatus = document.querySelector(BuilderEditLesson.selectors.elLessonStatus);
if (elStatus) {
elStatus.className = 'lesson-status ' + data.status;
elStatus.textContent = data.status;
}
if (data.status === 'trash' || data.status === 'draft') {
const curriculumItem = document.querySelector(`.lesson-item[data-lesson-id="${lessonData.lesson_id}"]`);
if (curriculumItem) {
const elCurriculumLesson = curriculumItem.closest('.lesson');
if (elCurriculumLesson) {
elCurriculumLesson.remove();
}
}
}
}
this.updatePermalinkUIAfterSave(data);
}
},
error: error => {
lpAssetsJsPath_lpToastify_js__WEBPACK_IMPORTED_MODULE_1__.show(error.message || error, 'error');
},
completed: () => {
lpAssetsJsPath_utils_js__WEBPACK_IMPORTED_MODULE_0__.lpSetLoadingEl(elBtnTrashLesson, 0);
}
};
window.lpAJAXG.fetchAJAX(dataSend, callBack);
}
}
/***/ },
/***/ "./assets/src/js/frontend/course-builder/builder-lesson/builder-material.js"
/*!**********************************************************************************!*\
!*** ./assets/src/js/frontend/course-builder/builder-lesson/builder-material.js ***!
\**********************************************************************************/
(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BuilderMaterial: () => (/* binding */ BuilderMaterial),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/**
* Builder Material Handler
* Handles material upload and management for lesson popup in course builder.
* Pure JavaScript implementation with optimizations
*
* @since 4.3.0
* @version 1.0.0
*/
class BuilderMaterial {
constructor(container = null) {
this.container = container;
this.initialized = false;
this.eventsBound = false;
this.sortable = null;
// Store references for cleanup
this.boundHandlers = {
handleAddMaterial: null,
handleChange: null,
handleClick: null,
handleSaveAll: null,
handleDelete: null,
handleDragStart: null,
handleDragOver: null,
handleDrop: null,
handleDragEnd: null
};
// Cache DOM elements
this.elements = {};
if (this.container) {
this.init();
}
}
/**
* Reinitialize with new container (called from BuilderPopup)
*/
reinit(container) {
if (this.initialized) {
this.destroy();
}
this.container = container;
if (this.container) {
this.init();
}
}
/**
* Cache all DOM elements for better performance
*/
cacheElements() {
const el = this.elements;
el.postId = this.container.querySelector('#current-material-post-id');
el.maxFileSize = this.container.querySelector('#material-max-file-size');
el.uploadField = this.container.querySelector('.lp-material--field-upload');
el.canUpload = this.container.querySelector('#available-to-upload');
el.addBtn = this.container.querySelector('#btn-lp--add-material');
el.groupTemplate = this.container.querySelector('#lp-material--add-material-template');
el.groupContainer = this.container.querySelector('#lp-material--group-container');
el.materialTab = this.container.querySelector('#lp-material-container') || this.container;
el.saveBtn = this.container.querySelector('#btn-lp--save-material');
el.uploadTemplate = this.container.querySelector('#lp-material--upload-field-template');
el.externalTemplate = this.container.querySelector('#lp-material--external-field-template');
el.deleteText = this.container.querySelector('#delete-material-row-text');
el.deleteMessage = this.container.querySelector('#delete-material-message');
el.materialTable = this.container.querySelector('.lp-material--table');
el.tbody = el.materialTable?.querySelector('tbody');
el.thead = el.materialTable?.querySelector('thead');
}
init() {
if (!this.container) return;
// Cache all elements
this.cacheElements();
const {
postId,
materialTab
} = this.elements;
// Validate required elements
if (!postId || !materialTab) return;
// Store config values
this.postID = postId.value;
this.maxFileSize = this.elements.maxFileSize?.value || 10;
this.acceptFile = this.elements.uploadField ? this.elements.uploadField.getAttribute('accept')?.split(',').map(s => s.trim()) || [] : [];
// Load existing materials
this.loadMaterials();
// Bind events
this.bindEvents();
// Initialize native drag & drop sortable
this.initSortable();
this.initialized = true;
}
/**
* Load materials from API with better error handling
*/
async loadMaterials() {
const {
materialTab,
tbody
} = this.elements;
if (!materialTab || !this.postID || !tbody) return;
try {
const restUrl = this.getRestUrl();
const url = `${restUrl}lp/v1/material/item-materials/${this.postID}`;
const response = await fetch(url, {
method: 'GET',
headers: {
'X-WP-Nonce': this.getNonce(),
'Content-Type': 'application/json'
}
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const result = await response.json();
const {
data,
status
} = result;
if (status !== 'success') {
console.error(result.message);
return;
}
if (data?.items?.length > 0) {
// Remove skeleton loader
const skeleton = materialTab.querySelector('.lp-skeleton-animation');
skeleton?.remove();
// Use DocumentFragment for better performance
const fragment = document.createDocumentFragment();
data.items.forEach(item => {
const row = this.createRow(item);
fragment.appendChild(row);
});
tbody.appendChild(fragment);
// Reinit sortable after loading data
this.initSortable();
}
} catch (error) {
console.error('Load materials error:', error.message);
}
}
/**
* Create a table row element (more efficient than insertAdjacentHTML)
*/
createRow(data) {
const tr = document.createElement('tr');
tr.dataset.id = data.file_id;
tr.dataset.sort = data.orders;
tr.draggable = true;
const deleteBtnText = this.elements.deleteText?.value || 'Delete';
tr.innerHTML = `