import { extractDomain } from "../shared/domain";

export interface DetectedField {
  type: "username" | "password" | "email";
  el: HTMLInputElement;
}

// Conservative: "name" alone is too broad (matches "tag-name", "first-name", etc.)
const USERNAME_PATTERNS = /\b(user(name)?|e?mail(box)?|login|account|identifier|signin|sign.?in|credential)\b/i;
const PASSWORD_PATTERNS = /pass|passwd|pwd/i;

// Input types that are never text-entry fields and must never get autofill icons
const SKIP_INPUT_TYPES = new Set([
  "submit", "button", "reset", "image",
  "checkbox", "radio", "hidden", "file",
  "range", "color", "date", "time",
  "datetime-local", "month", "week",
]);

function findLabelText(field: HTMLInputElement): string {
  const ariaLabel = field.getAttribute("aria-label") ?? "";
  if (ariaLabel) return ariaLabel.toLowerCase();
  const id = field.id;
  if (id) {
    const label = document.querySelector<HTMLLabelElement>(`label[for="${id}"]`);
    if (label) return label.textContent?.toLowerCase() ?? "";
  }
  const wrappingLabel = field.closest("label");
  return wrappingLabel?.textContent?.toLowerCase() ?? "";
}

export function querySelectorAllDeep<T extends Element>(
  root: Document | ShadowRoot | Element,
  selector: string
): T[] {
  const results: T[] = [];
  const walk = (node: Document | ShadowRoot | Element) => {
    if (node instanceof Element) {
      results.push(...(node.querySelectorAll<T>(selector)));
      const shadowRoot = node.shadowRoot;
      if (shadowRoot) {
        shadowRoot.querySelectorAll<T>("*").forEach(walk);
      }
    }
  };
  root.querySelectorAll<T>("*").forEach(walk);
  return results;
}

export function getDeepActiveInput(): HTMLInputElement | null {
  let current: Document | Element | null = document.activeElement;
  while (current) {
    if (current instanceof HTMLInputElement) return current;
    if (current instanceof Element && current.shadowRoot) {
      current = current.shadowRoot.activeElement;
    } else {
      break;
    }
  }
  return null;
}

export function isLoginForm(fields: DetectedField[]): boolean {
  const hasPassword = fields.some((f) => f.type === "password");
  const hasUsernameOrEmail = fields.some((f) => f.type === "username" || f.type === "email");
  if (hasPassword && hasUsernameOrEmail) return true;
  const singlePassword = fields.filter((f) => f.type === "password");
  if (singlePassword.length === 1 && singlePassword[0].el.autocomplete === "current-password") {
    return true;
  }
  return false;
}

export function isSignupForm(fields: DetectedField[]): boolean {
  const passwords = fields.filter((f) => f.type === "password");
  if (passwords.length >= 2) return true;
  if (passwords.some((f) => f.el.autocomplete === "new-password")) return true;
  if (
    passwords.some((f) => {
      const id = (f.el.id + f.el.name).toLowerCase();
      return /new|confirm/i.test(id);
    })
  ) {
    return true;
  }
  return false;
}

export function detectLoginFields(root: Document | ShadowRoot = document): DetectedField[] {
  const inputs = Array.from(querySelectorAllDeep<HTMLInputElement>(root, "input"));
  const fields: DetectedField[] = [];

  for (const el of inputs) {
    if (!isVisible(el)) continue;
    const type = el.type.toLowerCase();
    // Never treat buttons, checkboxes, hidden fields, etc. as autofill targets
    if (SKIP_INPUT_TYPES.has(type)) continue;
    const ac = el.autocomplete;
    const name = (el.name + el.id + el.placeholder).toLowerCase();

    if (ac === "current-password" || ac === "new-password" || type === "password") {
      fields.push({ type: "password", el });
      continue;
    }

    if (ac === "username" || ac === "email" || type === "email") {
      fields.push({ type: "username", el });
      continue;
    }

    if (USERNAME_PATTERNS.test(name)) {
      fields.push({ type: "username", el });
      continue;
    }

    const labelText = findLabelText(el);
    if (!fields.some((f) => f.el === el) && USERNAME_PATTERNS.test(labelText)) {
      fields.push({ type: "username", el });
    }
  }

  // Fallback: if we have a password field but no username/email, look for
  // the first visible text input that appears before the password in DOM order.
  // This catches sites with unconventional field names (e.g. name="identifier").
  const hasUsername = fields.some((f) => f.type === "username" || f.type === "email");
  const pwField = fields.find((f) => f.type === "password");
  if (!hasUsername && pwField) {
    const allInputs = Array.from(inputs);
    const pwIndex = allInputs.indexOf(pwField.el);
    for (let i = 0; i < pwIndex; i++) {
      const candidate = allInputs[i];
      const candidateType = candidate.type.toLowerCase();
      if (
        (candidateType === "text" || candidateType === "email" || candidateType === "") &&
        isVisible(candidate) &&
        !SKIP_INPUT_TYPES.has(candidateType) &&
        !fields.some((f) => f.el === candidate)
      ) {
        fields.push({ type: "username", el: candidate });
        break; // only take the first one
      }
    }
  }

  return fields;
}

export function isVisible(el: HTMLElement): boolean {
  const s = getComputedStyle(el);
  const r = el.getBoundingClientRect();
  return (
    s.display !== "none" &&
    s.visibility !== "hidden" &&
    parseFloat(s.opacity) > 0 &&
    r.width > 0 &&
    r.height > 0
  );
}

export function getPageDomain(): string {
  return extractDomain(location.hostname) ?? location.hostname;
}