Hjemmebygget DAWA-autocomplete med fetch eller jQuery

$("#adresse").on("input", function () {
  $.ajax({
    url: "https://dawa.aws.dk/autocomplete",
    dataType: "jsonp",
    data: { q: this.value, caretpos: this.selectionStart, type: "adresse" },
    success: visForslag
  });
});

const API = "https://api.danadresse.dk/autocomplete";
const headers = { "X-Api-Key": process.env.DANADRESSE_API_KEY };

let tekst = "Rådhuspladsen 1";
let caretpos = tekst.length;

for (let trin = 1; trin <= 3; trin++) {
  const url = new URL(API);
  url.search = new URLSearchParams({ q: tekst, caretpos: String(caretpos), per_side: "5" });
  const res = await fetch(url, { headers });
  if (!res.ok) throw new Error(`HTTP ${res.status}: ${await res.text()}`);
  const forslag = await res.json();
  if (forslag.length === 0) break;

  const valgt = forslag[0];
  console.log(`trin ${trin}: ${valgt.type} -> "${valgt.tekst}" (caretpos ${valgt.caretpos})`);
  if (valgt.type === "adresse") {
    console.log(`færdig, adresse-id ${valgt.data.id}`);
    break;
  }
  tekst = valgt.tekst;
  caretpos = valgt.caretpos;
}

const API = "https://api.danadresse.dk/autocomplete";
const API_KEY = "dawa_live_din_browsernøgle"; // domænelåst browsernøgle
const MAAL = "adresse"; // eller "adgangsadresse", hvis du ikke vil have etage og dør

const input = document.querySelector("#adresse");
const liste = document.querySelector("#forslag");
let controller = null;
let timer = null;
let pauseTil = 0;

async function hentForslag(tekst, caretpos) {
  if (Date.now() < pauseTil || tekst.trim().length < 2) return [];
  controller?.abort();
  controller = new AbortController();
  const url = new URL(API);
  url.search = new URLSearchParams({
    q: tekst,
    caretpos: String(caretpos),
    per_side: "10",
    api_key: API_KEY,
  });
  let res;
  try {
    res = await fetch(url, { signal: controller.signal });
  } catch (err) {
    if (err.name === "AbortError") return null; // et nyere tastetryk har overtaget
    throw err;
  }
  if (res.status === 429) {
    const fejl = await res.json();
    // quota_exceeded: måneden er brugt op, stop. Ellers vent Retry-After sekunder.
    const vent = fejl.code === "quota_exceeded" ? 3600 : Number(res.headers.get("Retry-After")) || 5;
    pauseTil = Date.now() + vent * 1000;
    return [];
  }
  if (res.status === 401 || res.status === 403) {
    const fejl = await res.json();
    console.error("Danadresse:", fejl.code, fejl.title);
    return [];
  }
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  return res.json();
}

function visForslag(forslag) {
  liste.replaceChildren(...forslag.map((f) => {
    const li = document.createElement("li");
    li.textContent = f.forslagstekst;
    li.addEventListener("mousedown", (e) => {
      e.preventDefault();
      vaelg(f);
    });
    return li;
  }));
}

async function opdater(tekst, caretpos) {
  const forslag = await hentForslag(tekst, caretpos);
  if (forslag) visForslag(forslag);
}

function vaelg(f) {
  input.value = f.tekst;
  input.setSelectionRange(f.caretpos, f.caretpos);
  if (f.type === MAAL) {
    liste.replaceChildren();
    input.dataset.adresseId = f.data.id; // gem id'et, ikke kun teksten
    return;
  }
  opdater(f.tekst, f.caretpos); // vejnavn eller adgangsadresse: bor videre
}

input.addEventListener("input", () => {
  delete input.dataset.adresseId;
  clearTimeout(timer);
  timer = setTimeout(() => opdater(input.value, input.selectionStart), 200);
});

$("#adresse").on("input", function () {
  $.ajax({
    url: "https://api.danadresse.dk/autocomplete",
    dataType: "json",
    data: { q: this.value, caretpos: this.selectionStart, api_key: API_KEY },
    success: visForslag,
    error: function (xhr) {
      var fejl = xhr.responseJSON || {};
      console.error("Danadresse:", xhr.status, fejl.code);
    }
  });
});