${escapeHtml(region)}

${Array.from({ length: 3 }, () => `

`).join('')}

`).join(''); } function renderCard(item) { const link = safeLink(item.link); return `

${escapeHtml(item.issue || 'ISU')} ${escapeHtml(item.source || 'Unknown')} ${formatDateID(item.date)}

${escapeHtml(item.title || '-')}

Daerah: ${escapeHtml(item.region || '-')} | Isu: ${escapeHtml(item.issue || '-')}

Buka berita

`; } function getRegionGroup(region) { return [...document.querySelectorAll('.region-group')] .find(group => group.dataset.region === region); } function refreshRegionFilter(region, items) { const group = getRegionGroup(region); if (!group) return; const filter = group.querySelector('.issue-filter'); if (filter) filter.outerHTML = renderIssueFilter(region, items); } function appendResultsSmooth(items = []) { if (!items.length) return; updateCounts(); const grouped = new Map(); for (const item of items) { const region = item.region || 'Lainnya'; if (!grouped.has(region)) grouped.set(region, []); grouped.get(region).push(item); } for (const [region, regionItems] of grouped.entries()) { const allRegionItems = DATA.filter(item => String(item.region || '').toLowerCase() === region.toLowerCase()); const activeIssue = regionIssueFilters[region] || 'Semua'; const group = getRegionGroup(region); if (!group) { requestAnimationFrame(renderResults); continue; } group.querySelector('.region-count').textContent = `${allRegionItems.length} isu`; refreshRegionFilter(region, allRegionItems); const list = group.querySelector('.region-list'); if (!list) continue; const empty = list.querySelector('.empty'); if (empty) empty.remove(); const visibleNewItems = activeIssue === 'Semua' ? regionItems : regionItems.filter(item => String(item.issue || 'Isu Daerah') === activeIssue); if (!visibleNewItems.length) continue; const fragment = document.createDocumentFragment(); for (const item of visibleNewItems) { const template = document.createElement('template'); template.innerHTML = renderCard(item).trim(); fragment.appendChild(template.content.firstElementChild); } requestAnimationFrame(() => list.appendChild(fragment)); } } function renderResults() { const scrollState = getRegionScrollState(); updateCounts(); const list = document.getElementById('resultsList'); if (!hasSearched) { list.innerHTML = '

Tambahkan daerah lalu klik Pantau Isu.

'; return; } if (!DATA.length) { const regions = getTags(); if (!regions.length) { list.innerHTML = '

Tambahkan daerah lalu klik Pantau Isu.

'; return; } list.innerHTML = regions.map(region => `

${escapeHtml(region)}

0 isu

${renderIssueFilter(region, [])}

Belum ada isu untuk daerah ini.

`).join(''); restoreRegionScrollState(scrollState); return; } const sorted = DATA.map((item, index) => ({ ...item, originalIndex: index })); const groups = getTags().map(region => ({ region, items: sorted.filter(item => String(item.region || '').toLowerCase() === region.toLowerCase()), })); const extraItems = sorted.filter(item => !groups.some(group => String(item.region || '').toLowerCase() === group.region.toLowerCase())); if (extraItems.length) groups.push({ region: 'Lainnya', items: extraItems }); list.innerHTML = groups.map(group => `

${escapeHtml(group.region)}

${group.items.length} isu

${renderIssueFilter(group.region, group.items)}

