feat(setup): add done button and integrate NFO scan into initialization
- Add /api/setup/unresolved/done endpoint to mark phase complete - NFO scan now runs after series sync during initialization - Middleware redirects to /login after setup complete (was /loading) - Done button allows skipping folder resolution with redirect to NFO scan phase
This commit is contained in:
@@ -281,11 +281,13 @@
|
||||
let isComplete = false;
|
||||
|
||||
const stepOrder = [
|
||||
'series_sync'
|
||||
'series_sync',
|
||||
'nfo_scan'
|
||||
];
|
||||
|
||||
const stepTitles = {
|
||||
'series_sync': 'Syncing Series Database'
|
||||
'series_sync': 'Syncing Series Database',
|
||||
'nfo_scan': 'Scanning NFO Files'
|
||||
};
|
||||
|
||||
function connectWebSocket() {
|
||||
@@ -305,6 +307,14 @@
|
||||
room: 'system'
|
||||
}
|
||||
}));
|
||||
|
||||
// Subscribe to scan room for NFO scan progress
|
||||
ws.send(JSON.stringify({
|
||||
action: 'join',
|
||||
data: {
|
||||
room: 'scan'
|
||||
}
|
||||
}));
|
||||
};
|
||||
|
||||
ws.onmessage = (event) => {
|
||||
@@ -349,6 +359,12 @@
|
||||
const data = message.data || message;
|
||||
const { type, status, title, message: msg, percent, current, total, metadata } = data;
|
||||
|
||||
// Handle NFO scan events
|
||||
if (type === 'nfo_scan_started' || type === 'nfo_scan_progress' || type === 'nfo_scan_completed') {
|
||||
handleNfoScanUpdate(data);
|
||||
return;
|
||||
}
|
||||
|
||||
// Determine step ID based on type and metadata
|
||||
let stepId = metadata?.step_id || type;
|
||||
|
||||
@@ -370,6 +386,75 @@
|
||||
}
|
||||
}
|
||||
|
||||
function handleNfoScanUpdate(data) {
|
||||
const stepId = 'nfo_scan';
|
||||
|
||||
if (!steps.has(stepId)) {
|
||||
createStep(stepId, stepTitles[stepId] || 'Scanning NFO Files');
|
||||
}
|
||||
|
||||
const stepEl = steps.get(stepId);
|
||||
if (!stepEl) return;
|
||||
|
||||
const iconEl = stepEl.querySelector('.step-icon');
|
||||
const statusEl = stepEl.querySelector('.step-status');
|
||||
const messageEl = stepEl.querySelector('.step-message');
|
||||
const progressEl = stepEl.querySelector('.step-progress');
|
||||
const progressFillEl = stepEl.querySelector('.progress-bar-fill');
|
||||
const progressTextEl = stepEl.querySelector('.progress-text');
|
||||
|
||||
const nfoData = data.data || data;
|
||||
const { status, message, current, total, key, folder } = nfoData;
|
||||
|
||||
// Update status
|
||||
stepEl.className = 'progress-step';
|
||||
if (status === 'started') {
|
||||
stepEl.classList.add('active');
|
||||
iconEl.className = 'fas fa-circle-notch fa-spin step-icon loading';
|
||||
statusEl.textContent = 'Starting...';
|
||||
} else if (status === 'in_progress') {
|
||||
stepEl.classList.add('active');
|
||||
iconEl.className = 'fas fa-circle-notch fa-spin step-icon loading';
|
||||
statusEl.textContent = 'In Progress...';
|
||||
} else if (status === 'completed') {
|
||||
stepEl.classList.add('completed');
|
||||
iconEl.className = 'fas fa-check-circle step-icon completed';
|
||||
statusEl.textContent = 'Complete';
|
||||
} else if (status === 'failed') {
|
||||
stepEl.classList.add('error');
|
||||
iconEl.className = 'fas fa-exclamation-circle step-icon error';
|
||||
statusEl.textContent = 'Failed';
|
||||
}
|
||||
|
||||
// Update message - show current folder being processed
|
||||
if (message) {
|
||||
messageEl.textContent = message;
|
||||
messageEl.style.display = 'block';
|
||||
} else if (key && folder) {
|
||||
messageEl.textContent = `Processing: ${folder}`;
|
||||
messageEl.style.display = 'block';
|
||||
}
|
||||
|
||||
// Update progress bar
|
||||
if (current > 0 && total > 0) {
|
||||
const actualPercent = (current / total) * 100;
|
||||
progressEl.style.display = 'block';
|
||||
progressFillEl.style.width = `${actualPercent}%`;
|
||||
progressTextEl.textContent = `${current}/${total} series`;
|
||||
} else if (percent > 0) {
|
||||
progressEl.style.display = 'block';
|
||||
progressFillEl.style.width = `${percent}%`;
|
||||
progressTextEl.textContent = `${Math.round(percent)}%`;
|
||||
}
|
||||
|
||||
// Check for completion
|
||||
if (data.type === 'nfo_scan_completed') {
|
||||
setTimeout(() => {
|
||||
checkUnresolvedAndProceed();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
|
||||
function createStep(stepId, title) {
|
||||
const container = document.getElementById('progressContainer');
|
||||
|
||||
@@ -475,8 +560,8 @@
|
||||
}
|
||||
|
||||
async function checkUnresolvedAndProceed() {
|
||||
// Fetch unresolved folders and only redirect if there are any
|
||||
// Otherwise go directly to login
|
||||
// Always check for unresolved folders first
|
||||
// After setup -> loading, always go through unresolved if there are any
|
||||
try {
|
||||
const token = localStorage.getItem('auth_token');
|
||||
const res = await fetch('/api/setup/unresolved', {
|
||||
@@ -493,7 +578,7 @@
|
||||
} catch (err) {
|
||||
console.error('Failed to check unresolved folders:', err);
|
||||
}
|
||||
// No unresolved folders or error - go to login
|
||||
// No unresolved folders - go to login
|
||||
window.location.href = '/login';
|
||||
}
|
||||
|
||||
|
||||
@@ -415,6 +415,36 @@
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.done-btn {
|
||||
background: var(--color-success);
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.75rem 1.5rem;
|
||||
border-radius: var(--border-radius-md);
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
transition: all var(--transition-duration);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.done-btn:hover:not(:disabled) {
|
||||
background: #27ae60;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.done-btn:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.folder-input-row {
|
||||
flex-direction: column;
|
||||
@@ -439,6 +469,11 @@
|
||||
</div>
|
||||
<h1>Resolve Unresolved Series</h1>
|
||||
<p>Some series couldn't be found automatically. Enter the provider key for each folder to complete setup.</p>
|
||||
<div class="header-actions">
|
||||
<button class="done-btn" id="done-btn" onclick="handleDone()">
|
||||
<i class="fas fa-check"></i> Done
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="loading-state" class="loading-state">
|
||||
@@ -754,6 +789,7 @@
|
||||
const listEl = document.getElementById('folder-list');
|
||||
const emptyEl = document.getElementById('empty-state');
|
||||
const skipLink = document.getElementById('skip-link');
|
||||
const doneBtn = document.getElementById('done-btn');
|
||||
|
||||
if (listEl.children.length === 0) {
|
||||
listEl.style.display = 'none';
|
||||
@@ -764,11 +800,54 @@
|
||||
}
|
||||
}
|
||||
|
||||
async function completeUnresolved() {
|
||||
const token = localStorage.getItem('auth_token');
|
||||
const res = await fetch('/api/setup/unresolved/done', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Authorization': `Bearer ${token}`,
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
});
|
||||
return res.json();
|
||||
}
|
||||
|
||||
async function handleDone() {
|
||||
const doneBtn = document.getElementById('done-btn');
|
||||
doneBtn.disabled = true;
|
||||
doneBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Processing...';
|
||||
|
||||
try {
|
||||
const result = await completeUnresolved();
|
||||
if (result.status === 'success') {
|
||||
showToast(result.message, 'success');
|
||||
setTimeout(() => { window.location.href = '/loading'; }, 1000);
|
||||
} else {
|
||||
showToast(result.message || 'Failed to complete', 'error');
|
||||
doneBtn.disabled = false;
|
||||
doneBtn.innerHTML = '<i class="fas fa-check"></i> Done';
|
||||
}
|
||||
} catch (err) {
|
||||
showToast('Server error. Please try again.', 'error');
|
||||
doneBtn.disabled = false;
|
||||
doneBtn.innerHTML = '<i class="fas fa-check"></i> Done';
|
||||
}
|
||||
}
|
||||
|
||||
// Show Done button when there are folders
|
||||
function showDoneButton() {
|
||||
const doneBtn = document.getElementById('done-btn');
|
||||
doneBtn.style.display = 'inline-flex';
|
||||
}
|
||||
|
||||
// Init
|
||||
(async function init() {
|
||||
const folders = await fetchUnresolved();
|
||||
if (folders !== null) {
|
||||
renderFolders(folders);
|
||||
if (folders.length > 0) {
|
||||
showDoneButton();
|
||||
}
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user