import { app } from "/scripts/app.js";
import { PANEL_POSITIONS, PANEL_FONTS } from "../constants.js";
import { DEFAULT_PANEL_SETTINGS } from "./defaults.js";
function registerPanelSettings(setEnabled) {
  const settings = DEFAULT_PANEL_SETTINGS;
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelPosition",
    name: "🔍 [4] Info Panel: Position",
    type: "combo",
    options: PANEL_POSITIONS.map((p) => ({ value: p, text: p })),
    defaultValue: settings["🔍MagnifyGlass.InfoPanelPosition"],
    tooltip: "Position of the info panel relative to the magnifying glass.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelPosition"] = String(value);
      panel.positionManager.positionPanel();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelPersist",
    name: "🔍 [4] Info Panel: Sticky Mode (Persist)",
    type: "boolean",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelPersist"],
    tooltip: "Keep showing the last node while the cursor is over empty canvas. Its widgets can then be edited.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelPersist"] = !!value;
      panel.uiManager.updateControlStates();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelFollowSelection",
    name: "🔍 [4] Info Panel: Follow Selection",
    type: "boolean",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelFollowSelection"],
    tooltip: "Show the selected node instead of the hovered one while a node is selected. Its widgets can then be edited.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelFollowSelection"] = !!value;
      panel.uiManager.updateControlStates();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.NodeHighlightEnabled",
    name: "🔍 [4] Info Panel: Node Highlight Border",
    type: "boolean",
    defaultValue: settings["🔍MagnifyGlass.NodeHighlightEnabled"] ?? true,
    tooltip: "Show a highlight border in the accent colour around the currently inspected node.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.NodeHighlightEnabled"] = !!value;
      const app2 = window.app;
      if (app2 && app2.canvas) {
        app2.canvas.setDirty(true, true);
      }
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.ShowHoveringControls",
    name: "🔍 [4] Info Panel: Show Hover Controls",
    type: "combo",
    options: [{ value: true, text: "Yes" }, { value: false, text: "No" }],
    defaultValue: settings["🔍MagnifyGlass.ShowHoveringControls"],
    tooltip: "Show or hide hovering UI controls above the info panel.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.ShowHoveringControls"] = !!value;
      if (panel.uiManager.elements.controls) {
        panel.uiManager.elements.controls.style.display = value ? "flex" : "none";
      }
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelWidth",
    name: "🔍 [5] Panel Sizing: Width (px)",
    type: "slider",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelWidth"],
    min: 200,
    max: 600,
    step: 20,
    tooltip: "Width of the information panel in pixels.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelWidth"] = parseInt(String(value), 10);
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelMaxHeight",
    name: "🔍 [5] Panel Sizing: Max Height (px)",
    type: "slider",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelMaxHeight"],
    min: 200,
    max: 1500,
    step: 50,
    tooltip: "Maximum height of the information panel in pixels.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelMaxHeight"] = parseInt(String(value), 10);
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelOpacity",
    name: "🔍 [5] Panel Sizing: Opacity (%)",
    type: "slider",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelOpacity"],
    min: 10,
    max: 100,
    step: 5,
    tooltip: "Opacity of the information panel background.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelOpacity"] = parseInt(String(value), 10);
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelFontSize",
    name: "🔍 [6] Panel Style: Font Size (px)",
    type: "slider",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelFontSize"],
    min: 8,
    max: 24,
    step: 1,
    tooltip: "Font size of the information panel text.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelFontSize"] = parseInt(String(value), 10);
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelFontFamily",
    name: "🔍 [6] Panel Style: Font Family",
    type: "combo",
    options: PANEL_FONTS.map((f) => ({ value: f, text: f === "monospace" ? "Monospace" : f })),
    defaultValue: settings["🔍MagnifyGlass.InfoPanelFontFamily"],
    tooltip: "Font family for the info panel text. A font that is not installed on this computer falls back to the default.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelFontFamily"] = String(value);
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelTextColor",
    name: "🔍 [6] Panel Style: Text Color",
    type: "color",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelTextColor"],
    tooltip: "Custom text color for the info panel.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      const strValue = String(value);
      const normalizedColor = strValue && !strValue.startsWith("#") ? `#${strValue}` : strValue;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelTextColor"] = normalizedColor;
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelAccentColor",
    name: "🔍 [6] Panel Style: Accent Color",
    type: "color",
    defaultValue: settings["🔍MagnifyGlass.InfoPanelAccentColor"],
    tooltip: "Custom accent color for the info panel.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      const strValue = String(value);
      const normalizedColor = strValue && !strValue.startsWith("#") ? `#${strValue}` : strValue;
      panel.stateManager.state.settings["🔍MagnifyGlass.InfoPanelAccentColor"] = normalizedColor;
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.HighContrastText",
    name: "🔍 [6] Panel Style: High Contrast Text",
    type: "boolean",
    defaultValue: settings["🔍MagnifyGlass.HighContrastText"] ?? false,
    tooltip: "Increase contrast for text in input fields for better legibility.",
    onChange: (value) => {
      const panel = window.infoPanelManager;
      if (!panel) return;
      panel.stateManager.state.settings["🔍MagnifyGlass.HighContrastText"] = !!value;
      panel.uiManager.applyStyles();
    }
  });
  app.ui.settings.addSetting({
    id: "🔍MagnifyGlass.InfoPanelEnabled",
    name: "🔍 [4] Info Panel: Enable",
    type: "combo",
    options: [{ value: true, text: "Yes" }, { value: false, text: "No" }],
    defaultValue: settings["🔍MagnifyGlass.InfoPanelEnabled"],
    tooltip: "Show the Inspector panel next to the glass. Off: glass only, with no panel or panel hotkeys.",
    onChange: (value) => setEnabled(!!value)
  });
}
export {
  registerPanelSettings
};