pietre/rss2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Preparar repositorio para despliegue: código fuente limpio

Browse source
This commit is contained in:
jlimolina 2026-01-23 02:00:40 +01:00
parent 866f5c432d
commit 3eca832c1a
76 changed files with 5434 additions and 3496 deletions
Download patch file Download diff file Expand all files Collapse all files

57
templates/add_feeds.html
View file

@ -1,57 +0,0 @@
{% extends "base.html" %}
{% block title %}Añadir Nuevo Feed{% endblock %}
{% block content %}
<header>
<h1>Añadir Nuevo Feed</h1>
<p class="subtitle">Introduce los detalles de la nueva fuente de noticias RSS.</p>
<a href="{{ url_for('dashboard') }}" class="top-link" style="margin-top:15px;">← Volver al Dashboard</a>
</header>
<div class="form-section">
<form action="{{ url_for('add_feed') }}" method="post" autocomplete="off">
<div>
<label for="nombre">Nombre del feed</label>
<input id="nombre" name="nombre" type="text" placeholder="Ej: Noticias de Tecnología" required>
</div>
<div style="margin-top:15px;">
<label for="url">URL del RSS</label>
<input id="url" name="url" type="url" placeholder="https://ejemplo.com/rss" required>
</div>
<div style="margin-top:15px;">
<label for="descripcion">Descripción</label>
<textarea id="descripcion" name="descripcion" rows="2" placeholder="Breve descripción del contenido del feed"></textarea>
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 15px; margin-top: 15px;">
<div>
<label for="categoria_id">Categoría</label>
<select id="categoria_id" name="categoria_id" required>
<option value="">— Elige categoría —</option>
{% for cat in categorias %}
<option value="{{ cat.id }}">{{ cat.nombre }}</option>
{% endfor %}
</select>
</div>
<div>
<label for="pais_id">País</label>
<select name="pais_id" id="pais_id">
<option value="">— Global / No aplica —</option>
{% for pais in paises %}
<option value="{{ pais.id }}">{{ pais.nombre }}</option>
{% endfor %}
</select>
</div>
<div>
<label for="idioma">Idioma (código)</label>
<input id="idioma" name="idioma" type="text" maxlength="2" placeholder="ej: es, en">
</div>
</div>
<button type="submit" class="btn" style="margin-top: 25px; width: 100%;">Añadir Feed</button>
</form>
</div>
{% endblock %}

59
templates/add_url.html
View file

@ -1,59 +0,0 @@
{% extends "base.html" %}
{% block title %}Añadir Noticia desde URL{% endblock %}
{% block content %}
<div class="container mt-4">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header bg-info text-white">
<h4 class="mb-0">Añadir Noticia desde URL</h4>
</div>
<div class="card-body">
<p class="card-text text-muted">Pega la URL de un artículo de noticias. El sistema intentará extraer el título, resumen e imagen automáticamente.</p>
<form action="{{ url_for('add_url') }}" method="post" class="mt-3">
<!-- Campo para la URL -->
<div class="mb-3">
<label for="url" class="form-label"><strong>URL de la Noticia</strong></label>
<input type="url" class="form-control" id="url" name="url" required placeholder="https://ejemplo.com/noticia-a-scrapear">
</div>
<!-- Selector de Categoría -->
<div class="mb-3">
<label for="categoria_id" class="form-label"><strong>Categoría</strong></label>
<select class="form-select" id="categoria_id" name="categoria_id" required>
<option value="" disabled selected>-- Selecciona una categoría --</option>
{% for categoria in categorias %}
<option value="{{ categoria.id }}">{{ categoria.nombre }}</option>
{% endfor %}
</select>
</div>
<!-- Selector de País -->
<div class="mb-3">
<label for="pais_id" class="form-label"><strong>País</strong></label>
<select class="form-select" id="pais_id" name="pais_id" required>
<option value="" disabled selected>-- Selecciona un país --</option>
{% for pais in paises %}
<option value="{{ pais.id }}">{{ pais.nombre }}</option>
{% endfor %}
</select>
</div>
<!-- Botones de Acción -->
<div class="d-flex justify-content-end pt-3">
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary me-2">Cancelar</a>
<button type="submit" class="btn btn-primary">Añadir Noticia</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{% endblock %}

14
templates/base.html
View file

