--- canonical_url: "https://lmdiario.com.ar/contenido/520514/agenda-cultural-y-eventos-03" title: "Agenda Cultural y Eventos_03" page_type: "WebPage" date_modified: "2026-06-26T20:00:05-03:00" --- # Agenda Cultural y Eventos_03 ========================================================================== LÓGICA JAVASCRIPT EXCLUSIVA Y AUTÓNOMA ========================================================================== */ document.addEventListener("DOMContentLoaded", () => { // CONFIGURACIONES GENERALES const RSS_URL = 'https://lmdiario.com.ar/rss/categoria/cultura.xml'; // Ajustar a ruta relativa en CMS si es necesario (/rss/...) const REFRESH_RATE = 5 * 60 * 1000; // Recarga de datos automática cada 5 minutos const ITEMS_PER_PAGE = 16; // ESTADO DE NAVEGACIÓN let newsData = []; let currentView = 'semanas'; // Vista Inicial: Semana let currentSumarioPage = 0; let currentWeekStartDate = null; let currentMonthDate = null; // ELEMENTOS DEL DOM const dynamicTitle = document.getElementById('dynamic-header-title'); const tabs = document.querySelectorAll('.tab-btn'); const views = document.querySelectorAll('.view-content'); const btnPrev = document.getElementById('btn-prev'); const btnNext = document.getElementById('btn-next'); // Contenedores de Vistas const gridSumario = document.getElementById('grid-sumario'); const gridSemanas = document.getElementById('grid-semanas'); const calendarGrid = document.querySelector('.calendar-grid'); // Modal const modal = document.getElementById('news-modal'); const btnCloseModal = document.getElementById('btn-close-modal'); // --------------------------------------------------------- // INICIALIZACIÓN Y CICLO AUTOMÁTICO // --------------------------------------------------------- initReader(); setInterval(initReader, REFRESH_RATE); // Control de Tabs tabs.forEach(tab => { tab.addEventListener('click', (e) => { const button = e.currentTarget; tabs.forEach(t => t.classList.remove('active')); button.classList.add('active'); currentView = button.getAttribute('data-view'); views.forEach(v => v.classList.remove('active')); document.getElementById(`view-${currentView}`).classList.add('active'); renderCurrentView(); }); }); // Controles de Navegación de Cabecera (Siguiente / Anterior) btnPrev.addEventListener('click', () => { if (currentView === 'sumario' && currentSumarioPage > 0) { currentSumarioPage--; renderSumario(); } else if (currentView === 'semanas' && currentWeekStartDate) { currentWeekStartDate.setDate(currentWeekStartDate.getDate() - 7); renderSemanas(); } else if (currentView === 'mes' && currentMonthDate) { currentMonthDate.setMonth(currentMonthDate.getMonth() - 1); renderMes(); } }); btnNext.addEventListener('click', () => { if (currentView === 'sumario' && (currentSumarioPage + 1) * ITEMS_PER_PAGE < newsData.length) { currentSumarioPage++; renderSumario(); } else if (currentView === 'semanas' && currentWeekStartDate) { currentWeekStartDate.setDate(currentWeekStartDate.getDate() + 7); renderSemanas(); } else if (currentView === 'mes' && currentMonthDate) { currentMonthDate.setMonth(currentMonthDate.getMonth() + 1); renderMes(); } }); // Eventos de Modal btnCloseModal.addEventListener('click', closeModal); modal.addEventListener('click', (e) => { if(e.target === modal) closeModal(); }); // --------------------------------------------------------- // LECTURA DE RSS (ADAPTADO PARA MISMO DOMINIO) // --------------------------------------------------------- async function initReader() { try { const fetchOptions = { method: 'GET', cache: 'no-cache' }; const response = await fetch(RSS_URL, fetchOptions); if (!response.ok) { throw new Error(`HTTP Error: ${response.status} - ${response.statusText}`); } const xmlString = await response.text(); processXML(xmlString); } catch (error) { console.warn("Lector RSS: Falló la petición real.", error); // Forzar mensaje de sincronización en caso de error y vaciar array newsData = []; renderCurrentView(); } } // --------------------------------------------------------- // PROCESAMIENTO ROBUSTO DEL XML // --------------------------------------------------------- function processXML(xmlString) { const parser = new DOMParser(); const xmlDoc = parser.parseFromString(xmlString, "text/xml"); const items = xmlDoc.querySelectorAll("item"); let parsedData = []; items.forEach((item, index) => { const titleNode = item.querySelector("title"); const linkNode = item.querySelector("link"); const descNode = item.querySelector("description"); const pubDateNode = item.querySelector("pubDate"); const title = titleNode ? titleNode.textContent : "Sin título"; const link = linkNode ? linkNode.textContent : "#"; const description = descNode ? descNode.textContent : ""; const pubDateStr = pubDateNode ? pubDateNode.textContent : new Date().toUTCString(); let imageUrl = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9IiNlOGU2ZTMiLz48dGV4dCB4PSI1MCUiIHk9IjUwJSIgZm9udC1mYW1pbHk9InNhbnMtc2VyaWYiIGZvbnQtc2l6ZT0iMjQiIGZpbGw9IiM3YTc3NzMiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGR5PSIuM2VtIj5TaW4gaW1hZ2VuPC90ZXh0Pjwvc3ZnPg=='; const enclosure = item.querySelector("enclosure"); if (enclosure && enclosure.getAttribute("url")) { imageUrl = enclosure.getAttribute("url"); } else { const imgRegex = /]+src="([^">]+)"/i; const match = description.match(imgRegex); if (match && match[1]) { imageUrl = match[1]; } } let cleanDesc = description.replace(/]*>/gi, ""); const pubDate = new Date(pubDateStr); parsedData.push({ id: index, title: title, link: link, description: cleanDesc, imageUrl: imageUrl, dateObj: pubDate, dayAndMonth: getDayAndMonthStr(pubDate), dateWorded: formatDateToWords(pubDate) }); }); newsData = parsedData.sort((a, b) => b.dateObj - a.dateObj); if (newsData.length > 0) { const latestDate = newsData[0].dateObj; if (!currentWeekStartDate) currentWeekStartDate = getMonday(new Date(latestDate)); if (!currentMonthDate) currentMonthDate = new Date(latestDate); } renderCurrentView(); } // --------------------------------------------------------- // RENDERIZADO DE VISTAS // --------------------------------------------------------- function renderCurrentView() { // Manejo de Error o Petición vacía (Sin datos simulados) if (newsData.length === 0) { const emptyMsg = '
Sincronizando datos.
Por favor, esperar un momento...
'; gridSumario.innerHTML = emptyMsg; gridSemanas.innerHTML = emptyMsg; calendarGrid.innerHTML = emptyMsg; btnPrev.disabled = true; btnNext.disabled = true; return; } if (currentView === 'sumario') renderSumario(); else if (currentView === 'semanas') renderSemanas(); else if (currentView === 'mes') renderMes(); } function renderSumario() { gridSumario.innerHTML = ''; dynamicTitle.textContent = "Sumario"; const start = currentSumarioPage * ITEMS_PER_PAGE; const end = start + ITEMS_PER_PAGE; const currentItems = newsData.slice(start, end); currentItems.forEach(item => gridSumario.appendChild(createNewsCard(item))); btnPrev.disabled = currentSumarioPage === 0; btnNext.disabled = end >= newsData.length; } function renderSemanas() { gridSemanas.innerHTML = ''; const monday = new Date(currentWeekStartDate); const sunday = new Date(monday); sunday.setDate(monday.getDate() + 6); const monthNames = ["enero", "febrero", "marzo", "abril", "mayo", "junio", "julio", "agosto", "septiembre", "octubre", "noviembre", "diciembre"]; if (monday.getMonth() === sunday.getMonth()) { dynamicTitle.textContent = `Semana del ${monday.getDate()} al ${sunday.getDate()} de ${monthNames[sunday.getMonth()]}`; } else { dynamicTitle.textContent = `Semana del ${monday.getDate()} de ${monthNames[monday.getMonth()]} al ${sunday.getDate()} de ${monthNames[sunday.getMonth()]}`; } const startRange = new Date(monday).setHours(0,0,0,0); const endRange = new Date(sunday).setHours(23,59,59,999); const weekItems = newsData.filter(item => { const t = item.dateObj.getTime(); return t >= startRange && t <= endRange; }); weekItems.sort((a, b) => a.dateObj - b.dateObj); if (weekItems.length > 0) { weekItems.forEach(item => gridSemanas.appendChild(createNewsCard(item))); } else { gridSemanas.innerHTML = `
No se encontraron noticias para esta semana.
`; } btnPrev.disabled = false; btnNext.disabled = false; } function renderMes() { const year = currentMonthDate.getFullYear(); const month = currentMonthDate.getMonth(); const monthNames = ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"]; dynamicTitle.textContent = `${monthNames[month]} ${year}`; const oldCells = calendarGrid.querySelectorAll('.calendar-cell'); oldCells.forEach(cell => cell.remove()); const firstDay = new Date(year, month, 1).getDay() || 7; const daysInMonth = new Date(year, month + 1, 0).getDate(); for (let i = 1; i < firstDay; i++) { const emptyCell = document.createElement('div'); emptyCell.className = 'calendar-cell empty'; calendarGrid.appendChild(emptyCell); } const newsByDay = {}; newsData.forEach(item => { if (item.dateObj.getMonth() === month && item.dateObj.getFullYear() === year) { const d = item.dateObj.getDate(); if (!newsByDay[d]) newsByDay[d] = []; newsByDay[d].push(item); } }); const today = new Date(); const isCurrentMonthAndYear = (today.getMonth() === month && today.getFullYear() === year); for (let day = 1; day <= daysInMonth; day++) { const cell = document.createElement('div'); cell.className = 'calendar-cell'; if (isCurrentMonthAndYear && today.getDate() === day) { cell.classList.add('active-day'); } const numContainer = document.createElement('div'); numContainer.className = 'cell-num-container'; const dateDiv = document.createElement('div'); dateDiv.className = 'cell-date'; dateDiv.textContent = day; numContainer.appendChild(dateDiv); cell.appendChild(numContainer); const listDiv = document.createElement('div'); listDiv.className = 'cell-news-list'; if (newsByDay[day]) { newsByDay[day].forEach(item => { const nItem = document.createElement('div'); nItem.className = 'cell-news-item'; nItem.textContent = item.title; nItem.title = item.title; nItem.addEventListener('click', () => openModal(item)); listDiv.appendChild(nItem); }); } cell.appendChild(listDiv); calendarGrid.appendChild(cell); } const totalCells = (firstDay - 1) + daysInMonth; const remaining = (7 - (totalCells % 7)) % 7; for (let i = 0; i < remaining; i++) { const emptyCell = document.createElement('div'); emptyCell.className = 'calendar-cell empty'; calendarGrid.appendChild(emptyCell); } btnPrev.disabled = false; btnNext.disabled = false; } // --------------------------------------------------------- // CREADOR DE COMPONENTE TARJETA Y MODAL // --------------------------------------------------------- function createNewsCard(item) { const card = document.createElement('article'); card.className = 'news-card'; card.innerHTML = `
${item.dayAndMonth}
Portada