${getFilteredRegionItems(group.region, group.items).length ? getFilteredRegionItems(group.region, group.items).map(renderCard).join('') : '

Belum ada isu untuk daerah ini.

`).join(''); restoreRegionScrollState(scrollState); } function getFilteredRegionItems(region, items) { const activeIssue = regionIssueFilters[region] || 'Semua'; if (activeIssue === 'Semua') return items; return items.filter(item => String(item.issue || 'Isu Daerah') === activeIssue); } function renderIssueFilter(region, items) { const issues = ['Semua', ...new Set(items.map(item => item.issue || 'Isu Daerah').filter(Boolean))]; const activeIssue = regionIssueFilters[region] || 'Semua'; return `

`; } async function runRegionalIssues(scanId) { const regions = getTags(); if (!regions.length) { alert('Daerah wajib diisi.'); return; } activeScanId = scanId; DATA = []; regionIssueFilters = {}; hasSearched = true; isArchiveScanning = true; renderSkeletons(); const windows = buildScanWindows(); for (let i = 0; i < windows.length; i++) { if (activeScanId !== scanId) return; const window = windows[i]; if (i === 0) { setScanStatus(' Memantau...'); } scheduleScanText(`${i === 0 ? 'mencari 1 bulan terakhir' : 'mencari arsip ' + window.label}`); const response = await fetch('/api/regional-issues', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ regions, startDate: window.startDate, endDate: window.endDate, maxPerRegion: 30, }), }); const data = await response.json(); if (!response.ok) throw new Error(data.error || 'Gagal mengambil isu daerah'); const addedItems = mergeResults(Array.isArray(data.results) ? data.results : []); if (i === 0 || !document.querySelector('.region-group')) { renderResults(); } else if (addedItems.length) { appendResultsSmooth(addedItems); } if (i === 0) { setButtonReady(); setScanText('hasil 1 bulan tampil, arsip lanjut di latar belakang'); } } isArchiveScanning = false; setScanText('selesai sampai 2020'); } document.getElementById('regionInput').addEventListener('keydown', (e) => { if (e.key === 'Enter') { e.preventDefault(); addRegion(); } }); document.getElementById('regionTags').addEventListener('click', (e) => { if (e.target.classList.contains('remove')) { e.target.parentElement.remove(); DATA = DATA.filter(item => getTags().some(region => String(item.region || '').toLowerCase() === region.toLowerCase())); updateCounts(); renderResults(); } }); document.getElementById('regionalBtn').addEventListener('click', async () => { const scanId = Date.now(); activeScanId = scanId; const btn = document.getElementById('regionalBtn'); btn.disabled = true; btn.innerHTML = ' Memantau...'; runRegionalIssues(scanId).catch((err) => { if (activeScanId === scanId) { if (!DATA.length) { DATA = []; hasSearched = true; renderResults(); setScanText('gagal'); alert('Gagal pantau isu daerah: ' + err.message); } else { setScanText('arsip berhenti: ' + err.message); } } }).finally(() => { if (activeScanId === scanId) { isArchiveScanning = false; setButtonReady(); } }); }); document.getElementById('resultsList').addEventListener('change', (e) => { const issueSelect = e.target.closest('.issue-select'); if (!issueSelect) return; regionIssueFilters[issueSelect.dataset.region] = issueSelect.value; renderResults(); }); document.getElementById('resultsList').addEventListener('click', (e) => { if (e.target.closest('.open')) return; }); ['Riau', 'Kalimantan Timur', 'Papua'].forEach(addRegion); renderResults(); function isAssetUrl(url) { const host = url.hostname.replace(/^www\./i, '').toLowerCase(); const path = url.pathname.toLowerCase(); if (['fonts.googleapis.com', 'fonts.gstatic.com'].includes(host)) return true; return /\.(css|js|mjs|json|xml|woff2?|ttf|otf|eot|png|jpe?g|gif|webp|svg|ico|mp4|webm|mp3|wav)$/i.test(path); } function safeLink(link) { try { const url = new URL(String(link || '').trim()); if (!['http:', 'https:'].includes(url.protocol)) return ''; if (isAssetUrl(url)) return ''; return url.toString(); } catch { return ''; } } const HERO_ICON_PATHS = { radar: '', satellite: '', 'map-pin': '', 'map-search': '', news: '', 'news-off': '', 'external-link': '', 'loader-2': '', sun: '', moon: '', }; function heroIconSvg(name, className = '', style = '') { const path = HERO_ICON_PATHS[name] || HERO_ICON_PATHS.news; const classes = (className + ' hero-icon').trim(); const styleAttr = style ? ' style="' + escapeHtml(style) + '"' : ''; return ''; } function applyHeroIcons(root = document) { root.querySelectorAll('i.ti').forEach((icon) => { const iconClass = [...icon.classList].find((name) => name.startsWith('ti-') && name !== 'ti'); if (!iconClass) return; const keepClasses = [...icon.classList].filter((name) => name !== 'ti' && !name.startsWith('ti-')).join(' '); icon.outerHTML = heroIconSvg(iconClass.replace(/^ti-/, ''), keepClasses, icon.getAttribute('style') || ''); }); } applyHeroIcons(document.querySelector('.app-content') || document); new MutationObserver((mutations) => { for (const mutation of mutations) { mutation.addedNodes.forEach((node) => { if (node.nodeType === 1 && document.querySelector('.app-content')?.contains(node)) applyHeroIcons(node); }); } }).observe(document.body, { childList: true, subtree: true });