<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>YouTube Breakfast&Match</title>
<style>
body {
background-color: #ffffff;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
color: #0077cc;
}
h1 {
background-color: red;
color: white;
padding: 15px;
text-align: center;
text-transform: uppercase;
font-size: 1.8em;
margin: 0;
font-weight: bold;
}
.section-title {
color: #0077cc;
font-size: 1.5em;
margin: 20px 0 10px;
text-align: center;
font-weight: bold;
}
#contentSection, #barzaSection {
text-align: center;
margin-top: 20px;
}
iframe {
margin-top: 10px;
border: 2px solid #0077cc;
border-radius: 10px;
}
</style>
</head>
<body>
<h1>YouTube Breakfast&Match</h1>
<div id="contentSection">
<!-- Video del mattino -->
</div>
<div id="barzaSection">
<!-- Video "Barza Pagelle" -->
</div>
<script>
const channelId = "UC5lq4z_x_22UuH-b7rLmYBw";
const rssFeedUrl = `https://www.youtube.com/feeds/videos.xml?channel_id=${channelId}`;
async function loadYouTubeContent() {
try {
const response = await fetch(rssFeedUrl);
if (!response.ok) throw new Error("Errore nel caricamento del feed RSS.");
const text = await response.text();
const parser = new DOMParser();
const xml = parser.parseFromString(text, "application/xml");
const entries = xml.querySelectorAll("entry");
if (entries.length === 0) throw new Error("Nessun video trovato nel feed RSS.");
// Ordina i video cronologicamente (dal più recente al più vecchio)
const sortedEntries = Array.from(entries).sort((a, b) => {
const dateA = new Date(a.querySelector("published").textContent);
const dateB = new Date(b.querySelector("published").textContent);
return dateB - dateA;
});
let morningVideo = null;
let barzaVideo = null;
// Trova il video del mattino (fino alle 13:00)
for (let i = 0; i < sortedEntries.length; i++) {
const entry = sortedEntries[i];
const title = entry.querySelector("title").textContent.toLowerCa se();
const videoLink = entry.querySelector("link").getAttribute("href");
const publishedDate = new Date(entry.querySelector("published").textContent) ;
// Cerca il primo video del mattino
if (!morningVideo && !title.includes("edizione straordinaria") && !title.includes("live reactions")) {
if (publishedDate.getHours() < 13) {
morningVideo = { title, videoLink, publishedDate };
}
}
}
// Trova l'ultimo video che contiene "Barza Pagelle" o "Pagelle"
for (let i = 0; i < sortedEntries.length; i++) {
const entry = sortedEntries[i];
const title = entry.querySelector("title").textContent.toLowerCa se();
const videoLink = entry.querySelector("link").getAttribute("href");
// Cerca "Barza Pagelle" o "Pagelle" nel titolo
if (title.includes("barza pagelle") || title.includes("pagelle")) {
barzaVideo = { title, videoLink };
break; // Prendi il primo video che trovi
}
}
const now = new Date();
let morningTitleText = "Oggi a Colazione";
if (morningVideo && morningVideo.publishedDate.toDateString() !== now.toDateString()) {
morningTitleText = "Ieri a Colazione";
}
// Mostra il video del mattino
if (morningVideo) {
const videoId = new URL(morningVideo.videoLink).searchParams.get("v");
document.getElementById("contentSection").innerHTM L = `
<div class="section-title">${morningTitleText}</div>
<iframe width="300" height="170"
src="https://www.youtube.com/embed/${videoId}"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
`;
} else {
document.getElementById("contentSection").innerHTM L = "<p>Nessun video disponibile per la mattina.</p>";
}
// Mostra il video che contiene "Barza Pagelle" o "Pagelle"
if (barzaVideo) {
const videoId = new URL(barzaVideo.videoLink).searchParams.get("v");
document.getElementById("barzaSection").innerHTML = `
<div class="section-title">Barza Pagelle dell'ultima partita</div>
<iframe width="300" height="170"
src="https://www.youtube.com/embed/${videoId}"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
`;
} else {
document.getElementById("barzaSection").innerHTML = "<p>Nessun video trovato con 'Barza Pagelle' o 'Pagelle'.</p>";
}
} catch (error) {
console.error("Errore:", error.message);
document.getElementById("contentSection").innerHTM L = "<p>Errore nel caricamento dei video.</p>";
document.getElementById("barzaSection").innerHTML = "";
}
}
loadYouTubeContent();
</script>
</body>
</html>
Secondo voi perché questo codice in una sezione di un app nativa funziona mentre in versione pwa da errore di caricamento?