@ -4,15 +4,15 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}Agregador de Noticias RSS{% endblock %}</title>
<title>{% block title %}El Observador - Noticias{% endblock %}</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500;700&display=swap"
href="https://fonts.googleapis.com/css2?family=Old+Standard+TT:wght@400;700&family=Playfair+Display:wght@400;700;900&family=Merriweather:wght@300;400;700&family=Lato:wght@300;400;700&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}?v=10">
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}?v=11">
<!-- TomSelect CSS -->
<link href="https://cdn.jsdelivr.net/npm/tom-select@2.2.2/dist/css/tom-select.css" rel="stylesheet">
@ -80,7 +80,7 @@
<!-- Mobile/Global Nav Elements -->
<div class="mobile-header">
<div class="logo-mobile">
<a href="/">THE DAILY FEED</a>
<a href="/">EL OBSERVADOR</a>
</div>
<button class="mobile-menu-toggle" id="mobile-menu-toggle" aria-label="Abrir menú">
<i class="fas fa-bars"></i>
@ -93,7 +93,7 @@
<header class="desktop-header">
<div class="header-top-row">
<div class="header-title-wrapper">
<h1><a href="/" style="text-decoration: none; color: inherit;">THE DAILY FEED</a></h1>
<h1><a href="/" style="text-decoration: none; color: inherit;">EL OBSERVADOR</a></h1>
</div>
<div class="header-user-menu">
@ -341,7 +341,7 @@
if (data.has_news) {
lastCheck = data.timestamp;
new Notification("The Daily Feed", {
new Notification("El Observador", {
body: data.message,
icon: "/static/favicon.ico" // Assuming generic icon
});
@ -381,7 +381,7 @@
Notification.requestPermission().then(permission => {
if (permission === "granted") {
btn.style.display = 'none';
new Notification("The Daily Feed", { body: "¡Notificaciones activadas!" });
new Notification("El Observador", { body: "¡Notificaciones activadas!" });
}
});
};

144
templates/dashboard.html
View file

@ -1,144 +0,0 @@
{% extends "base.html" %}
{% block title %}Dashboard{% endblock %}
{% block content %}
<div class="dashboard-grid">
<div class="stat-card">
<div class="stat-number">{{ stats.feeds_totales }}</div>
<div class="stat-label">Feeds Totales</div>
</div>
<div class="stat-card">
<div class="stat-number">{{ stats.noticias_totales }}</div>
<div class="stat-label">Noticias Totales</div>
</div>
<div class="stat-card">
<div class="stat-number">{{ stats.feeds_caidos }}</div>
<div class="stat-label">Feeds Caídos</div>
</div>
</div>
<div class="row">
<div class="col-md-6 mb-4">
<div class="card">
<div class="card-header">
<h3>Gestión de Feeds RSS</h3>
</div>
<div class="card-body">
<p>
Exporta tu lista de feeds RSS o restaura/importa desde un archivo CSV.
Además, puedes ir al organizador avanzado de feeds para filtrarlos
por país, categoría y estado.
</p>
<div style="display:flex; flex-wrap:wrap; gap:10px; margin-bottom:10px;">
<a href="{{ url_for('feeds.list_feeds') }}" class="btn btn-secondary">
<i class="fas fa-list"></i> Ver / Gestionar Feeds
</a>
</div>
<div style="display:flex; flex-wrap:wrap; gap:8px; margin-bottom:15px;">
<a href="{{ url_for('feeds.list_feeds', estado='activos') }}" class="btn btn-small">
<i class="fas fa-check-circle"></i> Feeds activos
</a>
<a href="{{ url_for('feeds.list_feeds', estado='inactivos') }}" class="btn btn-small btn-danger">
<i class="fas fa-times-circle"></i> Feeds caídos/inactivos
</a>
<a href="{{ url_for('feeds.list_feeds', estado='errores') }}" class="btn btn-small btn-info">
<i class="fas fa-exclamation-triangle"></i> Feeds con errores
</a>
</div>
<hr style="margin: 15px 0; border: 0; border-top: 1px solid var(--border-color);">
<a href="{{ url_for('backup_feeds') }}" class="btn">
<i class="fas fa-download"></i> Exportar Feeds
</a>
<a href="{{ url_for('restore_feeds') }}" class="btn btn-info">
<i class="fas fa-upload"></i> Importar Feeds
</a>
</div>
</div>
</div>
<div class="col-md-6 mb-4">
<div class="card">
<div class="card-header">
<h3>Gestión de Fuentes URL</h3>
</div>
<div class="card-body">
<p>Exporta tu lista de fuentes URL o restaura/importa desde un archivo CSV.</p>
<a href="{{ url_for('backup_urls') }}" class="btn">
<i class="fas fa-download"></i> Exportar URLs
</a>
<a href="{{ url_for('restore_urls') }}" class="btn btn-info">
<i class="fas fa-upload"></i> Importar Fuentes URL
</a>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<h3>Operaciones del Sistema</h3>
</div>
<div class="card-body">
<p>Genera o restaura una copia de seguridad completa de todas tus fuentes y noticias.</p>
<div style="display:flex; gap:10px; flex-wrap:wrap;">
<a href="{{ url_for('backup_completo') }}" class="btn btn-secondary">
<i class="fas fa-archive"></i> Backup Completo (.zip)
</a>
<a href="{{ url_for('restore_completo') }}" class="btn btn-info">
<i class="fas fa-upload"></i> Restaurar Backup (.zip)
</a>
</div>
</div>
</div>
{% if top_tags and top_tags|length > 0 %}
<div class="card">
<div class="card-header">
<h3>Top tags (últimas 24h)</h3>
</div>
<div class="card-body" style="padding:0;">
<table style="width:100%; border-collapse: collapse;">
<thead>
<tr style="background-color: rgba(0,0,0,0.05);">
<th style="padding: 12px 15px; text-align: left;">Tag</th>
<th style="padding: 12px 15px; text-align: left;">Tipo</th>
<th style="padding: 12px 15px; text-align: right;">Apariciones</th>
</tr>
</thead>
<tbody>
{% for t in top_tags %}
<tr>
<td style="padding: 12px 15px; border-top: 1px solid var(--border-color);">
{{ t.valor }}
</td>
<td style="padding: 12px 15px; border-top: 1px solid var(--border-color); text-transform: capitalize;">
{{ t.tipo }}
</td>
<td style="padding: 12px 15px; border-top: 1px solid var(--border-color); text-align: right;">
{{ t.apariciones }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
{% else %}
<div class="card">
<div class="card-header">
<h3>Top tags (últimas 24h)</h3>
</div>
<div class="card-body">
<p style="color: var(--text-color-light); margin: 0;">No hay tags para mostrar todavía.</p>
</div>
</div>
{% endif %}
{% endblock %}

48
templates/edit_url_source.html
View file

@ -1,48 +0,0 @@
{% extends "base.html" %}
{% block title %}Editar Fuente URL{% endblock %}
{% block content %}
<h1>Editar Fuente: {{ fuente.nombre }}</h1>
<div class="card">
<form action="{{ url_for('edit_url_source', url_id=fuente.id) }}" method="post">
<label for="nombre">Nombre</label>
<input type="text" id="nombre" name="nombre" value="{{ fuente.nombre }}" required>
<label for="url" style="margin-top:15px;">URL</label>
<input type="url" id="url" name="url" value="{{ fuente.url }}" required>
<label for="categoria_id" style="margin-top:15px;">Categoría</label>
<select id="categoria_id" name="categoria_id">
<option value="">— Sin categoría —</option>
{% for c in categorias %}
<option value="{{ c.id }}" {% if c.id == fuente.categoria_id %}selected{% endif %}>
{{ c.nombre }}
</option>
{% endfor %}
</select>
<label for="pais_id" style="margin-top:15px;">País</label>
<select id="pais_id" name="pais_id">
<option value="">— Sin país —</option>
{% for p in paises %}
<option value="{{ p.id }}" {% if p.id == fuente.pais_id %}selected{% endif %}>
{{ p.nombre }}
</option>
{% endfor %}
</select>
<label for="idioma" style="margin-top:15px;">Idioma (2 letras)</label>
<input id="idioma" name="idioma" value="{{ fuente.idioma }}" maxlength="2" required>
<div style="display:flex;justify-content:end;gap:10px;margin-top:20px;">
<a href="{{ url_for('manage_urls') }}" class="btn btn-secondary">Cancelar</a>
<button class="btn" type="submit">Actualizar</button>
</div>
</form>
</div>
{% endblock %}

138
templates/index.html
View file

@ -1,138 +0,0 @@
{% extends "base.html" %}
{% block title %}Gestión de Feeds RSS{% endblock %}
{% block content %}
<h1>Gestión de Feeds RSS</h1>
<a href="/" class="top-link">← Volver a últimas noticias</a>
<div class="card">
<h2>Añadir un nuevo feed</h2>
<form action="/add" method="post" autocomplete="off">
<label for="nombre">Nombre del feed</label>
<input id="nombre" name="nombre" placeholder="Nombre del feed" required>
<label for="descripcion">Descripción</label>
<textarea id="descripcion" name="descripcion" placeholder="Breve descripción del feed" rows="2"></textarea>
<label for="url">URL del RSS</label>
<input id="url" name="url" placeholder="URL del RSS" required>
<label for="categoria_id">Categoría</label>
<select id="categoria_id" name="categoria_id" required>
<option value="">— Elige categoría —</option>
{% for cid, cnom in categorias %}
<option value="{{ cid }}">{{ cnom }}</option>
{% endfor %}
</select>
<label for="continente_id">Continente</label>
<select name="continente_id" id="continente_id" onchange="filtrarPaisesPorContinente()">
<option value="">— Elige continente —</option>
{% for coid, conom in continentes %}
<option value="{{ coid }}">{{ conom }}</option>
{% endfor %}
</select>
<label for="pais_id">País</label>
<select name="pais_id" id="pais_id">
<option value="">— N/A —</option>
{% for pid, pnom, contid in paises %}
<option value="{{ pid }}">{{ pnom }}</option>
{% endfor %}
</select>
<!-- Nuevo campo: idioma -->
<label for="idioma">Idioma</label>
<input id="idioma" name="idioma" maxlength="2" placeholder="Ej: es, en, fr">
<button class="btn" type="submit">Añadir</button>
<!-- Datos en JSON para el filtro dinámico de países -->
<script type="application/json" id="paises-data">{{ paises|tojson }}</script>
</form>
</div>
<div class="card">
<h2>Lista de Feeds</h2>
<a href="/backup_feeds" target="_blank" class="btn">⬇️ Descargar backup de feeds (CSV)</a>
<a href="/restore_feeds" class="btn" style="margin-left:10px;">🔄 Restaurar feeds desde backup</a>
<table>
<thead>
<tr>
<th>Nombre y descripción</th>
<th>URL</th>
<th>Categoría</th>
<th>País</th>
<th style="min-width: 80px;">Estado</th>
<th style="min-width: 60px;">Fallos</th>
<th>Acciones</th>
</tr>
</thead>
<tbody>
{% for id, nombre, descripcion, url, categoria_id, pais_id, activo, fallos, cat_nom, pais_nom in feeds %}
<tr>
<td>
<strong>{{ nombre }}</strong>
{% if descripcion %}
<div style="font-size:0.95em; color:#64748b;">{{ descripcion }}</div>
{% endif %}
</td>
<td><a href="{{ url }}" target="_blank">{{ url }}</a></td>
<td>{{ cat_nom or 'N/A' }}</td>
<td>{{ pais_nom or 'N/A' }}</td>
<td>
{% if not activo %}
<span class="badge-ko" title="Inactivo: {{ fallos }} fallos">KO</span>
{% elif fallos > 0 %}
<span class="badge-warn" title="{{ fallos }} fallos recientes">⚠️</span>
{% else %}
<span class="badge-ok">OK</span>
{% endif %}
</td>
<td>
{% if fallos > 0 %}
<span style="color:orange;">{{ fallos }}</span>
{% else %}
0
{% endif %}
</td>
<td class="actions">
<a href="/edit/{{ id }}">Editar</a> |
<a href="/delete/{{ id }}" onclick="return confirm('¿Seguro que quieres eliminar este feed?');">Eliminar</a>
{% if not activo %}
| <a href="/reactivar_feed/{{ id }}" style="color:#198754;" title="Reactivar feed">Reactivar</a>
{% endif %}
</td>
</tr>
{% else %}
<tr>
<td colspan="7">No hay feeds aún.</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<a href="/" class="top-link">← Volver a últimas noticias</a>
<script>
function filtrarPaisesPorContinente() {
const continenteId = document.getElementById('continente_id').value;
const paises = JSON.parse(document.getElementById('paises-data').textContent);
const selectPais = document.getElementById('pais_id');
selectPais.innerHTML = '';
// Opción N/A siempre presente
const optionNA = document.createElement('option');
optionNA.value = '';
optionNA.textContent = '— N/A —';
selectPais.appendChild(optionNA);
paises.forEach(([id, nombre, contId]) => {
if (!continenteId || contId == continenteId || contId == Number(continenteId)) {
const opt = document.createElement('option');
opt.value = id;
opt.textContent = nombre;
selectPais.appendChild(opt);
}
});
}
</script>
{% endblock %}

316
templates/noticia.html
View file

@ -1,316 +0,0 @@
{% extends "base.html" %}
{% block title %}
{{ dato.titulo_trad or dato.titulo_orig or 'Detalle de Noticia' }}
{% endblock %}
{% block content %}
{% set d = dato %}
{% if not d %}
<div class="card">
<p>No se encontró la noticia solicitada.</p>
</div>
{% else %}
<div class="card" id="main-article">
<div class="feed-header">
<h2 style="margin:0;">{{ d.titulo_trad or d.titulo_orig }}
{% if d.lang_to %}
<span class="badge">{{ d.lang_to|upper }}</span>
{% endif %}
</h2>
<div class="header-actions">
<a href="{{ url_for('pdf.export_noticia', noticia_id=d.noticia_id) }}" class="btn btn-small"
title="Exportar PDF" target="_blank">
<i class="fas fa-file-pdf"></i>
</a>
<button class="btn btn-small" onclick="toggleReadingMode()" title="Modo lectura">
<i class="fas fa-book-reader"></i>
</button>
{% if d.url %}
<a href="{{ d.url }}" target="_blank" class="btn btn-small">Ver fuente</a>
{% endif %}
</div>
</div>
<div class="feed-body">
<div class="noticia-meta">
{% if d.fecha %}
<i class="far fa-calendar-alt"></i>
{% if d.fecha is string %}
{{ d.fecha }}
{% else %}
{{ d.fecha.strftime('%d-%m-%Y %H:%M') }}
{% endif %}
{% endif %}
{% if d.fuente_nombre %} | <i class="fas fa-newspaper"></i> {{ d.fuente_nombre }}{% endif %}
{% if d.categoria %} | <i class="fas fa-tag"></i> {{ d.categoria }}{% endif %}
{% if d.pais %} | <i class="fas fa-globe"></i> {{ d.pais }}{% endif %}
</div>
{% if d.imagen_url %}
<div style="text-align:center;margin-bottom:16px;">
<img src="{{ d.imagen_url }}" alt="" loading="lazy" onerror="this.style.display='none';"
style="max-width: 100%; height: auto; border-radius: 8px;">
</div>
{% endif %}
{% if d.resumen_trad %}
<h3>Resumen (traducido)</h3>
<div>{{ d.resumen_trad|safe_html }}</div>
<hr>
{% endif %}
{% if d.resumen_orig %}
<h3>Resumen (original)</h3>
<div>{{ d.resumen_orig|safe_html }}</div>
{% endif %}
{% if tags %}
<div style="margin-top:12px;">
{% for t in tags %}
<span class="badge" title="{{ t.tipo }}">{{ t.valor }}</span>
{% endfor %}
</div>
{% endif %}
<!-- Share Buttons -->
<div class="share-section">
<span class="share-label">Compartir:</span>
<div class="share-buttons">
<a href="https://twitter.com/intent/tweet?text={{ (d.titulo_trad or d.titulo_orig)|urlencode }}&url={{ request.url|urlencode }}"
target="_blank" class="share-btn share-twitter" title="Twitter">
<i class="fab fa-twitter"></i>
</a>
<a href="https://wa.me/?text={{ (d.titulo_trad or d.titulo_orig)|urlencode }}%20{{ request.url|urlencode }}"
target="_blank" class="share-btn share-whatsapp" title="WhatsApp">
<i class="fab fa-whatsapp"></i>
</a>
<a href="https://t.me/share/url?url={{ request.url|urlencode }}&text={{ (d.titulo_trad or d.titulo_orig)|urlencode }}"
target="_blank" class="share-btn share-telegram" title="Telegram">
<i class="fab fa-telegram"></i>
</a>
<button class="share-btn share-copy" onclick="copyLink()" title="Copiar enlace">
<i class="fas fa-link"></i>
</button>
</div>
</div>
</div>
</div>
<style>
.share-section {
display: flex;
align-items: center;
gap: 1rem;
margin-top: 1.5rem;
padding-top: 1rem;
border-top: 1px solid var(--border-color, #eee);
}
.share-label {
font-size: 0.85rem;
color: var(--text-muted, #666);
font-weight: 500;
}
.share-buttons {
display: flex;
gap: 0.5rem;
}
.share-btn {
display: flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
border-radius: 50%;
border: none;
cursor: pointer;
text-decoration: none;
color: #fff;
font-size: 1rem;
transition: transform 0.2s, box-shadow 0.2s;
}
.share-btn:hover {
transform: scale(1.1);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.share-twitter {
background: #1DA1F2;
}
.share-whatsapp {
background: #25D366;
}
.share-telegram {
background: #0088cc;
}
.share-copy {
background: #111;
}
.dark-mode .share-copy {
background: #fff;
color: #111;
}
/* Reading Mode Styles */
.header-actions {
display: flex;
gap: 0.5rem;
}
body.reading-mode header,
body.reading-mode .main-nav,
body.reading-mode .share-section,
body.reading-mode .card:not(#main-article),
body.reading-mode .noticia-meta,
body.reading-mode .header-actions .btn:not([onclick*="Reading"]) {
display: none !important;
}
body.reading-mode {
background: #faf9f5;
}
body.reading-mode #main-article {
max-width: 700px;
margin: 2rem auto;
padding: 3rem;
font-size: 1.15rem;
line-height: 1.9;
box-shadow: none;
border: none;
}
body.reading-mode #main-article h2 {
font-size: 2.2rem;
line-height: 1.3;
margin-bottom: 1.5rem;
font-family: 'Playfair Display', Georgia, serif;
}
body.reading-mode #main-article img {
max-width: 100%;
height: auto;
border-radius: 8px;
}
body.reading-mode.dark-mode {
background: #111;
}
body.reading-mode.dark-mode #main-article {
background: #1a1a1a;
color: #e0e0e0;
}
/* Exit reading mode button */
.exit-reading-btn {
position: fixed;
top: 1rem;
right: 1rem;
background: #111;
color: #fff;
border: none;
padding: 0.75rem 1rem;
border-radius: 8px;
cursor: pointer;
font-size: 0.85rem;
z-index: 1000;
display: none;
}
body.reading-mode .exit-reading-btn {
display: flex;
align-items: center;
gap: 0.5rem;
}
</style>
<button class="exit-reading-btn" onclick="toggleReadingMode()">
<i class="fas fa-times"></i> Salir
</button>
<script>
function copyLink() {
navigator.clipboard.writeText(window.location.href).then(() => {
const btn = document.querySelector('.share-copy');
const icon = btn.querySelector('i');
icon.className = 'fas fa-check';
setTimeout(() => { icon.className = 'fas fa-link'; }, 2000);
});
}
function toggleReadingMode() {
document.body.classList.toggle('reading-mode');
// Scroll to top in reading mode
if (document.body.classList.contains('reading-mode')) {
window.scrollTo({ top: 0, behavior: 'smooth' });
}
}
// ESC key to exit reading mode
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape' && document.body.classList.contains('reading-mode')) {
toggleReadingMode();
}
});
</script>
{% if relacionadas %}
<div class="card" style="margin-top:16px;">
<div class="card-header">
<h3>Noticias relacionadas</h3>
</div>
<ul class="noticias-list">
{% for r in relacionadas %}
<li class="noticia-item">
{% if r.imagen_url %}
<div class="noticia-imagen"
style="width: 120px; height: 80px; flex-shrink: 0; overflow: hidden; border-radius: 4px;">
<img src="{{ r.imagen_url }}" loading="lazy" onerror="this.parentElement.style.display='none'"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
{% endif %}
<div class="noticia-texto">
<h3 class="m0">
<a href="{{ url_for('noticia.noticia', tr_id=r.related_tr_id) if r.related_tr_id else r.url }}" {%
if not r.related_tr_id %}target="_blank" {% endif %}>
{{ r.titulo_trad or r.titulo }}
</a>
</h3>
<div class="noticia-meta">
{% if r.fecha %}
<i class="far fa-calendar-alt"></i>
{% if r.fecha is string %}
{{ r.fecha }}
{% else %}
{{ r.fecha.strftime('%d-%m-%Y %H:%M') }}
{% endif %}
{% endif %}
{% if r.fuente_nombre %} | {{ r.fuente_nombre }}{% endif %}
{% if r.score is defined %} | score {{ "%.3f"|format(r.score) }}{% endif %}
</div>
</div>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
{% endif %}
{% endblock %}

