Cedric/mon-petit-cinema
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

all

Browse Source
This commit is contained in:
Cedric
2026-06-18 07:38:41 +02:00
parent ec815787ed
commit 2d4d139f9d
9 changed files with 1696 additions and 530 deletions
Download Patch File Download Diff File Expand all files Collapse all files
js/admin.js
+393 -1
View File
@@ -1,3 +1,4 @@
<<<<<<< HEAD
/**
* =========================================================================
* Mon Cinéma - Module d'Administration (admin.js)
@@ -279,4 +280,395 @@ function switchTab(tabName) {
if (targetBtn) targetBtn.classList.add('active');
localStorage.setItem('mon-cinema-active-tab', tabName);
}
}
=======
// ══════════════════════════════════════════════════════════════════
// admin.js — Backoffice Mon Cinéma
// Chargé UNIQUEMENT par dashboard.html
// ══════════════════════════════════════════════════════════════════
const API_URL = '../api.php';
let allItems = [];
let currentAdminTab = 'critique';
// ── Garde de session (dashboard uniquement) ──────────────────────
(function guardSession() {
if (!localStorage.getItem('token')) {
window.location.href = 'login.html';
}
})();
// ══════════════════════════════════════════════════════════════════
// 1. CHARGEMENT & RENDU
// ══════════════════════════════════════════════════════════════════
async function loadDashboardData() {
try {
const res = await fetch(`${API_URL}?action=get_films`);
allItems = await res.json();
// Vérifier si compte sécurisé
const secRes = await fetch(`${API_URL}?action=check_security_status`);
const secData = await secRes.json();
const banner = document.getElementById('security-banner');
if (banner) banner.style.display = secData.is_blank ? 'flex' : 'none';
renderAdminTable();
} catch (err) {
console.error('Erreur chargement :', err);
}
}
function switchAdminTab(tabName) {
currentAdminTab = tabName;
document.getElementById('btn-tab-critique').classList.toggle('active', tabName === 'critique');
document.getElementById('btn-tab-videotheque').classList.toggle('active', tabName === 'videotheque');
const importSection = document.getElementById('import-section');
if (importSection) importSection.style.display = tabName === 'critique' ? 'block' : 'none';
document.getElementById('admin-subtitle').textContent =
tabName === 'critique'
? 'Gestion de vos critiques de films'
: 'Gestion de votre stock physique de films';
document.getElementById('th-dynamic').textContent = tabName === 'critique' ? 'Note' : 'Format';
const selectAll = document.getElementById('select-all-checkbox');
if (selectAll) selectAll.checked = false;
renderAdminTable();
}
function renderAdminTable() {
const tbody = document.getElementById('admin-table-body');
const countLabel = document.getElementById('admin-count-label');
if (!tbody) return;
tbody.innerHTML = '';
const filtered = allItems.filter(item => item.type === currentAdminTab);
if (countLabel) {
countLabel.textContent = `${filtered.length} élément(s) dans cette catégorie`;
}
if (filtered.length === 0) {
tbody.innerHTML = `<tr><td colspan="7" style="text-align:center; color:var(--muted); padding:3rem;">
<i class="ti ti-folder-off" style="font-size:2rem; display:block; margin-bottom:0.5rem;"></i>
Aucun film trouvé dans cette liste.</td></tr>`;
updateBulkBarVisibility();
return;
}
filtered.forEach(f => {
const tr = document.createElement('tr');
const imgHTML = f.poster
? `<img src="${f.poster}" class="thumb" alt="${f.title}">`
: `<div class="thumb-ph"><i class="ti ti-photo-off"></i></div>`;
const dynamicCell = currentAdminTab === 'critique'
? `<span class="tbl-stars">${'★'.repeat(f.rating)}<span style="opacity:.25">${'☆'.repeat(5 - f.rating)}</span></span>`
: `<span class="badge-format">${f.format || 'Physique'}</span>`;
tr.innerHTML = `
<td style="text-align:center;">
<input type="checkbox" class="film-checkbox" value="${f.id}" onclick="updateBulkBarVisibility()">
</td>
<td style="text-align:center;">${imgHTML}</td>
<td><strong style="color:var(--text);">${f.title}</strong></td>
<td style="color:var(--text-secondary);">${f.year || '&mdash;'}</td>
<td style="color:var(--text-secondary); font-style:italic;">${f.director || 'Inconnu'}</td>
<td>${dynamicCell}</td>
<td style="text-align:center;">
<div class="tbl-actions">
<button onclick="openEditModal('${f.id}')" title="Modifier"><i class="ti ti-edit"></i></button>
<button class="del" onclick="deleteSingleFilm('${f.id}')" title="Supprimer"><i class="ti ti-trash"></i></button>
</div>
</td>`;
tbody.appendChild(tr);
});
updateBulkBarVisibility();
}
// ══════════════════════════════════════════════════════════════════
// 2. SÉLECTION EN MASSE
// ══════════════════════════════════════════════════════════════════
function toggleSelectAll(master) {
document.querySelectorAll('.film-checkbox').forEach(cb => cb.checked = master.checked);
updateBulkBarVisibility();
}
function updateBulkBarVisibility() {
const checked = document.querySelectorAll('.film-checkbox:checked');
const bulkBar = document.getElementById('bulk-actions-bar');
const bulkCount = document.getElementById('bulk-count');
const selectAll = document.getElementById('select-all-checkbox');
if (!bulkBar || !bulkCount) return;
if (checked.length > 0) {
bulkBar.style.display = 'flex';
bulkCount.textContent = checked.length;
} else {
bulkBar.style.display = 'none';
if (selectAll) selectAll.checked = false;
}
}
async function executeBulkDelete() {
const checked = document.querySelectorAll('.film-checkbox:checked');
const idsToDelete = Array.from(checked).map(cb => cb.value);
if (!idsToDelete.length) return;
if (!confirm(`Supprimer définitivement ces ${idsToDelete.length} élément(s) ?`)) return;
try {
const res = await fetch(`${API_URL}?action=delete_multiple_films&type=${currentAdminTab}`, {
method: 'DELETE',
headers: { 'Content-Type': 'application/json', 'Authorization': localStorage.getItem('token') },
body: JSON.stringify({ ids: idsToDelete })
});
const data = await res.json();
if (data.success) {
const selectAll = document.getElementById('select-all-checkbox');
if (selectAll) selectAll.checked = false;
loadDashboardData();
} else {
alert('Erreur suppression groupée : ' + data.error);
}
} catch (err) {
console.error('Bulk delete :', err);
}
}
// ══════════════════════════════════════════════════════════════════
// 3. SUPPRESSION UNITAIRE
// ══════════════════════════════════════════════════════════════════
async function deleteSingleFilm(id) {
if (!confirm('Supprimer définitivement cette œuvre ?')) return;
try {
const res = await fetch(`${API_URL}?action=delete_film&id=${id}&type=${currentAdminTab}`, {
method: 'DELETE',
headers: { 'Authorization': localStorage.getItem('token') }
});
const data = await res.json();
if (data.success) loadDashboardData();
} catch (err) {
console.error(err);
}
}
// ══════════════════════════════════════════════════════════════════
// 4. MODALES FILM (ouvrir / fermer / remplir)
// ══════════════════════════════════════════════════════════════════
function openAddModal() {
document.getElementById('film-form').reset();
document.getElementById('f-id').value = '';
document.getElementById('modal-form-title').textContent =
currentAdminTab === 'critique' ? 'Rédiger une Critique' : 'Ajouter un film physique';
document.getElementById('form-critique-fields').style.display = currentAdminTab === 'critique' ? 'block' : 'none';
document.getElementById('form-videotheque-fields').style.display = currentAdminTab === 'videotheque' ? 'block' : 'none';
document.getElementById('admin-modal').classList.add('open');
}
function openEditModal(id) {
const item = allItems.find(x => String(x.id) === String(id));
if (!item) return;
openAddModal();
document.getElementById('modal-form-title').textContent = "Modifier l'œuvre";
document.getElementById('f-id').value = item.id;
document.getElementById('f-title').value = item.title || '';
document.getElementById('f-year').value = item.year || '';
document.getElementById('f-director').value = item.director || '';
document.getElementById('f-poster').value = item.poster || '';
if (currentAdminTab === 'critique') {
document.getElementById('f-rating').value = item.rating || 3;
document.getElementById('f-review').value = item.review || '';
document.getElementById('f-streaming').value = item.streaming || '';
} else {
document.getElementById('f-format').value = item.format || '';
document.getElementById('f-length').value = item.length || '';
document.getElementById('f-publisher').value = item.publisher || '';
document.getElementById('f-aspect').value = item.aspect_ratio || '';
document.getElementById('f-ean').value = item.ean_isbn13 || '';
document.getElementById('f-discs').value = item.number_of_discs || 1;
document.getElementById('f-description').value = item.description || '';
}
}
function closeAdminModal() {
document.getElementById('admin-modal').classList.remove('open');
}
// ══════════════════════════════════════════════════════════════════
// 5. SAUVEGARDE FORMULAIRE FILM
// ══════════════════════════════════════════════════════════════════
async function saveFilmForm(e) {
e.preventDefault();
const payload = {
type: currentAdminTab,
id: document.getElementById('f-id').value || null,
title: document.getElementById('f-title').value,
year: document.getElementById('f-year').value,
director: document.getElementById('f-director').value,
poster: document.getElementById('f-poster').value
};
if (currentAdminTab === 'critique') {
payload.rating = parseInt(document.getElementById('f-rating').value);
payload.review = document.getElementById('f-review').value;
payload.streaming = document.getElementById('f-streaming').value;
} else {
payload.format = document.getElementById('f-format').value;
payload.length = document.getElementById('f-length').value;
payload.publisher = document.getElementById('f-publisher').value;
payload.aspect_ratio = document.getElementById('f-aspect').value;
payload.ean_isbn13 = document.getElementById('f-ean').value;
payload.number_of_discs = document.getElementById('f-discs').value;
payload.description = document.getElementById('f-description').value;
}
try {
const res = await fetch(`${API_URL}?action=save_film`, {
method: 'POST',
headers: { 'Content-Type': 'application/json', 'Authorization': localStorage.getItem('token') },
body: JSON.stringify(payload)
});
const data = await res.json();
if (data.success) {
closeAdminModal();
loadDashboardData();
} else {
alert('Erreur lors de l\'enregistrement.');
}
} catch (err) {
console.error('Erreur save :', err);
}
}
// ══════════════════════════════════════════════════════════════════
// 6. IMPORT CSV (Letterboxd)
// ══════════════════════════════════════════════════════════════════
async function handleCsvUpload(input) {
if (!input.files || input.files.length === 0) return;
const formData = new FormData();
formData.append('csv_file', input.files[0]);
try {
const res = await fetch(`${API_URL}?action=import_csv`, {
method: 'POST',
headers: { 'Authorization': localStorage.getItem('token') },
body: formData
});
const data = await res.json();
if (data.success) {
alert(`✅ Import réussi ! ${data.imported} films ajoutés ou mis à jour.`);
loadDashboardData();
} else {
alert('❌ Erreur import : ' + (data.error || 'Erreur inconnue'));
}
} catch (err) {
console.error('Erreur Import CSV :', err);
alert('Impossible d\'importer le fichier.');
} finally {
input.value = '';
}
}
// ══════════════════════════════════════════════════════════════════
// 7. MODALE TMDB
// ══════════════════════════════════════════════════════════════════
function openConfigModal() { document.getElementById('config-modal').classList.add('open'); }
function closeConfigModal() { document.getElementById('config-modal').classList.remove('open'); }
async function saveTmdbKey() {
const key = document.getElementById('tmdb-key-input').value.trim();
if (!key) { alert('Veuillez saisir une clé.'); return; }
try {
const res = await fetch(`${API_URL}?action=save_tmdb_key`, {
method: 'POST',
headers: { 'Content-Type': 'application/json', 'Authorization': localStorage.getItem('token') },
body: JSON.stringify({ tmdb_key: key })
});
const data = await res.json();
if (data.success) {
alert('✅ Clé TMDB chiffrée et sauvegardée.');
document.getElementById('tmdb-key-input').value = '';
closeConfigModal();
}
} catch (err) {
console.error(err);
}
}
// ══════════════════════════════════════════════════════════════════
// 8. MODALE MOT DE PASSE
// ══════════════════════════════════════════════════════════════════
function openPasswordModal() { document.getElementById('password-modal').classList.add('open'); }
function closePasswordModal() { document.getElementById('password-modal').classList.remove('open'); }
async function saveNewPassword() {
const pwd1 = document.getElementById('new-password-input').value;
const pwd2 = document.getElementById('new-password-confirm').value;
const errEl = document.getElementById('pwd-error');
errEl.style.display = 'none';
if (pwd1.length < 4) {
errEl.textContent = 'Le mot de passe doit faire au moins 4 caractères.';
errEl.style.display = 'block';
return;
}
if (pwd1 !== pwd2) {
errEl.textContent = 'Les mots de passe ne correspondent pas.';
errEl.style.display = 'block';
return;
}
try {
// Premier usage (compte vide) → setup_admin, sinon update_password
const secRes = await fetch(`${API_URL}?action=check_security_status`);
const secData = await secRes.json();
const action = secData.is_blank ? 'setup_admin' : 'update_password';
const res = await fetch(`${API_URL}?action=${action}`, {
method: 'POST',
headers: { 'Content-Type': 'application/json', 'Authorization': localStorage.getItem('token') },
body: JSON.stringify({ password: pwd1, new_password: pwd1 })
});
const data = await res.json();
if (data.success || data.success === '') {
alert('✅ Mot de passe mis à jour. Vous allez être redirigé vers la connexion.');
localStorage.removeItem('token');
window.location.href = 'login.html';
}
} catch (err) {
console.error(err);
}
}
// ══════════════════════════════════════════════════════════════════
// 9. DÉCONNEXION
// ══════════════════════════════════════════════════════════════════
function logout() {
localStorage.removeItem('token');
window.location.href = 'login.html';
}
// ══════════════════════════════════════════════════════════════════
// INIT
// ══════════════════════════════════════════════════════════════════
document.addEventListener('DOMContentLoaded', loadDashboardData);
>>>>>>> 5a22e3f (all)
js/public.js
+101 -178
View File
@@ -1,45 +1,50 @@
const STORAGE_KEY = 'mon-cinema-films';
let films = JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]');
let films = [];
const API_URL = '../api.php';
let currentPubTab = 'critique';
let activeRatingFilter = 0; // 0 = tous
let activeRatingFilter = 0;
async function loadPublicData() {
try {
const response = await fetch(`${API_URL}?action=get_films`);
films = await response.json();
renderPublicGrid();
} catch (error) {
console.error("Erreur de récupération :", error);
}
}
function switchPubTab(tabName) {
currentPubTab = tabName;
activeRatingFilter = 0;
const filterBar = document.getElementById('rating-filter-bar');
if(filterBar) {
filterBar.style.display = (tabName === 'critique') ? 'flex' : 'none';
}
document.querySelectorAll('.rating-filter-btn').forEach(btn => {
btn.classList.remove('active');
btn.querySelectorAll('.rf-star').forEach(s => s.classList.remove('filled'));
});
const tabCritiques = document.getElementById('tab-pub-critiques');
const tabVideotheque = document.getElementById('tab-pub-videotheque');
if (tabCritiques && tabVideotheque) {
if (tabName === 'critique') {
tabCritiques.classList.add('active');
tabVideotheque.classList.remove('active');
} else {
tabVideotheque.classList.add('active');
tabCritiques.classList.remove('active');
}
}
document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));
const activeBtn = document.getElementById(`tab-pub-${tabName}s`);
if(activeBtn) activeBtn.classList.add('active');
renderPublicGrid();
}
function filterByRating(stars) {
if (currentPubTab !== 'critique') return;
activeRatingFilter = (activeRatingFilter === stars) ? 0 : stars;
// Update button states
document.querySelectorAll('.rating-filter-btn').forEach(btn => {
const n = parseInt(btn.dataset.stars);
btn.classList.toggle('active', n === activeRatingFilter);
// Highlight filled stars up to active filter
btn.querySelectorAll('.rf-star').forEach((s, i) => {
s.classList.toggle('filled', activeRatingFilter > 0 && i < activeRatingFilter);
s.classList.toggle('filled', i < activeRatingFilter);
});
});
renderPublicGrid();
}
@@ -47,205 +52,126 @@ function renderPublicGrid() {
const grid = document.getElementById('grid');
const emptyState = document.getElementById('empty-state');
const countLabel = document.getElementById('count-label');
if (!grid) return;
// Show rating filter only on critique tab
const filterBar = document.getElementById('rating-filter-bar');
if (filterBar) filterBar.style.display = currentPubTab === 'critique' ? 'flex' : 'none';
grid.innerHTML = '';
const filtered = films.filter(f => {
const fType = f.type || 'critique';
if (fType !== currentPubTab) return false;
if (currentPubTab === 'critique' && activeRatingFilter > 0) {
return (f.rating || f.note || 1) === activeRatingFilter;
}
return true;
});
let filtered = films.filter(f => f.type === currentPubTab);
if (currentPubTab === 'critique' && activeRatingFilter > 0) {
filtered = filtered.filter(f => parseInt(f.rating) === activeRatingFilter);
}
if (countLabel) {
if (currentPubTab === 'critique') {
const suffix = activeRatingFilter > 0 ? ` · filtrées ${activeRatingFilter}★` : '';
countLabel.textContent = filtered.length + (filtered.length > 1 ? ' critiques' : ' critique') + suffix;
} else {
countLabel.textContent = filtered.length + (filtered.length > 1 ? ' films physiques' : ' film physique');
}
countLabel.textContent = `${filtered.length} ${currentPubTab === 'critique' ? 'critique' : 'œuvre'}${filtered.length > 1 ? 's' : ''}`;
}
if (filtered.length === 0) {
grid.innerHTML = '';
if (emptyState) {
emptyState.style.display = 'block';
emptyState.querySelector('p').textContent = currentPubTab === 'critique'
? "Aucune critique pour l'instant."
: "Aucun film dans la vidéothèque pour l'instant.";
}
if (emptyState) emptyState.style.display = 'block';
return;
}
if (emptyState) emptyState.style.display = 'none';
grid.innerHTML = filtered.map(f => {
const posterUrl = f.poster || f.image || f.affiche || '';
const movieTitle = f.title || f.titre || 'Sans titre';
const movieYear = f.year || f.annee || f.publish_date || '—';
const movieDirector = f.director || f.creators || f.realisateur || '—';
filtered.forEach(f => {
const card = document.createElement('div');
card.className = 'card';
card.onclick = () => openDetail(f.id);
const posterHtml = posterUrl
? `<img src="${posterUrl}" alt="Affiche ${movieTitle}" class="card-poster">`
: `<div class="card-poster-placeholder">
<i class="ti ti-movie"></i>
<span>${movieTitle}</span>
</div>`;
let footerInfoHtml = '';
if (currentPubTab === 'critique') {
const rating = f.rating || f.note || 1;
footerInfoHtml = `<div class="card-stars">${"★".repeat(rating)}<span class="stars-muted">${"☆".repeat(5 - rating)}</span></div>`;
// Rendu de l'affiche ou du placeholder si absente
let posterHTML = '';
if (f.poster) {
posterHTML = `<div class="card-poster-wrap"><img class="card-poster" src="${f.poster}" alt="${f.title}" loading="lazy"></div>`;
} else {
const format = (f.format || f.support || 'DVD').toUpperCase().replace('_4K', ' 4K');
const length = f.length || f.duree || '';
footerInfoHtml = `
<div class="card-video-footer">
<span class="badge-format">${format}</span>
${length ? `<span class="video-length"><i class="ti ti-clock"></i> ${length} min</span>` : ''}
posterHTML = `
<div class="card-poster-wrap">
<div class="card-poster-placeholder">
<i class="ti ti-movie"></i>
<span>Pas d'affiche</span>
</div>
</div>`;
}
return `
<div class="card" onclick="openDetail(${f.id})">
<div class="card-poster-wrap">
${posterHtml}
</div>
if (f.type === 'critique') {
const starsHTML = '★'.repeat(f.rating) + `<span class="stars-muted">${'☆'.repeat(5 - f.rating)}</span>`;
card.innerHTML = `
${posterHTML}
<div class="card-body">
<h3 class="card-title">${movieTitle}</h3>
<div class="card-meta">${movieYear.toString().substring(0,4)} &middot; ${movieDirector}</div>
${footerInfoHtml}
<h3 class="card-title" title="${f.title}">${f.title}</h3>
<p class="card-meta">${f.year ? f.year + ' &middot; ' : ''}${f.director || 'Réalisateur inconnu'}</p>
<div class="card-stars">${starsHTML}</div>
</div>
</div>
`;
}).join('');
`;
} else {
card.innerHTML = `
${posterHTML}
<div class="card-body">
<h3 class="card-title" title="${f.title}">${f.title}</h3>
<p class="card-meta">${f.year ? f.year + ' &middot; ' : ''}${f.director || 'Réalisateur inconnu'}</p>
<div class="card-video-footer">
<span class="badge-format">${f.format || 'Physique'}</span>
${f.length ? `<span class="video-length"><i class="ti ti-clock"></i> ${f.length} min</span>` : ''}
</div>
</div>
`;
}
grid.appendChild(card);
});
}
function openDetail(id) {
const f = films.find(x => x.id === id);
const f = films.find(item => item.id == id);
if (!f) return;
const detailOverlay = document.getElementById('detail-overlay');
const modalLayout = document.getElementById('detail-modal-layout');
const dPoster = document.getElementById('d-poster');
const dPosterWrap = document.getElementById('d-poster-wrap');
const dTitle = document.getElementById('d-title');
const dMeta = document.getElementById('d-meta');
const dStars = document.getElementById('d-stars');
const dReview = document.getElementById('d-review');
const dBody = document.getElementById('d-body');
const detailModalLayout = document.getElementById('detail-modal-layout');
const detailOverlay = document.getElementById('detail-overlay');
const movieTitle = f.title || f.titre || 'Sans titre';
const movieYear = f.year || f.annee || f.publish_date || '—';
const movieDirector = f.director || f.creators || f.realisateur || '—';
const posterUrl = f.poster || f.image || f.affiche || '';
if (dTitle) dTitle.textContent = movieTitle;
if (dMeta) dMeta.textContent = [movieYear.toString().substring(0,4), movieDirector].filter(Boolean).join(' · ');
const fType = f.type || 'critique';
// Gestion de l'affichage de la colonne image
if (posterUrl) {
if (dPoster) { dPoster.src = posterUrl; dPoster.style.display = 'block'; }
// Gestion de la visibilité globale de l'affiche dans la modale
if (f.poster) {
if (dPoster) dPoster.src = f.poster;
if (dPosterWrap) {
dPosterWrap.style.display = 'block';
dPosterWrap.classList.remove('poster-critique', 'poster-video');
dPosterWrap.classList.add(fType === 'critique' ? 'poster-critique' : 'poster-video');
dPosterWrap.className = `detail-poster poster-${f.type}`;
}
if (modalLayout) modalLayout.classList.remove('no-poster');
if (detailModalLayout) detailModalLayout.classList.remove('no-poster');
} else {
if (dPoster) dPoster.style.display = 'none';
if (dPosterWrap) dPosterWrap.style.display = 'none';
if (modalLayout) modalLayout.classList.add('no-poster');
if (detailModalLayout) detailModalLayout.classList.add('no-poster');
}
// Préparation du badge de visionnage/streaming (commun aux deux types de fiches)
const streamingInfo = f.streaming || "Disponible au cinéma ou support physique";
const isPlatform = streamingInfo !== "Disponible au cinéma ou support physique";
const streamIcon = isPlatform ? "ti-device-tv" : "ti-movie";
const streamingBadgeHtml = `
<div style="margin-bottom: 1.2rem; display: inline-flex; align-items: center; gap: 0.5rem; background: ${isPlatform ? 'rgba(201, 168, 76, 0.1)' : 'rgba(255,255,255,0.03)'}; border: 1px solid ${isPlatform ? 'var(--gold)' : 'var(--border)'}; padding: 0.4rem 0.8rem; border-radius: 6px; font-size: 0.85rem; color: ${isPlatform ? 'var(--gold)' : '#c0c0cc'}; font-weight: 500;">
<i class="ti ${streamIcon}" style="font-size: 1.1rem;"></i>
<span>${streamingInfo}</span>
</div>
`;
if (fType === 'critique') {
// ----------------------------------------
// POP-UP MODE : CRITIQUE JOURNAL
// ----------------------------------------
if (dStars) {
dStars.style.display = 'block';
const rating = f.rating || f.note || 1;
dStars.innerHTML = "★".repeat(rating) + `<span class="stars-muted">${"☆".repeat(5 - rating)}</span>`;
}
if (dReview) {
const reviewText = f.review || f.critique || "Aucune critique rédigée pour ce film.";
dReview.innerHTML = `
${streamingBadgeHtml}
if (dTitle) dTitle.textContent = f.title;
if (dMeta) dMeta.textContent = `${f.year ? f.year + ' | ' : ''}${f.director || 'Réalisateur inconnu'}`;
if (dBody) {
if (f.type === 'critique') {
const stars = '★'.repeat(f.rating) + `<span class="stars-muted">${'☆'.repeat(5 - f.rating)}</span>`;
dBody.innerHTML = `
<div class="detail-stars">${stars}</div>
<div class="pub-review-card">
<div class="pub-review-quote-icon"><i class="ti ti-quote"></i></div>
<p class="pub-review-text">${reviewText}</p>
<p class="pub-review-text">${f.review ? f.review : 'Aucun texte rédigé pour le moment.'}</p>
</div>
${f.streaming ? `<div class="tech-pill" style="margin-top:1.5rem; width:fit-content;"><i class="ti ti-device-tv"></i> Visionnage : ${f.streaming}</div>` : ''}
`;
}
} else {
// ----------------------------------------
// POP-UP MODE : VIDEOTHEQUE PREMIUM
// ----------------------------------------
if (dStars) dStars.style.display = 'none';
const format = (f.format || f.support || 'DVD').toUpperCase().replace('_4K', ' 4K');
const publisher = f.publisher || f.editeur || '';
const length = f.length || f.duree || '';
const discs = f.number_of_discs || f.disques || f.nb_disques || '';
const ratio = f.aspect_ratio || f.format_image || '';
const ean = f.ean_isbn13 || f.ean || '';
const description = f.description || f.synopsis || "Aucun synopsis disponible dans le catalogue.";
if (dReview) {
dReview.innerHTML = `
${streamingBadgeHtml}
} else {
dBody.innerHTML = `
<div class="pub-tech-badges">
<span class="tech-pill format-gold"><i class="ti ti-disc"></i> ${format}</span>
${length ? `<span class="tech-pill"><i class="ti ti-clock"></i> ${length} Min</span>` : ''}
${discs ? `<span class="tech-pill"><i class="ti ti-layers-intersect"></i> ${discs} ${discs > 1 ? 'Disques' : 'Disque'}</span>` : ''}
${f.format ? `<span class="tech-pill format-gold"><i class="ti ti-disc"></i> ${f.format}</span>` : ''}
${f.length ? `<span class="tech-pill"><i class="ti ti-clock"></i> ${f.length} Min</span>` : ''}
${f.number_of_discs ? `<span class="tech-pill"><i class="ti ti-layers-intersect"></i> ${f.number_of_discs} Disque(s)</span>` : ''}
</div>
<div class="pub-tech-grid">
${publisher ? `
<div class="tech-meta-item">
<span class="tech-meta-label">Éditeur / Studio</span>
<span class="tech-meta-value">${publisher}</span>
</div>` : ''}
${ratio ? `
<div class="tech-meta-item">
<span class="tech-meta-label">Format d'image</span>
<span class="tech-meta-value" style="font-family: monospace;">${ratio}</span>
</div>` : ''}
${ean ? `
<div class="tech-meta-item" style="grid-column: span 2;">
<span class="tech-meta-label">Code-barres (EAN)</span>
<span class="tech-meta-value" style="font-family: monospace; color: var(--muted);">${ean}</span>
</div>` : ''}
<div class="tech-meta-item"><span class="tech-meta-label">Éditeur</span><span class="tech-meta-value">${f.publisher || '&mdash;'}</span></div>
<div class="tech-meta-item"><span class="tech-meta-label">Format Image</span><span class="tech-meta-value">${f.aspect_ratio || '&mdash;'}</span></div>
<div class="tech-meta-item" style="grid-column: span 2;"><span class="tech-meta-label">Code Barre (EAN)</span><span class="tech-meta-value">${f.ean_isbn13 || '&mdash;'}</span></div>
</div>
<div class="pub-synopsis-box">
<h4>Synopsis</h4>
<p>${description}</p>
<h4>Synopsis / Notes</h4>
<p>${f.description ? f.description : 'Aucune description fournie.'}</p>
</div>
`;
}
@@ -253,13 +179,10 @@ function openDetail(id) {
if (detailOverlay) detailOverlay.classList.add('open');
}
function closeDetail() {
const detailOverlay = document.getElementById('detail-overlay');
if (detailOverlay) {
detailOverlay.classList.remove('open');
}
if (detailOverlay) detailOverlay.classList.remove('open');
}
document.addEventListener('DOMContentLoaded', () => {
renderPublicGrid();
});
document.addEventListener('DOMContentLoaded', loadPublicData);