Zender: ${channelName}
+Datum: ${event.start.toLocaleDateString('nl-NL')}
+Starttijd: ${event.start.toLocaleTimeString('nl-NL', {hour: '2-digit', minute: '2-digit'})}
+Duur: ${props.duration}
+Series Code: ${props.series_code || '-'}
+Template: ${props.template}
+API Status: ${props.api_status}
+ `; + + // Set delete button + document.getElementById('deleteEventBtn').onclick = function() { + if (confirm('Weet je zeker dat je deze uitzending wilt verwijderen?')) { + deleteEvent(event.id); + modal.hide(); + } + }; + + // Set sync button + document.getElementById('syncEventBtn').onclick = function() { + syncEvent(event.id); + }; + + modal.show(); + }, + + // Date click (show block time editor) + dateClick: function(info) { + if (info.resource) { + showBlockTimeEditor(info.dateStr.split('T')[0], info.resource.id); + } + } + }); + + calendar.render(); + + // Make external events draggable + initDraggableCommercials(); + + // Store calendar instance globally + window.tvCalendar = calendar; +}); + +/** + * Initialize draggable commercials from sidebar + */ +function initDraggableCommercials() { + const commercialItems = document.querySelectorAll('.commercial-item'); + + commercialItems.forEach(item => { + new FullCalendar.Draggable(item, { + eventData: function(eventEl) { + return { + title: eventEl.dataset.title, + duration: eventEl.dataset.duration, + backgroundColor: eventEl.dataset.color, + borderColor: eventEl.dataset.color, + extendedProps: { + commercial_id: eventEl.dataset.commercialId, + series_code: eventEl.dataset.seriesCode + } + }; + } + }); + }); +} + +/** + * Show block time editor + */ +function showBlockTimeEditor(date, channel) { + const modal = new bootstrap.Modal(document.getElementById('blockTimeModal')); + document.getElementById('blockDate').value = date; + document.getElementById('blockChannel').value = channel; + + // Load current block time + fetch(`api/get_block_time.php?date=${date}&channel=${channel}`) + .then(response => response.json()) + .then(data => { + if (data.start_time) { + document.getElementById('blockStartTime').value = data.start_time; + } + }); + + modal.show(); +} + +/** + * Save block time + */ +function saveBlockTime() { + const date = document.getElementById('blockDate').value; + const channel = document.getElementById('blockChannel').value; + const startTime = document.getElementById('blockStartTime').value; + const recalculate = document.getElementById('recalculateTransmissions').checked; + + fetch('api/update_block_time.php', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + date: date, + channel: channel, + start_time: startTime, + recalculate: recalculate + }) + }) + .then(response => response.json()) + .then(data => { + if (data.success) { + showAlert('success', 'Blok starttijd bijgewerkt'); + window.tvCalendar.refetchEvents(); + bootstrap.Modal.getInstance(document.getElementById('blockTimeModal')).hide(); + } else { + showAlert('error', data.error || 'Fout bij opslaan'); + } + }) + .catch(error => { + console.error('Error:', error); + showAlert('error', 'Netwerkfout bij opslaan'); + }); +} + +/** + * Delete event + */ +function deleteEvent(eventId) { + fetch('api/delete_transmission.php', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ id: eventId }) + }) + .then(response => response.json()) + .then(data => { + if (data.success) { + showAlert('success', 'Uitzending verwijderd'); + window.tvCalendar.refetchEvents(); + } else { + showAlert('error', data.error || 'Fout bij verwijderen'); + } + }) + .catch(error => { + console.error('Error:', error); + showAlert('error', 'Netwerkfout bij verwijderen'); + }); +} + +/** + * Sync event to Talpa API + */ +function syncEvent(eventId) { + showAlert('info', 'Synchroniseren...'); + + // This would call your existing sync functionality + fetch('index.php', { + method: 'POST', + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + }, + body: `sync_item=1&sync_id=${eventId}` + }) + .then(() => { + showAlert('success', 'Gesynchroniseerd met Talpa'); + window.tvCalendar.refetchEvents(); + }) + .catch(error => { + console.error('Error:', error); + showAlert('error', 'Fout bij synchroniseren'); + }); +} + +/** + * Show alert message + */ +function showAlert(type, message) { + const alertContainer = document.getElementById('alertContainer'); + if (!alertContainer) return; + + const alertClass = { + 'success': 'alert-success', + 'error': 'alert-danger', + 'warning': 'alert-warning', + 'info': 'alert-info' + }[type] || 'alert-info'; + + const alert = document.createElement('div'); + alert.className = `alert ${alertClass} alert-dismissible fade show`; + alert.innerHTML = ` + ${message} + + `; + + alertContainer.appendChild(alert); + + // Auto-dismiss after 5 seconds + setTimeout(() => { + alert.remove(); + }, 5000); +} + +/** + * Filter commercials in sidebar + */ +function filterCommercials(searchTerm) { + const items = document.querySelectorAll('.commercial-item'); + const term = searchTerm.toLowerCase(); + + items.forEach(item => { + const title = item.dataset.title.toLowerCase(); + const seriesCode = (item.dataset.seriesCode || '').toLowerCase(); + + if (title.includes(term) || seriesCode.includes(term)) { + item.style.display = 'block'; + } else { + item.style.display = 'none'; + } + }); +} + +/** + * Update block info display + */ +function updateBlockInfo(blocks) { + const container = document.getElementById('blockInfoContainer'); + if (!container) return; + + if (blocks.length === 0) { + container.innerHTML = 'Geen actieve blokken voor deze dag
'; + return; + } + + // Group blocks by channel + const blocksByChannel = {}; + blocks.forEach(block => { + if (!blocksByChannel[block.channel]) { + blocksByChannel[block.channel] = []; + } + blocksByChannel[block.channel].push(block); + }); + + let html = 'Nog geen templates aangemaakt
+| Zender | +Naam | +Dag | +Starttijd | +Eindtijd | +Status | +Acties | +
|---|---|---|---|---|---|---|
| + + | ++ | + | + | + | + + Actief + + Inactief + + | +
+
+
+
+
+
+
+
+ |
+
Blok templates definiëren terugkerende tijdslots voor uitzendingen. Bijvoorbeeld:
+Laden...
+Nog geen commercials geregistreerd
+| Kleur | +Titel | +Duur | +Series | +Label | +Status | +Gebruik | +Acties | +
|---|---|---|---|---|---|---|---|
|
+
+
+ |
+
+
+ + ID: + |
+ + + | ++ ' . htmlspecialchars($c['series_code']) . '' : '-' ?> + | +
+ |
+ + + Uploaded + + Pending + + | ++ + x + + | +
+
+
+
+
+
+
+ |
+
| Tijd | Product | Duur | Sync Status | Acties |
|---|
| Titel | @@ -234,10 +371,19 @@ if (isset($_GET['edit'])) {
|---|