=Debugging and implementing the Checkout.js logic. Will be uploading to tes...

Jake Vanderwerf

2026-06-22 715e26a9eb219808d5c899d418e1d596f9318f61

 assets/js/concise/CopyHours.js

@@ -26,13 +26,6 @@

   createModal() {
      this.modalElement = document.querySelector('dialog#copy-hours');
      // Create modal element if it doesn't exist
      if (!this.modalElement) {
         const modal = window.getTemplate('copyHours');
         document.body.appendChild(modal);
         this.modalElement = document.querySelector('dialog#copy-hours');
      }
      console.log(this.modalElement);
   }

   setupModal() {
@@ -49,14 +42,11 @@
            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);
@@ -98,12 +88,12 @@

   addCopyButtons() {
      // Add copy buttons to each day group
      const dayGroups = document.querySelectorAll('.group-fields.hours .group-fields:not(.hours)');
      const dayGroups = document.querySelectorAll('[data-field="openingHours"] .group.field');

      dayGroups.forEach(group => {
         if (!group.querySelector('.hours-copy-btn')) {
            const copyBtn = this.createCopyButton();
            group.insertBefore(copyBtn, group.querySelector('.field.time'));
            group.append(copyBtn);
         }
      });
   }
@@ -125,15 +115,13 @@
   }

   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,
@@ -145,7 +133,7 @@
   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);
@@ -171,12 +159,12 @@
   }

   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,
@@ -192,10 +180,14 @@
      // 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}));
      }

   }
@@ -203,12 +195,6 @@
   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!' :