| | |
| | | case 'modal-open': |
| | | let e = data.event; |
| | | let modal = data.modal; |
| | | const dayGroup = e.target.closest('.group-fields:not(.hours)'); |
| | | console.log(dayGroup); |
| | | const dayGroup = e.target.closest('.group:not([data-field="openingHours"])'); |
| | | const dayName = this.getDayNameFromGroup(dayGroup); |
| | | console.log(dayName); |
| | | if (!dayName) return; |
| | | |
| | | this.currentSourceDay = dayName; |
| | | console.log(dayName); |
| | | |
| | | // Get source day hours |
| | | const sourceData = this.getSourceDayData(dayGroup); |
| | |
| | | } |
| | | |
| | | getDayNameFromGroup(group) { |
| | | const classList = Array.from(group.classList); |
| | | return this.days.find(day => classList.includes(day)); |
| | | return group.dataset.field.replace('openingHours|',''); |
| | | } |
| | | |
| | | getSourceDayData(dayGroup) { |
| | | console.log(dayGroup); |
| | | const openCheckbox = dayGroup.querySelector('input[type="checkbox"][name$=":open"]'); |
| | | const opensInput = dayGroup.querySelector('input[name$=":time_opens"]'); |
| | | const closesInput = dayGroup.querySelector('input[name$=":time_closes"]'); |
| | | const openCheckbox = dayGroup.querySelector(`input[type="checkbox"][name="openingHours|${this.currentSourceDay}|isOpen"]`); |
| | | const opensInput = dayGroup.querySelector(`input[name="openingHours|${this.currentSourceDay}|opens"]`); |
| | | const closesInput = dayGroup.querySelector(`input[name="openingHours|${this.currentSourceDay}|closes"]`); |
| | | |
| | | return { |
| | | isOpen: openCheckbox ? openCheckbox.checked : false, |
| | |
| | | applyCopyHours() { |
| | | if (!this.currentSourceDay) return; |
| | | |
| | | const sourceGroup = document.querySelector(`.group-fields.${this.currentSourceDay}`); |
| | | const sourceGroup = document.querySelector(`.group[data-field="openingHours|${this.currentSourceDay}"]`); |
| | | if (!sourceGroup) return; |
| | | |
| | | const sourceData = this.getSourceDayData(sourceGroup); |
| | |
| | | } |
| | | |
| | | applyHoursToDay(dayName, sourceData) { |
| | | const targetGroup = document.querySelector(`.group-fields.${dayName}`); |
| | | const targetGroup = document.querySelector(`.group[data-field="openingHours|${dayName}`); |
| | | if (!targetGroup) return; |
| | | |
| | | const openCheckbox = targetGroup.querySelector('input[type="checkbox"][name$=":open"]'); |
| | | const opensInput = targetGroup.querySelector('input[name$=":time_opens"]'); |
| | | const closesInput = targetGroup.querySelector('input[name$=":time_closes"]'); |
| | | const openCheckbox = targetGroup.querySelector(`input[type="checkbox"][name="openingHours|${dayName}|isOpen"]`); |
| | | const opensInput = targetGroup.querySelector(`input[name="openingHours|${dayName}|opens"]`); |
| | | const closesInput = targetGroup.querySelector(`input[name="openingHours|${dayName}|closes"]`); |
| | | console.log('applying hours to days: ', { |
| | | openCheckbox, |
| | | opensInput, |
| | |
| | | // Set time values if open |
| | | if (sourceData.isOpen && opensInput && closesInput) { |
| | | opensInput.value = sourceData.opens; |
| | | opensInput.dispatchEvent(new Event('change', {bubbles: true})); |
| | | closesInput.value = sourceData.closes; |
| | | closesInput.dispatchEvent(new Event('change', {bubbles: true})); |
| | | } else if (opensInput && closesInput) { |
| | | opensInput.value = ''; |
| | | opensInput.dispatchEvent(new Event('change', {bubbles: true})); |
| | | closesInput.value = ''; |
| | | closesInput.dispatchEvent(new Event('change', {bubbles: true})); |
| | | } |
| | | |
| | | } |
| | |
| | | showSuccessFeedback(count) { |
| | | // Create or update feedback element |
| | | let feedback = document.getElementById('copy-success-feedback'); |
| | | if (!feedback) { |
| | | feedback = document.createElement('div'); |
| | | feedback.id = 'copy-success-feedback'; |
| | | feedback.className = 'copy-success-feedback'; |
| | | document.body.appendChild(feedback); |
| | | } |
| | | |
| | | const message = count === 1 ? |
| | | 'Hours copied to 1 day successfully!' : |