Auto commit: 2026-02-16T22:54:44.202Z

This commit is contained in:
Flatlogic Bot 2026-02-16 22:54:44 +00:00
parent e7beea1aa6
commit 553f2310eb

View File

@ -191,6 +191,67 @@ $history = $stmt->fetchAll();
backdrop-filter: blur(5px);
transition: all 0.3s;
}
.controls-row {
display: flex;
gap: 1rem;
margin-bottom: 1.5rem;
}
.search-container {
flex: 1;
position: relative;
}
.search-container i {
position: absolute;
left: 1rem;
top: 50%;
transform: translateY(-50%);
opacity: 0.5;
}
.search-input {
width: 100%;
background: var(--glass-bg);
border: 1px solid var(--glass-border);
padding: 0.8rem 1rem 0.8rem 2.8rem;
border-radius: 12px;
color: var(--text-color);
font-family: inherit;
box-sizing: border-box;
outline: none;
transition: all 0.3s;
}
.search-input:focus {
border-color: var(--primary-color);
background: rgba(255, 255, 255, 0.08);
}
[data-theme="light"] .search-input:focus {
background: #fff;
}
.download-btn {
background: var(--primary-color);
color: #fff;
border: none;
padding: 0 1.2rem;
border-radius: 12px;
cursor: pointer;
display: flex;
align-items: center;
gap: 0.5rem;
font-weight: 600;
transition: all 0.3s;
white-space: nowrap;
}
.download-btn:hover {
opacity: 0.9;
transform: translateY(-2px);
}
</style>
</head>
<body data-theme="dark">
@ -208,7 +269,17 @@ $history = $stmt->fetchAll();
</button>
</div>
<div class="history-list">
<div class="controls-row">
<div class="search-container">
<i class="bi bi-search"></i>
<input type="text" id="search-input" class="search-input" placeholder="Buscar canción o artista..." onkeyup="filterHistory()">
</div>
<button onclick="downloadHistory()" class="download-btn">
<i class="bi bi-download"></i> GUARDAR
</button>
</div>
<div class="history-list" id="history-list">
<?php if (empty($history)): ?>
<div style="text-align: center; opacity: 0.5; padding: 2rem;">No hay canciones registradas en las últimas 24 horas.</div>
<?php else: ?>
@ -258,6 +329,70 @@ $history = $stmt->fetchAll();
themeBtn.classList.add('bi-sun-fill');
}
})();
function filterHistory() {
const input = document.getElementById('search-input');
const filter = input.value.toLowerCase();
const list = document.getElementById('history-list');
const items = list.getElementsByClassName('history-item');
for (let i = 0; i < items.length; i++) {
const titleElement = items[i].querySelector('.history-title');
const artistElement = items[i].querySelector('.history-artist');
if (!titleElement || !artistElement) continue;
const title = titleElement.innerText.toLowerCase();
const artist = artistElement.innerText.toLowerCase();
if (title.includes(filter) || artist.includes(filter)) {
items[i].style.display = "";
} else {
items[i].style.display = "none";
}
}
}
function downloadHistory() {
const list = document.getElementById('history-list');
const items = list.getElementsByClassName('history-item');
let content = "Lili Records Radio - Historial de Canciones\n";
content += "========================================\n\n";
let count = 0;
for (let i = 0; i < items.length; i++) {
if (items[i].style.display !== "none") {
const titleElement = items[i].querySelector('.history-title');
const artistElement = items[i].querySelector('.history-artist');
const timeElement = items[i].querySelector('.history-time');
if (!titleElement || !artistElement || !timeElement) continue;
const title = titleElement.innerText;
const artist = artistElement.innerText;
const time = timeElement.innerText;
content += `[${time}] ${title} - ${artist}\n`;
count++;
}
}
if (count === 0) {
alert("No hay canciones para descargar.");
return;
}
const blob = new Blob([content], { type: 'text/plain' });
const url = window.URL.createObjectURL(blob);
const a = document.createElement('a');
const date = new Date().toISOString().split('T')[0];
a.setAttribute('hidden', '');
a.setAttribute('href', url);
a.setAttribute('download', `historial-radio-${date}.txt`);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
}
</script>
</body>
</html>