Files
Freedom-Loader/public/script/fetchinfo.js
2025-06-27 15:42:46 +02:00

74 lines
3.1 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

const urlInput = document.getElementById("UrlInput"); // Récupère le champ input où l'utilisateur entre l'URL
const infoDiv = document.getElementById("videoInfo"); // Récupère la div où on affichera les infos
let lastFetchedUrl = ""; // Pour éviter de refaire plusieurs requêtes pour la même URL
// On écoute chaque changement dans le champ URL
urlInput.addEventListener("input", async () => {
const url = urlInput.value; // On prend la valeur actuelle du champ
// Si pas d'URL, ou URL trop courte, ou déjà traitée, on sort
if (!url || url.length < 5 || url === lastFetchedUrl) return;
lastFetchedUrl = url; // On mémorise l'URL traitée
try {
// Envoi d'une requête POST vers le backend /info avec l'URL dans le corps
const res = await fetch("/info", {
method: "POST",
headers: { "Content-Type": "application/x-www-form-urlencoded" },
body: new URLSearchParams({ url }) // Encode l'URL au format x-www-form-urlencoded
});
// Si la réponse n'est pas OK (erreur 4xx ou 5xx)
if (!res.ok) {
infoDiv.innerHTML = "❌ Impossible de récupérer les infos."; // Message d'erreur utilisateur
return;
}
// On récupère la réponse JSON (les infos de la vidéo)
const data = await res.json();
// Formatage de la durée en minutes et secondes (ex: 4m 35s)
const minutes = Math.floor(data.duration / 60);
const seconds = data.duration % 60;
const durationStr = `${minutes}m ${seconds.toString().padStart(2, '0')}s`;
// Formatage de la date d'upload depuis YYYYMMDD vers JJ/MM/AAAA
const date = data.upload_date || "";
const readableDate = date
? `${date.slice(6, 8)}/${date.slice(4, 6)}/${date.slice(0, 4)}`
: "Inconnue";
// Taille estimée en Mo, ou "Inconnue" si pas dispo
const sizeMB = data.filesize_approx
? (data.filesize_approx / (1024 * 1024)).toFixed(2) + " Mo"
: "Inconnue";
// Catégories en chaîne séparée par des virgules, ou "Non spécifiées"
const categories = data.categories
? data.categories.join(", ")
: "Non spécifiées";
// Mise à jour du contenu HTML de la div avec toutes les infos formatées
infoDiv.innerHTML = `
<h3>${data.title}</h3>
<img src="${data.thumbnail}" width="320">
<ul>
<li><strong>Durée :</strong> ${durationStr}</li>
<li><strong>Uploader :</strong> ${data.uploader || "Inconnu"}</li>
<li><strong>Date dupload :</strong> ${readableDate}</li>
<li><strong>Vues :</strong> ${data.view_count?.toLocaleString() || "?"}</li>
<li><strong>Likes :</strong> ${data.like_count?.toLocaleString() || "?"}</li>
<li><strong>URL :</strong> <a href="${data.webpage_url}" target="_blank">${data.webpage_url}</a></li>
<li><strong>Channel :</strong> <a href="${data.channel_url}" target="_blank">${data.channel_url}</a></li>
<li><strong>Taille estimée :</strong> ${sizeMB}</li>
<li><strong>Catégories :</strong> ${categories}</li>
</ul>
`;
} catch (e) {
// Si une erreur survient lors de la récupération ou du parsing
infoDiv.innerHTML = "❌ Erreur lors de la récupération.";
}
});