Mencari

Mencari

Ketikkan kata kunci di atas untuk menelusuri layanan, proyek, dan kemampuan kami.

dokumen.addEventListener('DOMContentLoaded', () => { const input = document.getElementById('input-pencarian'); const resultContainer = document.getElementById('hasil-pencarian'); biarkan indeks pencarian = [];

// Ambil indeksnya ambil('/pencarian.json') .lalu(res => res.json()) .lalu(data => { indeks pencarian = data; masukan.fokus(); }) .menangkap(err => { console.error("Tidak dapat memuat indeks pencarian", err); resultContainer.innerHTML = '

Kesalahan saat memuat fungsi pencarian.

'; });

masukan.addEventListener('masukan', (e) => { const query = e.target.value.toLowerCase().trim();

if (panjang kueri < 2) { resultContainer.innerHTML = '

Ketikkan kata kunci di atas untuk mencari di seluruh layanan, proyek, dan kemampuan kami.

'; kembali; }

hasil const = searchIndex.filter(halaman => { if (!page.url || page.url === '/search/') menghasilkan false; kembalikan halaman.title.toLowerCase().includes(query) || halaman.konten.toLowerCase().includes(query); });

if (hasil.panjang === 0) { resultContainer.innerHTML = '

Tidak ditemukan hasil untuk "' + kueri + '".

'; kembali; }

biarkan html = ''; hasil.untukSetiap(hasil => { // Temukan cuplikan konten const contentLower = hasil.content.toLowerCase(); const matchIndex = contentLower.indexOf(query); biarkan cuplikan = ''; jika (Indeks Pertandingan !== -1) { const start = Math.max(0, matchIndex - 60); const end = Math.min(hasil.konten.panjang, matchIndex + 60); cuplikan = (mulai > 0 ? '...' : '') + hasil.konten.substring(mulai, akhir) + (akhir < hasil.konten.panjang ? '...' : ''); // Sorot pertanyaannya const regex = RegExp baru(kueri, 'gi'); cuplikan = snippet.replace(regex, match => '' + match + ''); } lain { cuplikan = hasil.konten.substring(0, 120) + '...'; }

html += '' + '

' + hasil.judul + '

' + '

' + cuplikan + '

' + '' + result.url + '' + '
'; });

resultContainer.innerHTML = html; });

// Tambahkan gaya fokus secara manual karena gaya inline rumit dengan pseudoclass input.addEventListener('fokus', () => { input.style.borderColor = 'var(--warna-primer)'; input.style.boxShadow = '0 0 0 3px rgba(43, 95, 167, 0,15)'; }); masukan.addEventListener('blur', () => { input.style.borderColor = 'var(--color-border)'; input.style.boxShadow = 'var(--shadow-sm)'; }); });