document.addEventListener("DOMContentLoaded", function() {
    const header = document.getElementById("header");
    const logo = document.createElement("img");
    const url = window.location.href;

    if (url.includes("perryhomes")) {
        logo.src = "https://res.cloudinary.com/perryhomes-marketing/image/upload/v1742889900/Perry%20Homes%20Approved%20Templates/Email/EmailMarketing_PH_Line_Header_031620_g57iix.jpg";
        logo.alt = "Perry Homes Logo";
    } else {
        logo.src = "https://res.cloudinary.com/perryhomes-marketing/image/upload/v1742889900/Perry%20Homes%20Approved%20Templates/Email/EmailMarketing_PH_Line_Header_031620_g57iix.jpg";
        logo.alt = "Britton Homes Logo";
    }
header.insertBefore(logo, header.firstChild);

    const savedData = localStorage.getItem("customerPreferences");
      if (savedData) {
        const customerPreferences = JSON.parse(savedData);

        if (customerPreferences.MarketingEmails) {
          const elem = document.getElementById('MarketingEmails');
          if (elem) elem.checked = customerPreferences.MarketingEmails === "yes";
        }
        if (customerPreferences.SMSUpdates) {
          const elem = document.getElementById('SMSUpdates');
          if (elem) elem.checked = customerPreferences.SMSUpdates === "yes";
        }
        if (customerPreferences.Promotions) {
          const elem = document.getElementById('Promotions');
          if (elem) elem.checked = customerPreferences.Promotions === "yes";
        }
        if (customerPreferences.Newsletters) {
          const elem = document.getElementById('Newsletters');
          if (elem) elem.checked = customerPreferences.Newsletters === "yes";
        }
        if (customerPreferences.EventsWebinars) {
          const elem = document.getElementById('EventsWebinars');
          if (elem) elem.checked = customerPreferences.EventsWebinars === "yes";
        }
      }


    // Listen for the response and set the hidden field value
    window.addEventListener('message', function(event) {
        console.log('Message received:', event.data);
        if (event.data && event.data.type === 'myAccountIdResponse') {
            const myAccountId = event.data.myAccountId;
            const hiddenField = document.getElementById('myAccountIdField');
            if (hiddenField) {
                hiddenField.value = myAccountId;
                console.log('Value set:', myAccountId);

            } else {
                console.warn('Field not found!');
            }
        }

    });
    // Add your console log here
    console.log('Responsehas been send');
    // Request MyAccount ID from parent window
    window.parent.postMessage({
        type: 'getMyAccountId'
    }, '*');

   (function () {
      const form = document.getElementById('preferences-form');
      const unsubscribeAll = document.getElementById('selectAllPrefs');
      const unsubscribeReasonSection = document.getElementById("unsubscribeReasonSection");

      if (!form || !unsubscribeAll) return;

      const prefIds = [
        'MarketingEmails',
        'SMSUpdates',
        'Promotions',
        'Newsletters',
        'EventsWebinars'
      ];

      const prefInputs = prefIds
        .map(id => document.getElementById(id))
        .filter(Boolean);

      const originalDisplay = unsubscribeReasonSection
        ? unsubscribeReasonSection.style.display || "block"
        : "block";

      // Store previous state before unsubscribe
      let previousPrefState = null;

      /* ---------------------------------
         Sync Unsubscribe checkbox
         --------------------------------- */
      function updateUnsubscribeState() {
        const checkedCount = prefInputs.filter(i => i.checked).length;

        if (checkedCount === 0) {
          unsubscribeAll.checked = true;
          unsubscribeReasonSection.style.display = originalDisplay;
        } else {
          unsubscribeAll.checked = false;
          unsubscribeReasonSection.style.display = "none";
        }

        unsubscribeAll.indeterminate = false;
      }

      /* ---------------------------------
         When Unsubscribe is toggled
         --------------------------------- */
      unsubscribeAll.addEventListener('change', function () {

        // USER CHECKS "UNSUBSCRIBE ALL"
        if (unsubscribeAll.checked) {

          // Save current state
          previousPrefState = prefInputs.map(input => ({
            id: input.id,
            checked: input.checked
          }));

          // Turn OFF all preferences
          prefInputs.forEach(input => {
            if (!input.disabled) {
              input.checked = false;
            }
          });

          unsubscribeReasonSection.style.display = originalDisplay;

        } 
        // USER UNCHECKS "UNSUBSCRIBE ALL"
        else {

          // Restore previous state if available
          if (previousPrefState) {
            previousPrefState.forEach(state => {
              const input = document.getElementById(state.id);
              if (input && !input.disabled) {
                input.checked = state.checked;
              }
            });
          }

          unsubscribeReasonSection.style.display = "none";
        }

        updateUnsubscribeState();
      });

      /* ---------------------------------
         When any preference changes
         --------------------------------- */
      prefInputs.forEach(input => {
        input.addEventListener('change', updateUnsubscribeState);
      });

      // Init on load
      updateUnsubscribeState();
    })();




    
    const radios = document.querySelectorAll('input[name="unsubscribeReason"]');
    const otherText = document.getElementById("otherReasonText");

    radios.forEach(radio => {
      radio.addEventListener("change", function () {
        if (this.value === "Other") {
          otherText.style.display = "block";
        } else {
          otherText.style.display = "none";
          otherText.value = "";
        }
      });
    });
  
     
});