/**
 * Toggle initialization methods for MenuUtils.
 * Controls visibility of UI elements based on checkbox/dropdown state.
 */

const toggles = {
  initBasicToggles(elements) {
    // Toggle visibility for log level
    elements.logCheckbox.addEventListener("change", function () {
      elements.rowLogLevel.style.display = this.checked ? "block" : "none";
    });
    elements.rowLogLevel.style.display = elements.logCheckbox.checked
      ? "block"
      : "none";
  },

  // Define the initialize toggles function within scope
  initMeasurementToggles(elements) {
    // Toggle visibility for scaling inputs
    elements.scalingCheckbox.addEventListener("change", function () {
      elements.rowInputMin.style.display = this.checked ? "block" : "none";
      elements.rowInputMax.style.display = this.checked ? "block" : "none";
    });

    // Set initial states
    elements.rowInputMin.style.display = elements.scalingCheckbox.checked
      ? "block"
      : "none";
    elements.rowInputMax.style.display = elements.scalingCheckbox.checked
      ? "block"
      : "none";
  },

  initTensionToggles(elements, node) {
    const currentMethod = node.interpolationMethod;
    elements.rowTension.style.display =
      currentMethod === "monotone_cubic_spline" ? "block" : "none";
    console.log(
      "Initial tension row display: ",
      elements.rowTension.style.display
    );

    elements.interpolationMethodInput.addEventListener("change", function () {
      const selectedMethod = this.value;
      console.log(`Interpolation method changed: ${selectedMethod}`);
      node.interpolationMethod = selectedMethod;

      // Toggle visibility for tension input
      elements.rowTension.style.display =
        selectedMethod === "monotone_cubic_spline" ? "block" : "none";
      console.log("Tension row display: ", elements.rowTension.style.display);
    });
  },
};

module.exports = toggles;