diff --git a/public/dashboard/js/dashboard.js b/public/dashboard/js/dashboard.js index caac8e2..e4d863a 100644 --- a/public/dashboard/js/dashboard.js +++ b/public/dashboard/js/dashboard.js @@ -117,13 +117,9 @@ async function getLastAvailableDate() { } } -// Video HLS setup - mapping lokasi ke URL camera -const LOCATION_CAMERAS = { - 'kerkof_01': { - url: 'https://kerkof.btekno.cloud/cam1/index.m3u8', - name: 'Kerkof' - } -}; +// Video HLS setup - menggunakan URL kamera dari database +let gatesCache = {}; // Cache untuk gates dengan camera URL +let locationsCache = {}; // Cache untuk locations let hls = null; let isVideoPlaying = false; @@ -504,9 +500,59 @@ async function loadSummaryAndCharts() { } } +// Load gates untuk mendapatkan camera URL dari database +async function loadGatesForCamera() { + try { + const response = await apiGetGates(null, { limit: 1000 }); + let gates = Array.isArray(response) ? response : (response && Array.isArray(response.data) ? response.data : []); + + gatesCache = {}; + gates.forEach(gate => { + const locationCode = gate.location_code || ''; + const camera = gate.camera || null; + + // Hanya simpan gate yang punya camera URL + if (camera && camera.trim() !== '') { + // Jika sudah ada, gunakan yang pertama (atau bisa dipilih gate tertentu) + if (!gatesCache[locationCode]) { + const locationName = locationsCache[locationCode]?.name || locationCode; + gatesCache[locationCode] = { + url: camera.trim(), + name: locationName, + gate_name: gate.name || gate.gate_code || '', + location_code: locationCode + }; + } + } + }); + + console.log('[Dashboard] Gates dengan camera loaded:', Object.keys(gatesCache).length); + } catch (err) { + console.error('[Dashboard] Error loading gates for camera:', err); + } +} + +// Load locations untuk mendapatkan nama lokasi +async function loadLocationsForCamera() { + try { + const response = await apiGetLocations({ limit: 1000 }); + let locations = Array.isArray(response) ? response : (response && Array.isArray(response.data) ? response.data : []); + + locationsCache = {}; + locations.forEach(loc => { + const code = loc.code || loc.location_code || ''; + locationsCache[code] = { + name: loc.name || loc.label || code + }; + }); + } catch (err) { + console.error('[Dashboard] Error loading locations for camera:', err); + } +} + function getCameraForLocation(locationCode) { if (!locationCode) return null; - return LOCATION_CAMERAS[locationCode] || null; + return gatesCache[locationCode] || null; } function showVideoPanel(locationCode) { @@ -514,9 +560,10 @@ function showVideoPanel(locationCode) { const videoPanelTitle = document.getElementById('video-panel-title'); const camera = getCameraForLocation(locationCode); - if (camera && videoSection && videoPanelTitle) { + if (camera && camera.url && videoSection && videoPanelTitle) { videoSection.style.display = 'block'; - videoPanelTitle.textContent = `Live Camera - ${camera.name}`; + const displayName = camera.gate_name ? `${camera.name} - ${camera.gate_name}` : camera.name; + videoPanelTitle.textContent = displayName; currentVideoUrl = camera.url; // Auto-stop video kalau lokasi berubah if (isVideoPlaying) { @@ -641,10 +688,13 @@ function setupFilters() { const gateSelect = document.getElementById('filter-gate'); if (gateSelect) gateSelect.value = ''; + // Reload gates untuk update camera cache + await loadGates(); + await loadGatesForCamera(); // Reload camera URLs + // Show/hide video panel berdasarkan lokasi showVideoPanel(state.locationCode); - await loadGates(); loadSummaryAndCharts(); }); } @@ -728,6 +778,10 @@ document.addEventListener('DOMContentLoaded', async () => { await loadLocations(); await loadGates(); + // Load locations dan gates untuk camera URL dari database + await loadLocationsForCamera(); + await loadGatesForCamera(); + // Cek lokasi awal untuk show/hide video showVideoPanel(state.locationCode);