// SPDX-FileCopyrightText: Night Theme Switcher Contributors
// SPDX-License-Identifier: GPL-3.0-or-later

import GObject from "gi://GObject";
import Gtk from "gi://Gtk";

import { gettext as _ } from "resource:///org/gnome/Shell/Extensions/js/extensions/prefs.js";

import { AccentColor } from "../enums/AccentColor.js";

export class ColorChooser extends Gtk.Widget {
  /** @type {Gtk.ToggleButton[]} */
  #buttons = [];

  /** @type {AccentColor} */
  #activeColor;

  static {
    GObject.registerClass(
      {
        GTypeName: "ColorChooser",
        CssName: "color-chooser",
        Properties: {
          color: GObject.ParamSpec.string(
            "active-color",
            "Active color",
            "Active color",
            GObject.ParamFlags.READWRITE,
            null,
          ),
        },
      },
      this,
    );
  }

  constructor({ ...params } = {}) {
    super({ layoutManager: new Gtk.BoxLayout({ spacing: 6 }), ...params });

    const colors = [
      { accentColor: AccentColor.BLUE, name: _("Blue") },
      { accentColor: AccentColor.TEAL, name: _("Teal") },
      { accentColor: AccentColor.GREEN, name: _("Green") },
      { accentColor: AccentColor.YELLOW, name: _("Yellow") },
      { accentColor: AccentColor.ORANGE, name: _("Orange") },
      { accentColor: AccentColor.RED, name: _("Red") },
      { accentColor: AccentColor.PINK, name: _("Pink") },
      { accentColor: AccentColor.PURPLE, name: _("Purple") },
      { accentColor: AccentColor.SLATE, name: _("Slate") },
    ];

    let toggleGroup;
    for (const color of colors) {
      const button = new Gtk.ToggleButton({
        tooltipText: color.name,
        cssClasses: ["circular", color.accentColor],
        active: this.activeColor === color.accentColor,
      });

      if (!toggleGroup) toggleGroup = button;
      else button.group = toggleGroup;

      button.connect("toggled", () => {
        if (!button.active) return;
        this.activeColor = color.accentColor;
      });

      this.#buttons.push(button);

      button.set_parent(this);
    }
  }

  get activeColor() {
    return this.#activeColor;
  }

  set activeColor(color) {
    if (!color || color === this.#activeColor || !Object.values(AccentColor).includes(color)) return;
    this.#activeColor = color;
    this.notify("active-color");
    this.#updateButtons();
  }

  #updateButtons() {
    this.#buttons.forEach((button) => {
      button.active = button.cssClasses.includes(this.activeColor);
    });
  }
}