joaquin/KiraTV-APP-NodeCast-Modificada-y-Personalizada
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactored EPG refresh logic

Browse Source
This commit is contained in:
Trevor Mears
2026-01-02 15:00:11 -08:00
parent 02ff6f3f80
commit c48f2e070e
3 changed files with 113 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+16 -9
View File
@@ -3,7 +3,8 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="mobile-web-app-capable" content="yes">
@@ -124,27 +125,29 @@
<section class="player-section">
<div class="video-container">
<video id="video-player" controls playsinline></video>
<!-- Custom Mobile Controls -->
<div class="video-controls" id="video-controls">
<button class="video-control-btn" id="btn-play" title="Play/Pause">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="icon">
<path d="M8 5v14l11-7z"/>
<path d="M8 5v14l11-7z" />
</svg>
</button>
<button class="video-control-btn" id="btn-mute" title="Mute/Unmute">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="icon">
<path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/>
<path
d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z" />
</svg>
</button>
<button class="video-control-btn" id="btn-pip" title="Picture in Picture">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="icon">
<path d="M19 7h-8v6h8V7zm2-4H3c-1.1 0-2 .9-2 2v14c0 1.1.9 1.98 2 1.98h18c1.1 0 2-.88 2-1.98V5c0-1.1-.9-2-2-2zm0 16.01H3V4.98h18v14.03z"/>
<path
d="M19 7h-8v6h8V7zm2-4H3c-1.1 0-2 .9-2 2v14c0 1.1.9 1.98 2 1.98h18c1.1 0 2-.88 2-1.98V5c0-1.1-.9-2-2-2zm0 16.01H3V4.98h18v14.03z" />
</svg>
</button>
<button class="video-control-btn" id="btn-fullscreen" title="Fullscreen">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="icon">
<path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/>
<path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z" />
</svg>
</button>
</div>
@@ -322,7 +325,11 @@
<option value="0">Manual only</option>
</select>
</div>
<p class="hint">Use the 🔄 button next to EPG sources for manual refresh</p>
<p class="hint">Use the <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"
class="icon" style="width: 1em; height: 1em; vertical-align: middle;">
<path
d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z" />
</svg> button next to EPG sources for manual refresh</p>
</div>
</div>
@@ -482,7 +489,7 @@
<div class="settings-section">
<h3>User Management</h3>
<p class="hint">Manage user accounts and permissions</p>
<div class="user-list-container">
<table class="user-table">
<thead>
@@ -500,7 +507,7 @@
</tbody>
</table>
</div>
<div class="add-user-section">
<h4>Add New User</h4>
<form id="add-user-form" class="user-form">
public/js/components/EpgGuide.js
+78 -1
View File
@@ -122,11 +122,83 @@ class EpgGuide {
getRefreshInterval() {
// Read from server-side player settings (synced via Settings page)
if (window.app?.player?.settings?.epgRefreshInterval) {
return parseInt(window.app.player.settings.epgRefreshInterval);
return parseFloat(window.app.player.settings.epgRefreshInterval);
}
return 24; // Default 24 hours
}
/**
* Start background EPG refresh timer
* Automatically fetches fresh EPG data at the configured interval
*/
startBackgroundRefresh() {
// Clear any existing timer
this.stopBackgroundRefresh();
const intervalHours = this.getRefreshInterval();
// If interval is 0 or invalid, don't start timer (manual refresh only)
if (!intervalHours || intervalHours <= 0) {
console.log('[EPG] Background refresh disabled (manual only mode)');
this._currentRefreshInterval = 0;
return;
}
const intervalMs = intervalHours * 60 * 60 * 1000; // Convert hours to milliseconds
console.log(`[EPG] Starting background refresh timer: every ${intervalHours} hours (${Math.round(intervalMs / 1000)}s)`);
this._backgroundRefreshTimer = setInterval(async () => {
console.log('[EPG] Background refresh triggered');
try {
await this.fetchEpgData(true); // Force refresh
this.lastRefreshTime = new Date();
console.log('[EPG] Background refresh complete');
// Update channel list program info if visible
if (window.app?.channelList) {
window.app.channelList.clearProgramInfoCache();
window.app.channelList.updateVisibleEpgInfo?.();
}
} catch (err) {
console.error('[EPG] Background refresh failed:', err);
}
}, intervalMs);
// Store current interval so we can detect changes
this._currentRefreshInterval = intervalHours;
}
/**
* Stop background EPG refresh timer
*/
stopBackgroundRefresh() {
if (this._backgroundRefreshTimer) {
clearInterval(this._backgroundRefreshTimer);
this._backgroundRefreshTimer = null;
console.log('[EPG] Background refresh timer stopped');
}
}
/**
* Restart background refresh if interval has changed
* Called when settings change
*/
restartBackgroundRefreshIfNeeded() {
const newInterval = this.getRefreshInterval();
if (this._currentRefreshInterval !== newInterval) {
console.log(`[EPG] Refresh interval changed: ${this._currentRefreshInterval}h -> ${newInterval}h`);
this.startBackgroundRefresh();
}
}
/**
* Get last refresh time for display
*/
getLastRefreshTime() {
return this.lastRefreshTime || null;
}
/**
* Load EPG data (server-side caching)
*/
@@ -134,7 +206,12 @@ class EpgGuide {
try {
this.container.innerHTML = '<div class="loading"></div>';
await this.fetchEpgData(forceRefresh);
this.lastRefreshTime = new Date();
this.render();
// Start background refresh timer after initial load
// This ensures EPG data stays fresh while the app is open
this.startBackgroundRefresh();
} catch (err) {
console.error('Error loading EPG:', err);
this.container.innerHTML = `
public/js/pages/Settings.js
+19 -14
View File
@@ -19,7 +19,7 @@ class SettingsPage {
// Player settings
this.initPlayerSettings();
// User management (admin only)
this.initUserManagement();
}
@@ -112,10 +112,15 @@ class SettingsPage {
// Load saved value from player settings
epgRefreshSelect.value = this.app.player.settings.epgRefreshInterval || '24';
// Save on change
// Save on change and restart background timer
epgRefreshSelect.addEventListener('change', () => {
this.app.player.settings.epgRefreshInterval = epgRefreshSelect.value;
this.app.player.saveSettings();
// Restart EPG background refresh with new interval
if (window.app?.epgGuide) {
window.app.epgGuide.restartBackgroundRefreshIfNeeded();
}
});
}
@@ -136,17 +141,17 @@ class SettingsPage {
initUserManagement() {
// User tab visibility is handled in show() method
// when currentUser is available
// Handle add user form
const addUserForm = document.getElementById('add-user-form');
if (addUserForm) {
addUserForm.addEventListener('submit', async (e) => {
e.preventDefault();
const username = document.getElementById('new-username').value;
const password = document.getElementById('new-password').value;
const role = document.getElementById('new-role').value;
try {
await API.users.create({ username, password, role });
alert('User created successfully!');
@@ -162,15 +167,15 @@ class SettingsPage {
async loadUsers() {
const userList = document.getElementById('user-list');
if (!userList) return;
try {
const users = await API.users.getAll();
if (users.length === 0) {
userList.innerHTML = '<tr><td colspan="4" class="hint">No users found</td></tr>';
return;
}
userList.innerHTML = users.map(user => `
<tr>
<td>${user.username}</td>
@@ -192,17 +197,17 @@ class SettingsPage {
const username = prompt('Enter new username (leave blank to keep current):');
const password = prompt('Enter new password (leave blank to keep current):');
const role = prompt('Enter role (admin or viewer, leave blank to keep current):');
const updates = {};
if (username) updates.username = username;
if (password) updates.password = password;
if (role) updates.role = role;
if (Object.keys(updates).length === 0) {
alert('No changes made');
return;
}
try {
await API.users.update(userId, updates);
alert('User updated successfully!');
@@ -216,7 +221,7 @@ class SettingsPage {
if (!confirm(`Are you sure you want to delete user "${username}"?`)) {
return;
}
try {
await API.users.delete(userId);
alert('User deleted successfully!');
@@ -234,7 +239,7 @@ class SettingsPage {
if (tabName === 'content') {
this.app.sourceManager.loadContentSources();
}
// Load users when switching to users tab
if (tabName === 'users') {
this.loadUsers();
@@ -249,7 +254,7 @@ class SettingsPage {
usersTab.style.display = 'block';
}
}
// Load sources when page is shown
await this.app.sourceManager.loadSources();