Compare commits

..

No commits in common. "main" and "v0.0.7" have entirely different histories.
main ... v0.0.7

6 changed files with 119 additions and 199 deletions

View File

@ -12,7 +12,7 @@
"localstorage": {} "localstorage": {}
}, },
"manifestVersion": 2, "manifestVersion": 2,
"website": "https://cinekids.info", "website": "https://zoemp.be/cine-kids",
"contactEmail": "morgan@zoemp.be", "contactEmail": "morgan@zoemp.be",
"icon": "file://logo.png", "icon": "file://logo.png",
"tags": [ "tags": [

View File

@ -1 +1 @@
0.0.9 0.0.6

View File

@ -36,4 +36,3 @@ echo "Version bumped to $NEW_VERSION"
git add VERSION git add VERSION
git tag "v$MAJOR.$MINOR.$PATCH" git tag "v$MAJOR.$MINOR.$PATCH"
git push origin "v$MAJOR.$MINOR.$PATCH" git push origin "v$MAJOR.$MINOR.$PATCH"
git push origin --tags

Binary file not shown.

Before

Width:  |  Height:  |  Size: 462 KiB

After

Width:  |  Height:  |  Size: 71 KiB

View File

@ -72,17 +72,6 @@ function mergeResults(arrays, query = '', limit = 5) {
if (query) { if (query) {
out.forEach(f => f.__score = getMatchScore(f, query)); out.forEach(f => f.__score = getMatchScore(f, query));
out = out.sort((a, b) => b.__score - a.__score); out = out.sort((a, b) => b.__score - a.__score);
// PATCH: filter only films with ALL significant query words in title
const normQuery = query.trim().toLowerCase();
const skip = new Set(['the','le','la','les','de','du','des','and','et','a','an','un','une','dans','en','on']);
const queryWords = normQuery.split(/\s+/).filter(w => w.length > 3 && !skip.has(w));
if (queryWords.length) {
out = out.filter(film => {
const title = (film.title || '').toLowerCase();
return queryWords.every(qw => title.includes(qw));
});
}
} }
// Remove internals, trim to limit // Remove internals, trim to limit
return out.slice(0, limit).map(f => { return out.slice(0, limit).map(f => {

View File

@ -2,8 +2,7 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <title>Agrégateur Multi-Source</title>
<title>CineKids: Recommandations d'âge requis pour films et séries tv :-)</title>
<style> <style>
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: #1a1a1a; color: #e0e0e0; margin: 0; padding: 20px; font-size: 14px; } body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: #1a1a1a; color: #e0e0e0; margin: 0; padding: 20px; font-size: 14px; }
.container { max-width: 1200px; margin: auto; } .container { max-width: 1200px; margin: auto; }
@ -36,62 +35,12 @@
min-width:2.5em;display:inline-block;letter-spacing:0.05em; min-width:2.5em;display:inline-block;letter-spacing:0.05em;
margin-left:10px;transition:background 0.2s; margin-left:10px;transition:background 0.2s;
} }
@media (max-width: 800px) {
.searchbox {
flex-direction: column;
align-items: stretch;
}
.searchbox input[type="text"] {
width: 100%;
margin-bottom: 10px;
}
.searchbox button {
margin-left: 0;
margin-bottom: 10px;
}
.maxagebox {
margin-left: 0;
margin-top: 10px;
justify-content: center;
}
.results-table,
.results-table tbody,
.results-table tr,
.results-table td {
display: block;
width: 100% !important;
}
.results-table thead {
display: none;
}
.results-table tr {
margin-bottom: 20px;
border-bottom: 1px solid #333;
}
.results-table td {
border: none;
padding: 10px 0;
text-align: left;
}
.results-table td:first-child div {
font-size: 1.2em;
margin-bottom: 10px;
}
.results-table img,
.source-block img {
width: 100% !important;
height: auto !important;
display: block;
margin: 10px 0 !important;
float: none !important;
}
}
</style> </style>
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<img src="/logo.png" alt="Logo CineKids" style="display:block;margin:30px auto 10px;max-width:130px;height:auto;"> <img src="/logo.png" alt="Logo Cine Kids" style="display:block;margin:30px auto 10px;max-width:130px;height:auto;">
<h1>CinéKids - Recommandations d'âge requis pour films et séries tv</h1> <h1>Ciné-agrégateur Multi-Source</h1>
<div class="searchbox"> <div class="searchbox">
<input type="text" id="q" placeholder="Ex: Dune, Spider-Man, Oppenheimer..." /> <input type="text" id="q" placeholder="Ex: Dune, Spider-Man, Oppenheimer..." />
<button onclick="search()">Rechercher</button> <button onclick="search()">Rechercher</button>
@ -174,23 +123,13 @@
badge.textContent = val + '+'; badge.textContent = val + '+';
badge.style.background = getAgeColor(val); badge.style.background = getAgeColor(val);
} }
let lastQuery = ''; async function search() {
let lastResults = [];
async function search(force = false) {
const query = document.getElementById('q').value.trim(); const query = document.getElementById('q').value.trim();
if (!query) return; if (!query) return;
const maxAge = parseInt(document.getElementById('maxAge').value, 10); const maxAge = parseInt(document.getElementById('maxAge').value, 10);
window.history.replaceState({}, '', '?q=' + encodeURIComponent(query) + (maxAge < 21 ? `&maxAge=${maxAge}` : '')); window.history.replaceState({}, '', '?q=' + encodeURIComponent(query) + (maxAge < 21 ? `&maxAge=${maxAge}` : ''));
const filmsDiv = document.getElementById('films'); const filmsDiv = document.getElementById('films');
filmsDiv.innerHTML = '<p class="loader">Searching...</p>'; filmsDiv.innerHTML = '<p class="loader">Searching...</p>';
// Si on a déjà cherché ce terme, et pas force, on ne refait pas le fetch
if (!force && lastQuery === query && lastResults.length) {
renderFilms(filterFilmsByMaxAge(lastResults, maxAge));
return;
}
try { try {
const base = window.location.origin; const base = window.location.origin;
const response = await fetch(`${base}/search?q=${encodeURIComponent(query)}`); const response = await fetch(`${base}/search?q=${encodeURIComponent(query)}`);
@ -199,8 +138,16 @@
return; return;
} }
let films = await response.json(); let films = await response.json();
if (!Array.isArray(films) || !films.length) {
filmsDiv.innerHTML = '<p class="no-results">No results. Try another query.</p>';
return;
}
// Filtres sources inutiles (pas de description et/ou pas d'âge)
films = films.map(film => { films = films.map(film => {
film.results = film.results.filter(r => { film.results = film.results.filter(r => {
// On considère valide si :
// - summary ou parentsNeedToKnow ou details.summary >= 8 chars
// - ET un âge existe (age, normalizedMarks, marks, details.ageLegal, etc)
let hasDescription = let hasDescription =
(r.summary && r.summary.length >= 8) || (r.summary && r.summary.length >= 8) ||
(r.parentsNeedToKnow && r.parentsNeedToKnow.length >= 8) || (r.parentsNeedToKnow && r.parentsNeedToKnow.length >= 8) ||
@ -212,132 +159,118 @@
return film; return film;
}).filter(film => film.results.length > 0); }).filter(film => film.results.length > 0);
lastQuery = query; if (isFinite(maxAge)) {
lastResults = films; films = films.filter(film => {
renderFilms(filterFilmsByMaxAge(films, maxAge)); const uniqueResults = [];
const seenSources = new Set();
film.results.forEach(r => {
if (!seenSources.has(r.source)) {
uniqueResults.push(r);
seenSources.add(r.source);
}
});
const ages = getAllAges(uniqueResults);
if (ages.length === 0) return true;
return Math.max(...ages) <= maxAge;
});
}
if (!films.length) {
filmsDiv.innerHTML = '<p class="no-results">No results for this max age.</p>';
return;
}
let html = `<table class="results-table">
<thead>
<tr>
<th>Title</th>
<th>Year</th>
<th>Information sources</th>
</tr>
</thead>
<tbody>`;
films.forEach(film => {
const allImgs = film.results.map(r => r.img).filter(Boolean);
const mainImg = allImgs.length ? allImgs[0] : null;
html += `<tr>
<td style="vertical-align:top;">
<div style="text-align:center;">
<div style="font-weight:bold;margin-bottom:0.7em;">${film.title || 'Unknown title'}</div>
${mainImg ? `<img src="${mainImg}" alt="Poster for ${film.title}" style="display:block;margin:auto;max-width:100px;max-height:150px;border-radius:5px;box-shadow:0 2px 8px #0003;margin-bottom:10px;">` : ''}
</div>
</td>
<td class="year" style="vertical-align:top;">${film.year || 'N/A'}</td>
<td>`;
const uniqueResults = [];
const seenSources = new Set();
film.results.forEach(r => {
if (!seenSources.has(r.source)) {
uniqueResults.push(r);
seenSources.add(r.source);
}
});
uniqueResults.forEach(r => {
html += `<div class="source-block">`;
html += `<p class="source-name">${r.source.charAt(0).toUpperCase() + r.source.slice(1)}</p>`;
if (r.link) {
html += `<p><a href="${r.link}" target="_blank">View details</a></p>`;
}
if (r.source === 'commonsense') {
html += `<p><b>Recommended age:</b> ${ageBadge(r.age)}</p>`;
html += `<p><b>Summary (CSM):</b> ${shortSummary(r.summary || r.parentsNeedToKnow)}</p>`;
if (r.details && r.details.length) {
html += `<p><b>Details (CSM):</b></p><ul>`;
r.details.forEach(d => {
html += `<li>${d.type}: ${d.score}/5 - ${shortSummary(d.description, 80)}</li>`;
});
html += `</ul>`;
}
}
else if (r.source === 'cinecheck') {
let numericAges = Array.isArray(r.normalizedMarks) && r.normalizedMarks.length
? r.normalizedMarks
: (r.marks || []).map(x => {
let n = parseInt((x + '').replace(/\d+/, ''), 10);
return isNaN(n) ? null : n;
}).filter(n => n !== null && !isNaN(n));
let minAge = numericAges.length ? Math.min(...numericAges) : '';
html += `<p><b>Age(s) (Cinecheck):</b> ${minAge ? ageBadge(minAge) : ''}${r.marks && r.marks.length ? r.marks.join(', ') : '-'}</p>`;
html += `<p><b>Summary (Cinecheck):</b> ${shortSummary(r.summary)}</p>`;
if (r.details && r.details.length) {
html += `<p><b>Pictograms (Cinecheck):</b> ${r.details.map(d => d.type).join(', ') || '-'}</p>`;
}
}
else if (r.source === 'filmages') {
html += `<p><b>Original title (Filmages):</b> ${r.details.titleOriginalPage || r.details.titleOriginal || '-'}</p>`;
html += `<p><b>Legal age (Filmages):</b> ${ageBadge(r.details.ageLegal)}</p>`;
html += `<p><b>Suggested age (Filmages):</b> ${ageBadge(r.details.ageSuggested)}</p>`;
html += `<p><b>Summary (Filmages):</b> ${shortSummary(r.details.summary)}</p>`;
html += `<p><b>Synthesis (Filmages):</b> ${shortSummary(r.details.synthesis, 100)}</p>`;
if (r.details.indications && r.details.indications.length) {
html += `<p><b>Indications:</b> ${shortSummary(r.details.indications.join(', '), 100)}</p>`;
}
if (r.details.counterIndications && r.details.counterIndications.length) {
html += `<p><b>Contra-indications:</b> ${shortSummary(r.details.counterIndications.join(', '), 100)}</p>`;
}
}
else {
html += `<p><b>Summary:</b> ${shortSummary(r.summary)}</p>`;
html += `<p><b>Age:</b> ${ageBadge(r.age)}</p>`;
}
html += `</div>`;
});
html += `</td></tr>`;
});
html += '</tbody></table>';
filmsDiv.innerHTML = html;
} catch (error) { } catch (error) {
console.error('Search function error:', error); console.error('Search function error:', error);
filmsDiv.innerHTML = `<p class="no-results">Search failed. Check the console.</p>`; filmsDiv.innerHTML = `<p class="no-results">Search failed. Check the console.</p>`;
} }
} }
function filterFilmsByMaxAge(films, maxAge) {
if (!isFinite(maxAge)) return films;
return films.filter(film => {
const uniqueResults = [];
const seenSources = new Set();
film.results.forEach(r => {
if (!seenSources.has(r.source)) {
uniqueResults.push(r);
seenSources.add(r.source);
}
});
const ages = getAllAges(uniqueResults);
if (ages.length === 0) return true;
return Math.max(...ages) <= maxAge;
});
}
function renderFilms(films) {
const filmsDiv = document.getElementById('films');
if (!films.length) {
filmsDiv.innerHTML = '<p class="no-results">No results for this max age.</p>';
return;
}
let html = `<table class="results-table">
<thead>
<tr>
<th>Title</th>
<th>Year</th>
<th>Information sources</th>
</tr>
</thead>
<tbody>`;
films.forEach(film => {
const allImgs = film.results.map(r => r.img).filter(Boolean);
const mainImg = allImgs.length ? allImgs[0] : null;
html += `<tr>
<td style="vertical-align:top;">
<div style="text-align:center;">
<div style="font-weight:bold;margin-bottom:0.7em;">${film.title || 'Unknown title'}</div>
${mainImg ? `<img src="${mainImg}" alt="Poster for ${film.title}" style="display:block;margin:auto;max-width:200px;max-height:250px;border-radius:5px;box-shadow:0 2px 8px #0003;margin-bottom:10px;">` : ''}
</div>
</td>
<td class="year" style="vertical-align:top;">${film.year || 'N/A'}</td>
<td>`;
const uniqueResults = [];
const seenSources = new Set();
film.results.forEach(r => {
if (!seenSources.has(r.source)) {
uniqueResults.push(r);
seenSources.add(r.source);
}
});
uniqueResults.forEach(r => {
html += `<div class="source-block">`;
html += `<p class="source-name">${r.source.charAt(0).toUpperCase() + r.source.slice(1)}</p>`;
if (r.link) {
html += `<p><a href="${r.link}" target="_blank">View details</a></p>`;
}
if (r.source === 'commonsense') {
html += `<p><b>Recommended age:</b> ${ageBadge(r.age)}</p>`;
html += `<p><b>Summary (CSM):</b> ${shortSummary(r.summary || r.parentsNeedToKnow)}</p>`;
if (r.details && r.details.length) {
html += `<p><b>Details (CSM):</b></p><ul>`;
r.details.forEach(d => {
html += `<li>${d.type}: ${d.score}/5 - ${shortSummary(d.description, 80)}</li>`;
});
html += `</ul>`;
}
}
else if (r.source === 'cinecheck') {
let numericAges = Array.isArray(r.normalizedMarks) && r.normalizedMarks.length
? r.normalizedMarks
: (r.marks || []).map(x => {
let n = parseInt((x + '').replace(/\d+/, ''), 10);
return isNaN(n) ? null : n;
}).filter(n => n !== null && !isNaN(n));
let minAge = numericAges.length ? Math.min(...numericAges) : '';
html += `<p><b>Age(s) (Cinecheck):</b> ${minAge ? ageBadge(minAge) : ''}${r.marks && r.marks.length ? r.marks.join(', ') : '-'}</p>`;
html += `<p><b>Summary (Cinecheck):</b> ${shortSummary(r.summary)}</p>`;
if (r.details && r.details.length) {
html += `<p><b>Pictograms (Cinecheck):</b> ${r.details.map(d => d.type).join(', ') || '-'}</p>`;
}
}
else if (r.source === 'filmages') {
html += `<p><b>Original title (Filmages):</b> ${r.details.titleOriginalPage || r.details.titleOriginal || '-'}</p>`;
html += `<p><b>Legal age (Filmages):</b> ${ageBadge(r.details.ageLegal)}</p>`;
html += `<p><b>Suggested age (Filmages):</b> ${ageBadge(r.details.ageSuggested)}</p>`;
html += `<p><b>Summary (Filmages):</b> ${shortSummary(r.details.summary)}</p>`;
html += `<p><b>Synthesis (Filmages):</b> ${shortSummary(r.details.synthesis, 100)}</p>`;
if (r.details.indications && r.details.indications.length) {
html += `<p><b>Indications:</b> ${shortSummary(r.details.indications.join(', '), 100)}</p>`;
}
if (r.details.counterIndications && r.details.counterIndications.length) {
html += `<p><b>Contra-indications:</b> ${shortSummary(r.details.counterIndications.join(', '), 100)}</p>`;
}
}
else {
html += `<p><b>Summary:</b> ${shortSummary(r.summary)}</p>`;
html += `<p><b>Age:</b> ${ageBadge(r.age)}</p>`;
}
html += `</div>`;
});
html += `</td></tr>`;
});
html += '</tbody></table>';
filmsDiv.innerHTML = html;
}
document.getElementById('maxAge').addEventListener('input', function() { document.getElementById('maxAge').addEventListener('input', function() {
updateMaxAgeDisplay(); updateMaxAgeDisplay();
// Pas de fetch, juste filtre en front search();
const query = document.getElementById('q').value.trim();
if (!query || !lastResults.length) return;
const maxAge = parseInt(document.getElementById('maxAge').value, 10);
renderFilms(filterFilmsByMaxAge(lastResults, maxAge));
}); });
window.addEventListener('DOMContentLoaded', () => { window.addEventListener('DOMContentLoaded', () => {
const params = new URLSearchParams(window.location.search); const params = new URLSearchParams(window.location.search);
const q = params.get('q'); const q = params.get('q');
@ -348,11 +281,10 @@
} }
if (q) { if (q) {
document.getElementById('q').value = q; document.getElementById('q').value = q;
search(true); // force fetch initiale search();
} }
}); });
document.getElementById('q').addEventListener('keydown', e => { if (e.key === 'Enter') search(true); }); document.getElementById('q').addEventListener('keydown', e => { if (e.key === 'Enter') search(); });
</script> </script>
</body> </body>
</html> </html>