Hide sync sidebar by default, only show during active sync
This commit is contained in:
parent
363b3d0922
commit
719980cf5a
2 changed files with 34 additions and 9 deletions
|
|
@ -558,6 +558,9 @@ class SequentialSyncManager {
|
||||||
this.updateUI();
|
this.updateUI();
|
||||||
updateRefreshButtonState(); // Refresh button state after completion
|
updateRefreshButtonState(); // Refresh button state after completion
|
||||||
showToast(`Sequential sync completed for ${completedCount} playlists in ${duration}s`, 'success');
|
showToast(`Sequential sync completed for ${completedCount} playlists in ${duration}s`, 'success');
|
||||||
|
|
||||||
|
// Hide sidebar after completion
|
||||||
|
hideSyncSidebar();
|
||||||
}
|
}
|
||||||
|
|
||||||
cancel() {
|
cancel() {
|
||||||
|
|
@ -575,6 +578,9 @@ class SequentialSyncManager {
|
||||||
this.updateUI();
|
this.updateUI();
|
||||||
updateRefreshButtonState(); // Refresh button state after cancellation
|
updateRefreshButtonState(); // Refresh button state after cancellation
|
||||||
showToast('Sequential sync cancelled', 'info');
|
showToast('Sequential sync cancelled', 'info');
|
||||||
|
|
||||||
|
// Hide sidebar after cancellation
|
||||||
|
hideSyncSidebar();
|
||||||
}
|
}
|
||||||
|
|
||||||
updateUI() {
|
updateUI() {
|
||||||
|
|
@ -13064,6 +13070,25 @@ function stopSyncPolling(playlistId) {
|
||||||
updateRefreshButtonState();
|
updateRefreshButtonState();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Sync sidebar visibility helpers
|
||||||
|
function showSyncSidebar() {
|
||||||
|
const sidebar = document.querySelector('.sync-sidebar');
|
||||||
|
const contentArea = document.querySelector('.sync-content-area');
|
||||||
|
if (sidebar && contentArea && window.innerWidth > 1300) {
|
||||||
|
sidebar.style.display = '';
|
||||||
|
contentArea.style.gridTemplateColumns = '2.5fr 0.75fr';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function hideSyncSidebar() {
|
||||||
|
const sidebar = document.querySelector('.sync-sidebar');
|
||||||
|
const contentArea = document.querySelector('.sync-content-area');
|
||||||
|
if (sidebar && contentArea) {
|
||||||
|
sidebar.style.display = 'none';
|
||||||
|
contentArea.style.gridTemplateColumns = '1fr';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Sequential Sync Functions
|
// Sequential Sync Functions
|
||||||
function startSequentialSync() {
|
function startSequentialSync() {
|
||||||
// Initialize manager if needed
|
// Initialize manager if needed
|
||||||
|
|
@ -13096,6 +13121,9 @@ function startSequentialSync() {
|
||||||
|
|
||||||
console.log(`🚀 Starting sequential sync for ${orderedPlaylistIds.length} playlists`);
|
console.log(`🚀 Starting sequential sync for ${orderedPlaylistIds.length} playlists`);
|
||||||
|
|
||||||
|
// Show sidebar for sync progress
|
||||||
|
showSyncSidebar();
|
||||||
|
|
||||||
// Start sequential sync
|
// Start sequential sync
|
||||||
sequentialSyncManager.start(orderedPlaylistIds);
|
sequentialSyncManager.start(orderedPlaylistIds);
|
||||||
|
|
||||||
|
|
@ -22601,13 +22629,9 @@ function initializeSyncPage() {
|
||||||
// Show/hide sidebar based on active tab (skip on mobile where sidebar is always hidden)
|
// Show/hide sidebar based on active tab (skip on mobile where sidebar is always hidden)
|
||||||
if (syncSidebar && syncContentArea) {
|
if (syncSidebar && syncContentArea) {
|
||||||
const isMobile = window.innerWidth <= 1300;
|
const isMobile = window.innerWidth <= 1300;
|
||||||
if (tabId === 'spotify' && !isMobile) {
|
// Sidebar always hidden by default — shown only when sync is active
|
||||||
syncSidebar.style.display = '';
|
syncSidebar.style.display = 'none';
|
||||||
syncContentArea.style.gridTemplateColumns = '2.5fr 0.75fr';
|
syncContentArea.style.gridTemplateColumns = '1fr';
|
||||||
} else {
|
|
||||||
syncSidebar.style.display = 'none';
|
|
||||||
syncContentArea.style.gridTemplateColumns = '1fr';
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Auto-load mirrored playlists on first tab activation
|
// Auto-load mirrored playlists on first tab activation
|
||||||
|
|
|
||||||
|
|
@ -6573,8 +6573,8 @@ body {
|
||||||
|
|
||||||
.sync-content-area {
|
.sync-content-area {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 2.5fr 0.75fr;
|
grid-template-columns: 1fr;
|
||||||
/* More space for main panel, smaller sidebar */
|
/* Sidebar hidden by default, shown when sync starts */
|
||||||
gap: 25px;
|
gap: 25px;
|
||||||
/* min-height: calc(90vh - 200px); Minimum height, but allow expansion */
|
/* min-height: calc(90vh - 200px); Minimum height, but allow expansion */
|
||||||
height: 95%;
|
height: 95%;
|
||||||
|
|
@ -6612,6 +6612,7 @@ body {
|
||||||
|
|
||||||
.sync-sidebar {
|
.sync-sidebar {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Tab System */
|
/* Tab System */
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue