Cpt 파라미터 저장 예외처리(debounce)¶

document.addEventListener('DOMContentLoaded', function () {
  const today = new Date();

  // debounce 함수 정의
  function debounce(func, delay) {
    let timeoutId;
    return function (...args) {
      if (timeoutId) {
        clearTimeout(timeoutId);
      }
      timeoutId = setTimeout(() => {
        func.apply(this, args);
      }, delay);
    };
  }

  // widget 처리 공통 로직
  function handleWidget(target) {
    if (target) {
      console.log(`Handling widget: ${target.getAttribute('widgetname')}`);
      let dateFilter = 'Y';
    //   const paramContainer = _g().getParameterContainer();
      if (typeof  _g().getParameterContainer().getWidgetByName('date_filter_YN') !== 'undefined') {
        dateFilter =  _g().getParameterContainer().getWidgetByName('date_filter_YN').getValue();
      }
      if (dateFilter === 'N') {
        if (typeof  _g().getParameterContainer().getWidgetByName('p_to_date') !== 'undefined') {
           _g().getParameterContainer().getWidgetByName('p_to_date').setValue(today);
        }
        if (typeof  _g().getParameterContainer().getWidgetByName('p_from_date') !== 'undefined') {
           _g().getParameterContainer().getWidgetByName('p_from_date').setValue(today);
        }
      }
    }
  }

  // debounce 처리할 공통 로직
  const handleDebouncedEvent = debounce(function (event) {
    console.log('Debounced Event Triggered:', event?.type || 'DOM Mutation');
    if (event?.type === 'click') {
      const target = event.target.closest("[widgetname^=sortable]");
      if (target) {
        handleWidget(target);
      }
    } else {
      // MutationObserver로 감지된 경우 widgetname 조건 만족하는 모든 요소 처리
      const sortableWidgets = document.querySelectorAll("[widgetname^=sortable]");
      sortableWidgets.forEach((widget) => {
        handleWidget(widget);
      });
    }
  }, 100); // 100ms debounce delay

  // 클릭 이벤트 감지
  document.body.addEventListener('click', handleDebouncedEvent);

  // MutationObserver로 DOM 변경 감지
  const observerCallback = function (mutationsList) {
    console.log('1');
    for (const mutation of mutationsList) {
      if (mutation.type === 'childList' || mutation.type === 'attributes') {
        const target = mutation.target;
        if (target.getAttribute && target.getAttribute('widgetname')?.startsWith('sortable')) {
          handleWidget(target);
          console.log('1 sortable');
        } else {
        console.log('all');
        console.log(target);
        console.log(target.getAttribute('widgetname'));
          // 전체 DOM에서 조건 만족하는 widget 처리
          handleDebouncedEvent();
        }
      }
    }
  };

  // MutationObserver 설정
  const observer = new MutationObserver(observerCallback);
  observer.observe(document.body, {
    // childList: true,      // 자식 노드 변경 감지
    attributes: true,     // 속성 변경 감지
    // subtree: true,        // 하위 모든 노드 감지
  });
  console.log('Observer and click listener initialized.');
});