345
templates/noticia_classic.html Normal file
View file

@ -0,0 +1,345 @@
{% extends "base.html" %}
{% block title %}
{{ dato.titulo_trad or dato.titulo_orig or 'Detalle de Noticia' }} - El Observador
{% endblock %}
{% block content %}
{% set d = dato %}
{% if not d %}
<div class="container">
<div class="card">
<h2>Artículo No Encontrado</h2>
<p>No se encontró la noticia solicitada.</p>
<a href="{{ url_for('home.home') }}" class="btn">← Volver al inicio</a>
</div>
</div>
{% else %}
<div class="container">
<!-- Encabezado del artículo -->
<header class="article-header">
<div class="article-breadcrumb">
<a href="{{ url_for('home.home') }}">Inicio</a> →
{% if d.categoria %}
<a href="{{ url_for('home.home', categoria_id=d.categoria_id) }}">{{ d.categoria }}</a> →
{% endif %}
Artículo
</div>
<h1 class="article-title">{{ d.titulo_trad or d.titulo_orig }}</h1>
<div class="article-meta">
{% if d.categoria %}
<span class="badge">{{ d.categoria }}</span>
{% endif %}
{% if d.pais %}
<span class="meta-item"><i class="fas fa-globe"></i> {{ d.pais }}</span>
{% endif %}
<span class="meta-item"><i class="fas fa-newspaper"></i> {{ d.fuente_nombre }}</span>
<span class="meta-item"><i class="fas fa-clock"></i>
{% if d.fecha %}
{{ d.fecha.strftime('%d de %B de %Y - %H:%M') }}
{% endif %}
</span>
{% if d.lang_to %}
<span class="meta-item"><i class="fas fa-language"></i> Traducido al {{ d.lang_to|upper }}</span>
{% endif %}
</div>
</header>
<!-- Contenido principal -->
<div class="row">
<div class="col-md-8 main-section">
<article class="article-content">
{% if d.imagen_url %}
<div class="article-image">
<img src="{{ d.imagen_url }}" alt="{{ d.titulo_trad or d.titulo_orig }}"
style="width: 100%; max-height: 400px; object-fit: cover; border: 1px solid var(--border-color);">
{% if d.imagen_credit %}
<p class="image-credit">Foto: {{ d.imagen_credit }}</p>
{% endif %}
</div>
{% endif %}
<div class="article-body">
{% if d.resumen_trad or d.resumen_orig %}
<div class="article-summary">
<strong>Resumen:</strong>
<p>{{ (d.resumen_trad or d.resumen_orig) | safe_html }}</p>
</div>
{% endif %}
{% if d.contenido_trad or d.contenido_orig %}
<div class="article-full-content">
{{ (d.contenido_trad or d.contenido_orig) | safe_html }}
</div>
{% else %}
<div class="article-excerpt">
<p>{{ (d.resumen_trad or d.resumen_orig) | safe_html }}</p>
{% if d.url %}
<div style="margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border-color);">
<a href="{{ d.url }}" target="_blank" class="btn">
<i class="fas fa-external-link-alt"></i> Leer artículo completo en {{ d.fuente_nombre }}
</a>
</div>
{% endif %}
</div>
{% endif %}
</div>
</article>
<!-- Acciones del artículo -->
<div class="article-actions">
<div class="action-buttons">
<button class="btn" onclick="toggleReadingMode()" title="Modo lectura">
<i class="fas fa-book-reader"></i> Modo Lectura
</button>
<a href="{{ url_for('pdf.export_noticia', noticia_id=d.noticia_id) }}" class="btn" title="Exportar PDF"
target="_blank">
<i class="fas fa-file-pdf"></i> PDF
</a>
<button class="btn" onclick="shareArticle()" title="Compartir">
<i class="fas fa-share-alt"></i> Compartir
</button>
{% if session.get('user_id') %}
<button class="btn" onclick="toggleFavorite()" title="Añadir a favoritos">
<i class="fas fa-star"></i> Favorito
</button>
{% endif %}
</div>
<div class="article-tags">
{% if d.etiquetas %}
<h4>Etiquetas:</h4>
{% for tag in d.etiquetas.split(',') %}
<span class="tag">{{ tag.strip() }}</span>
{% endfor %}
{% endif %}
</div>
</div>
</div>
<!-- Sidebar del artículo -->
<div class="col-md-4 sidebar">
<!-- Información de la fuente -->
<div class="card">
<h3>Información de la Fuente</h3>
<div class="source-info">
<p><strong>Medio:</strong> {{ d.fuente_nombre }}</p>
{% if d.idioma_orig %}
<p><strong>Idioma original:</strong> {{ d.idioma_orig|upper }}</p>
{% endif %}
{% if d.url %}
<p><strong>URL original:</strong></p>
<a href="{{ d.url }}" target="_blank" class="url-original"
style="word-break: break-all; color: var(--accent-color);">
{{ d.url }}
</a>
{% endif %}
</div>
</div>
<!-- Artículos relacionados -->
{% if related_news %}
<div class="card">
<h3>Artículos Relacionados</h3>
<ul>
{% for related in related_news[:5] %}
<li>
{% if related.traduccion_id %}
<a href="{{ url_for('noticia.noticia', tr_id=related.traduccion_id) }}">
{% else %}
<a href="{{ url_for('noticia.noticia', id=related.id) }}">
{% endif %}
{{ related.titulo_trad if related.tiene_traduccion else related.titulo_original }}
</a>
<small style="color: var(--muted-color);">
{{ related.fecha.strftime('%d/%m %H:%M') if related.fecha else '' }}
</small>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
<!-- Categorías populares -->
{% if categorias %}
<div class="card">
<h3>Más Noticias</h3>
<ul>
{% for cat in categorias[:8] %}
<li>
<a href="{{ url_for('home.home', categoria_id=cat.id) }}">{{ cat.nombre }}</a>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
</div>
</div>
</div>
{% endif %}
<script>
function toggleReadingMode() {
document.body.classList.toggle('reading-mode');
}
function shareArticle() {
if (navigator.share) {
navigator.share({
title: '{{ d.titulo_trad or d.titulo_orig }}',
text: '{{ d.resumen_trad or d.resumen_orig }}',
url: window.location.href
});
} else {
// Fallback para navegadores que no soportan Web Share API
navigator.clipboard.writeText(window.location.href);
alert('Enlace copiado al portapapeles');
}
}
function toggleFavorite() {
// Implementar funcionalidad de favoritos
fetch('/api/favorites/toggle', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
noticia_id: '{{ d.noticia_id }}'
})
})
.then(response => response.json())
.then(data => {
if (data.success) {
const btn = event.target.closest('button');
const icon = btn.querySelector('i');
if (data.is_favorite) {
icon.classList.remove('far');
icon.classList.add('fas');
btn.innerHTML = '<i class="fas fa-star"></i> Eliminar de Favoritos';
} else {
icon.classList.remove('fas');
icon.classList.add('far');
btn.innerHTML = '<i class="far fa-star"></i> Añadir a Favoritos';
}
}
})
.catch(error => console.error('Error:', error));
}
// Estilo adicional para modo lectura
const style = document.createElement('style');
style.textContent = `
.reading-mode .container {
max-width: 800px;
margin: 20px auto;
padding: 40px;
background: var(--paper-color);
border: none;
box-shadow: none;
}
.reading-mode .article-content {
column-count: 1;
font-size: 1.2rem;
line-height: 1.9;
}
.reading-mode .sidebar {
display: none;
}
.reading-mode .article-actions {
margin-top: 40px;
padding-top: 30px;
border-top: 2px solid var(--border-color);
}
.reading-mode .article-title {
font-size: 2.5rem;
line-height: 1.2;
margin-bottom: 20px;
}
.reading-mode .article-meta {
margin-bottom: 30px;
}
.article-image {
margin: 30px 0;
}
.image-credit {
font-size: 0.85rem;
color: var(--muted-color);
margin-top: 8px;
font-style: italic;
}
.article-summary {
background: var(--bg-color);
padding: 20px;
border-left: 4px solid var(--accent-color);
margin: 20px 0;
font-size: 1.1rem;
}
.article-breadcrumb {
font-size: 0.9rem;
color: var(--muted-color);
margin-bottom: 15px;
}
.article-breadcrumb a {
color: var(--muted-color);
text-decoration: none;
}
.article-breadcrumb a:hover {
color: var(--accent-color);
}
.action-buttons {
display: flex;
gap: 10px;
flex-wrap: wrap;
margin-bottom: 20px;
}
.article-tags {
margin-top: 20px;
}
.article-tags h4 {
margin-bottom: 10px;
color: var(--accent-color);
}
.source-info p {
margin-bottom: 10px;
}
.url-original {
display: block;
margin-top: 5px;
font-size: 0.9rem;
}
`;
document.head.appendChild(style);
</script>
{% endblock %}