${item.title}

${getCleanPlainDesc(item.description)}

Leer original
`; card.addEventListener('click', () => openModal(item)); return card; } function openModal(item) { document.getElementById('modal-img').src = item.imageUrl; document.getElementById('modal-title').textContent = item.title; document.getElementById('modal-date').textContent = item.dateWorded; document.getElementById('modal-description').innerHTML = item.description; document.getElementById('modal-link').href = item.link; modal.classList.add('active'); document.body.style.overflow = 'hidden'; // Evitar scroll del body general } function closeModal() { modal.classList.remove('active'); document.body.style.overflow = ''; setTimeout(() => { document.getElementById('modal-img').src = ''; document.getElementById('modal-description').innerHTML = ''; }, 300); } // --------------------------------------------------------- // UTILERÍAS // --------------------------------------------------------- function getMonday(d) { d = new Date(d); const day = d.getDay(); const diff = d.getDate() - day + (day === 0 ? -6 : 1); return new Date(d.setDate(diff)); } function getDayAndMonthStr(date) { if (isNaN(date)) return "-"; const monthsShort = ["ene", "feb", "mar", "abr", "may", "jun", "jul", "ago", "sep", "oct", "nov", "dic"]; return `${date.getDate()} ${monthsShort[date.getMonth()]}`; } function formatDateToWords(date) { if (isNaN(date)) return "Fecha desconocida"; const daysLong = ["domingo", "lunes", "martes", "miércoles", "jueves", "viernes", "sábado"]; const monthsLong = ["enero", "febrero", "marzo", "abril", "mayo", "junio", "julio", "agosto", "septiembre", "octubre", "noviembre", "diciembre"]; return `${daysLong[date.getDay()]}, ${date.getDate()} de ${monthsLong[date.getMonth()]} de ${date.getFullYear()}`; } function getCleanPlainDesc(htmlString) { const tempDiv = document.createElement("div"); tempDiv.innerHTML = htmlString; return tempDiv.textContent || tempDiv.innerText || ""; } }); CONTENEDOR PRINCIPAL CABECERA INTEGRADA Título que se modifica dinámicamente Semana Selector de Vistas Sumario Vista de Semana Activa por defecto Semana Mes Flechas Avanzar / Retroceder de Cabecera CONTENIDOS DE LAS VISTAS VISTA: SUMARIO Inyectado dinámicamente VISTA: SEMANA (Activa por defecto) Inyectado dinámicamente VISTA: MES Lunes Martes Miércoles Jueves Viernes Sábado Domingo Celdas numéricas inyectadas dinámicamente FICHA POP-UP (MODAL REDISEÑADO) Botón de cerrado circular traslúcido ![Portada noticia](https://) Título superpuesto directamente sobre la imagen ## Título de la Noticia Metadatos ubicados debajo de la imagen Redacción LMDiario Cuerpo del mensaje Contenido descriptivo del XML Botón Naranja de Acción [Leer Nota Completa](#) --- *Contenido creado y optimizado para IA con [Medios CMS](https://medios.io)* — Plataforma profesional para la gestión de medios digitales y portales de noticias.