js/utils.js — pagalbinės funkcijos

Pradedam nuo js/utils.js — mažų pagalbinių funkcijų, kurios neturi savo būsenos, todėl lengvai suprantamos ir testuojamos. Kodo stulpelyje trys, kurių prireiks kortelei ir toliau:

formatDateHuman(dateStr) — API grąžina datą kaip "2026-07-11"; žmogui parodom toLocaleDateString. (undefined kaip lokalė reiškia „naudok naršyklės kalbą".)
truncate(str, max) — sutrumpina ilgą tekstą su daugtaškiu.
showStatus(el, message) — išvalo elementą ir įrašo vieną būsenos žinutę.

Atkreipk dėmesį į showStatus — jame yra abu metodai, ir tai pamokantis kontrastas:

export function showStatus(el, message) {
  el.innerHTML = '';                  // IŠVALYTI saugu — jokių duomenų
  const p = document.createElement('p');
  p.textContent = message;            // ŽINUTĖ įrašoma kaip tekstas
  el.appendChild(p);
}

innerHTML = '' (išvalymui) yra saugu — nieko neįterpiam. Bet žinutė eina per textContent, ne innerHTML — nes žinutė gali būti API klaida su bet kokiais simboliais. Taisyklė paprasta: išvalyti su innerHTML='' galima; įrašinėti kintantį tekstą — visada textContent.

Patarimas. Šį failą papildysim per kursą: debounce ateis 7 pamokoje, parseTags — su formomis. Laikom „gryną" logiką (datos, tekstas) atskirai nuo DOM ir būsenos — tokias funkcijas lengviausia testuoti ir pernaudoti.

utils.js SUKURTI

Sukurk šį failą kataloge js/

// Small pure helpers. No DOM state of their own, easy to reason about.
// We'll add more to this file as the app grows (debounce arrives in lesson 7).

/** "2026-07-11" → "7/11/2026" (or "July 11, 2026" when long) */
export function formatDateHuman(dateStr, long = false) {
  const options = long
    ? { year: 'numeric', month: 'long', day: 'numeric' }
    : undefined;
  return new Date(dateStr).toLocaleDateString(undefined, options);
}

/** Cut a long string and add an ellipsis */
export function truncate(str, max) {
  return str.length > max ? str.slice(0, max) + '…' : str;
}

/** Replace an element's contents with a single status message. */
export function showStatus(el, message) {
  el.innerHTML = '';                       // clearing is safe (no user data here)
  const p = document.createElement('p');
  p.className = 'status';
  p.textContent = message;                 // the MESSAGE goes in as text, not HTML
  el.appendChild(p);
}