17
templates/noticias.html
View file

@ -1,5 +1,5 @@
{% extends "base.html" %}
{% block title %}Últimas Noticias RSS{% endblock %}
{% block title %}El Observador - Últimas Noticias{% endblock %}
{% block content %}
<div class="card" style="padding: 1.5rem;">
@ -18,11 +18,11 @@
<div class="filter-main-row" style="display: flex; gap: 10px; width: 100%;">
<div class="filter-search-box" style="flex: 1;">
<input type="search" name="q" id="q" placeholder="Buscar noticias..." value="{{ q or '' }}"
style="width: 100%; padding: 0.8rem 1rem; font-size: 1.1rem; border-radius: 8px; border: 1px solid var(--border-color);">
style="width: 100%; padding: 0.8rem 1rem; font-size: 1.1rem; border-radius: 0; border: 1px solid var(--ink-black);">
</div>
<div class="filter-actions" style="display: flex; gap: 5px;">
<button type="submit" class="btn" style="padding: 0.8rem 1.2rem; border-radius: 8px;" title="Buscar">
<button type="submit" class="btn" style="padding: 0.8rem 1.2rem; border-radius: 0;" title="Buscar">
<i class="fas fa-search"></i>
</button>
<a href="{{ url_for('home.home') }}" class="btn btn-secondary"
@ -163,10 +163,17 @@
</div>
<style>
:root {
--accent-color: var(--accent-red);
--text-color: var(--newspaper-gray);
--bg-color: var(--paper-cream);
--card-bg: var(--paper-white);
}
.timeline-container {
position: relative;
padding-left: 30px;
border-left: 2px solid rgba(108, 99, 255, 0.3);
border-left: 2px solid var(--accent-red);
/* Var accent-color opacity */
margin-left: 10px;
}
@ -182,7 +189,7 @@
top: 20px;
width: 12px;
height: 12px;
background: var(--accent-color, #6c63ff);
background: var(--accent-red);
border-radius: 50%;
border: 2px solid var(--bg-color, #f4f6f8);
box-shadow: 0 0 0 4px rgba(108, 99, 255, 0.2);

16
templates/restore_urls.html
View file

@ -1,16 +0,0 @@
{% extends "base.html" %}
{% block title %}Importar Fuentes URL{% endblock %}
{% block content %}
<h1>Importar Fuentes URL</h1>
<div class="card">
<form method="post" enctype="multipart/form-data" action="{{ url_for('restore_urls') }}">
<label>Archivo CSV:</label>
<input type="file" name="file" required>
<button class="btn" style="margin-top:15px;">Importar</button>
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary">Cancelar</a>
</form>
</div>
{% endblock %}

156
templates/resumen.html
View file

@ -1,156 +0,0 @@
{% extends "base.html" %}
{% block title %}Resumen Diario - {{ current_date.strftime('%d/%m/%Y') }}{% endblock %}
{% block content %}
<div class="summary-header">
<div class="date-nav">
<a href="{{ url_for('resumen.diario', date=prev_date) }}" class="btn btn-small btn-secondary">
<i class="fas fa-chevron-left"></i> Anterior
</a>
<h1>Resumen Diario <small>{{ current_date.strftime('%d/%m/%Y') }}</small></h1>
{% if next_date %}
<a href="{{ url_for('resumen.diario', date=next_date) }}" class="btn btn-small btn-secondary">
Siguiente <i class="fas fa-chevron-right"></i>
</a>
{% else %}
<span style="width: 100px;"></span>
{% endif %}
</div>
</div>
{% if not noticias_by_cat %}
<div class="card" style="text-align: center; padding: 40px;">
<i class="far fa-newspaper" style="font-size: 3rem; color: #ccc; margin-bottom: 20px;"></i>
<h3>No hay noticias para este día</h3>
<p>Prueba navegando a días anteriores.</p>
</div>
{% else %}
<div class="summary-grid">
{% for categoria, noticias in noticias_by_cat.items() %}
<div class="category-block card">
<h2 class="category-title">{{ categoria }}</h2>
<ul class="summary-list">
{% for n in noticias %}
<li class="summary-item">
{% if n.imagen_url %}
<div class="summary-img">
<img src="{{ n.imagen_url }}" loading="lazy" onerror="this.style.display='none'">
</div>
{% endif %}
<div class="summary-content">
<h3><a href="{{ url_for('noticia.detalle_noticia', noticia_id=n.id) }}">{{ n.titulo }}</a></h3>
<div class="meta">
{{ n.time_str }} | {{ n.fuente }}
</div>
</div>
</li>
{% endfor %}
</ul>
<div style="text-align: center; margin-top: 15px;">
<a href="{{ url_for('home.home', categoria_id=noticias[0].categoria_id, fecha=current_date) }}"
class="btn btn-small btn-outline">Ver más de {{ categoria }}</a>
</div>
</div>
{% endfor %}
</div>
{% endif %}
<style>
.summary-header {
text-align: center;
margin-bottom: 30px;
}
.date-nav {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 800px;
margin: 0 auto;
}
.date-nav h1 {
margin: 0;
font-family: var(--primary-font);
}
.date-nav h1 small {
display: block;
font-size: 0.5em;
color: #777;
font-family: var(--secondary-font);
margin-top: 5px;
}
.summary-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 20px;
}
.category-title {
border-bottom: 2px solid var(--accent-color);
padding-bottom: 10px;
margin-top: 0;
margin-bottom: 20px;
font-family: var(--primary-font);
}
.summary-list {
list-style: none;
padding: 0;
margin: 0;
}
.summary-item {
display: flex;
gap: 15px;
margin-bottom: 20px;
border-bottom: 1px dotted var(--border-color);
padding-bottom: 20px;
}
.summary-item:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
.summary-img {
width: 80px;
height: 80px;
flex-shrink: 0;
border-radius: 4px;
overflow: hidden;
}
.summary-img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.summary-content h3 {
margin: 0 0 5px 0;
font-size: 1.1rem;
line-height: 1.3;
}
.summary-content h3 a {
text-decoration: none;
color: var(--text-color);
}
.summary-content h3 a:hover {
color: var(--accent-color);
}
.meta {
font-size: 0.8rem;
color: #888;
}
</style>
{% endblock %}

2
templates/stats.html
View file

@ -552,7 +552,7 @@
}
updateSystemInfo();
setInterval(updateSystemInfo, 10000);
setInterval(updateSystemInfo, 40000);
});
</script>

