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

Actualiser js/public.js

Browse Source
This commit is contained in:
Cedric
2026-06-18 14:03:05 +02:00
parent 839c7536bc
commit 854e2f8fa3
1 changed files with 146 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files
js/public.js
+19 -31
View File
@@ -16,28 +16,22 @@ async function loadPublicData() {
function switchPubTab(tabName) { function switchPubTab(tabName) {
currentPubTab = tabName; currentPubTab = tabName;
activeRatingFilter = 0; activeRatingFilter = 0;
const filterBar = document.getElementById('rating-filter-bar'); const filterBar = document.getElementById('rating-filter-bar');
if(filterBar) { if(filterBar) filterBar.style.display = (tabName === 'critique') ? 'flex' : 'none';
filterBar.style.display = (tabName === 'critique') ? 'flex' : 'none';
}
document.querySelectorAll('.rating-filter-btn').forEach(btn => { document.querySelectorAll('.rating-filter-btn').forEach(btn => {
btn.classList.remove('active'); btn.classList.remove('active');
btn.querySelectorAll('.rf-star').forEach(s => s.classList.remove('filled')); btn.querySelectorAll('.rf-star').forEach(s => s.classList.remove('filled'));
}); });
document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active')); document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));
const activeBtn = document.getElementById(`tab-pub-${tabName}s`); const activeBtn = document.getElementById(`tab-pub-${tabName}s`);
if(activeBtn) activeBtn.classList.add('active'); if(activeBtn) activeBtn.classList.add('active');
renderPublicGrid(); renderPublicGrid();
} }
function filterByRating(stars) { function filterByRating(stars) {
if (currentPubTab !== 'critique') return; if (currentPubTab !== 'critique') return;
activeRatingFilter = (activeRatingFilter === stars) ? 0 : stars; activeRatingFilter = (activeRatingFilter === stars) ? 0 : stars;
document.querySelectorAll('.rating-filter-btn').forEach(btn => { document.querySelectorAll('.rating-filter-btn').forEach(btn => {
const n = parseInt(btn.dataset.stars); const n = parseInt(btn.dataset.stars);
btn.classList.toggle('active', n === activeRatingFilter); btn.classList.toggle('active', n === activeRatingFilter);
@@ -53,11 +47,9 @@ function renderPublicGrid() {
const emptyState = document.getElementById('empty-state'); const emptyState = document.getElementById('empty-state');
const countLabel = document.getElementById('count-label'); const countLabel = document.getElementById('count-label');
if (!grid) return; if (!grid) return;
grid.innerHTML = ''; grid.innerHTML = '';
let filtered = films.filter(f => f.type === currentPubTab); let filtered = films.filter(f => f.type === currentPubTab);
if (currentPubTab === 'critique' && activeRatingFilter > 0) { if (currentPubTab === 'critique' && activeRatingFilter > 0) {
filtered = filtered.filter(f => parseInt(f.rating) === activeRatingFilter); filtered = filtered.filter(f => parseInt(f.rating) === activeRatingFilter);
} }
@@ -77,19 +69,9 @@ function renderPublicGrid() {
card.className = 'card'; card.className = 'card';
card.onclick = () => openDetail(f.id); card.onclick = () => openDetail(f.id);
// Rendu de l'affiche ou du placeholder si absente let posterHTML = f.poster
let posterHTML = ''; ? `<div class="card-poster-wrap"><img class="card-poster" src="${f.poster}" alt="${f.title}" loading="lazy"></div>`
if (f.poster) { : `<div class="card-poster-wrap"><div class="card-poster-placeholder"><i class="ti ti-movie"></i><span>Pas d'affiche</span></div></div>`;
posterHTML = `<div class="card-poster-wrap"><img class="card-poster" src="${f.poster}" alt="${f.title}" loading="lazy"></div>`;
} else {
posterHTML = `
<div class="card-poster-wrap">
<div class="card-poster-placeholder">
<i class="ti ti-movie"></i>
<span>Pas d'affiche</span>
</div>
</div>`;
}
if (f.type === 'critique') { if (f.type === 'critique') {
const starsHTML = '★'.repeat(f.rating) + `<span class="stars-muted">${'☆'.repeat(5 - f.rating)}</span>`; const starsHTML = '★'.repeat(f.rating) + `<span class="stars-muted">${'☆'.repeat(5 - f.rating)}</span>`;
@@ -99,8 +81,7 @@ function renderPublicGrid() {
<h3 class="card-title" title="${f.title}">${f.title}</h3> <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> <p class="card-meta">${f.year ? f.year + ' &middot; ' : ''}${f.director || 'Réalisateur inconnu'}</p>
<div class="card-stars">${starsHTML}</div> <div class="card-stars">${starsHTML}</div>
</div> </div>`;
`;
} else { } else {
card.innerHTML = ` card.innerHTML = `
${posterHTML} ${posterHTML}
@@ -111,8 +92,7 @@ function renderPublicGrid() {
<span class="badge-format">${f.format || 'Physique'}</span> <span class="badge-format">${f.format || 'Physique'}</span>
${f.length ? `<span class="video-length"><i class="ti ti-clock"></i> ${f.length} min</span>` : ''} ${f.length ? `<span class="video-length"><i class="ti ti-clock"></i> ${f.length} min</span>` : ''}
</div> </div>
</div> </div>`;
`;
} }
grid.appendChild(card); grid.appendChild(card);
}); });
@@ -130,7 +110,6 @@ function openDetail(id) {
const detailModalLayout = document.getElementById('detail-modal-layout'); const detailModalLayout = document.getElementById('detail-modal-layout');
const detailOverlay = document.getElementById('detail-overlay'); const detailOverlay = document.getElementById('detail-overlay');
// Gestion de la visibilité globale de l'affiche dans la modale
if (f.poster) { if (f.poster) {
if (dPoster) dPoster.src = f.poster; if (dPoster) dPoster.src = f.poster;
if (dPosterWrap) { if (dPosterWrap) {
@@ -147,6 +126,7 @@ function openDetail(id) {
if (dMeta) dMeta.textContent = `${f.year ? f.year + ' | ' : ''}${f.director || 'Réalisateur inconnu'}`; if (dMeta) dMeta.textContent = `${f.year ? f.year + ' | ' : ''}${f.director || 'Réalisateur inconnu'}`;
if (dBody) { if (dBody) {
// BUG CORRIGÉ : Réécriture complète des template literals qui étaient syntaxiquement cassés
if (f.type === 'critique') { if (f.type === 'critique') {
const stars = '★'.repeat(f.rating) + `<span class="stars-muted">${'☆'.repeat(5 - f.rating)}</span>`; const stars = '★'.repeat(f.rating) + `<span class="stars-muted">${'☆'.repeat(5 - f.rating)}</span>`;
dBody.innerHTML = ` dBody.innerHTML = `
@@ -165,9 +145,18 @@ function openDetail(id) {
${f.number_of_discs ? `<span class="tech-pill"><i class="ti ti-layers-intersect"></i> ${f.number_of_discs} Disque(s)</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>
<div class="pub-tech-grid"> <div class="pub-tech-grid">
<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">
<div class="tech-meta-item"><span class="tech-meta-label">Format Image</span><span class="tech-meta-value">${f.aspect_ratio || '&mdash;'}</span></div> <span class="tech-meta-label">Éditeur</span>
<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> <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>
<div class="pub-synopsis-box"> <div class="pub-synopsis-box">
<h4>Synopsis / Notes</h4> <h4>Synopsis / Notes</h4>
@@ -176,7 +165,6 @@ function openDetail(id) {
`; `;
} }
} }
if (detailOverlay) detailOverlay.classList.add('open'); if (detailOverlay) detailOverlay.classList.add('open');
} }