815
templates/stats_entities.html
View file

File diff suppressed because it is too large Load diff

109
templates/traducciones.html
View file

@ -1,109 +0,0 @@
{% extends "base.html" %}
{% block title %}Últimas Traducciones{% endblock %}
{% block content %}
<div class="card">
<h2><i class="fas fa-language" style="color: var(--accent-color); margin-right: 10px;"></i>Últimas Traducciones</h2>
<p style="color: #666; margin-bottom: 20px;">
Mostrando las {{ traducciones|length }} traducciones más recientes de un total de {{ total }}.
</p>
</div>
<div id="traducciones-grid" style="margin-top: 20px;">
{% for t in traducciones %}
<article class="noticia-card">
{% if t.imagen %}
<img src="{{ t.imagen }}" alt="{{ t.titulo_trad }}" onerror="this.src='/static/placeholder.svg'; this.onerror=null;">
{% else %}
<img src="/static/placeholder.svg" alt="Sin imagen">
{% endif %}
<div class="noticia-meta">
<span class="lang-badge">{{ t.lang_from|upper }} → {{ t.lang_to|upper }}</span>
{% if t.categoria_nombre %}
<span class="category-badge">{{ t.categoria_nombre }}</span>
{% endif %}
{% if t.pais_nombre %}
• {{ t.pais_nombre }}
{% endif %}
</div>
<h3>
<a href="{{ t.link }}" target="_blank" rel="noopener">{{ t.titulo_trad or 'Sin título' }}</a>
</h3>
<p class="noticia-summary">
{{ t.resumen_trad[:300] }}{% if t.resumen_trad|length > 300 %}...{% endif %}
</p>
<div class="noticia-footer">
<small>
<i class="fas fa-rss"></i> {{ t.feed_nombre or 'Desconocido' }}
• <i class="fas fa-clock"></i> {{ t.updated_at|format_date if t.updated_at else 'Fecha desconocida' }}
</small>
</div>
</article>
{% else %}
<div class="card" style="text-align: center; padding: 40px;">
<i class="fas fa-inbox fa-3x" style="color: #ccc; margin-bottom: 20px;"></i>
<p>No hay traducciones disponibles aún.</p>
</div>
{% endfor %}
</div>
{% if total_pages > 1 %}
<div class="pagination" style="margin-top: 30px; text-align: center;">
{% if page > 1 %}
<a href="?page={{ page - 1 }}&per_page={{ per_page }}" class="btn btn-secondary">
<i class="fas fa-chevron-left"></i> Anterior
</a>
{% endif %}
<span style="margin: 0 20px;">Página {{ page }} de {{ total_pages }}</span>
{% if page < total_pages %}
<a href="?page={{ page + 1 }}&per_page={{ per_page }}" class="btn">
Siguiente <i class="fas fa-chevron-right"></i>
</a>
{% endif %}
</div>
{% endif %}
<style>
#traducciones-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
gap: 25px;
}
.lang-badge {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 3px 8px;
border-radius: 4px;
font-size: 0.75rem;
font-weight: bold;
}
.category-badge {
background: var(--accent-color);
color: white;
padding: 3px 8px;
border-radius: 4px;
font-size: 0.75rem;
margin-left: 8px;
}
.noticia-footer {
margin-top: 15px;
padding-top: 10px;
border-top: 1px solid var(--border-color);
color: #888;
font-size: 0.85rem;
}
.pagination .btn {
margin: 0 5px;
}
</style>
{% endblock %}