fix: restore proper spinning animation for mobile refresh FAB
Reverted HTML replacement approach and restored the cleaner CSS-based animation from commit1855085. Previous (wrong) approach: - Replaced button HTML with spinner - Modified both desktop and mobile buttons in apiClient.js - Messy and inconsistent Restored (correct) approach: - Add/remove .spinning CSS class in click handler - CSS animates only the icon inside the button - Button itself stays unchanged - Much cleaner implementation Changes: - Reverted apiClient.js changes from commit9a49433- Added .spinning CSS class and @keyframes rpg-spin - Updated index.js click handler to bind both buttons - Uses addClass/removeClass for clean animation control - Includes drag detection to prevent accidental clicks Now the mobile FAB icon spins smoothly when refreshing!
This commit is contained in:
@@ -97,16 +97,11 @@ export async function updateRPGData(renderUserStats, renderInfoBox, renderThough
|
||||
try {
|
||||
setIsGenerating(true);
|
||||
|
||||
// Update desktop button to show "Updating..." state
|
||||
// Update button to show "Updating..." state
|
||||
const $updateBtn = $('#rpg-manual-update');
|
||||
const originalHtml = $updateBtn.html();
|
||||
$updateBtn.html('<i class="fa-solid fa-spinner fa-spin"></i> Updating...').prop('disabled', true);
|
||||
|
||||
// Update mobile FAB to show spinner (icon only)
|
||||
const $updateBtnMobile = $('#rpg-manual-update-mobile');
|
||||
const originalHtmlMobile = $updateBtnMobile.html();
|
||||
$updateBtnMobile.html('<i class="fa-solid fa-spinner fa-spin"></i>').prop('disabled', true);
|
||||
|
||||
// Save current preset name before switching (if we're going to switch)
|
||||
if (extensionSettings.useSeparatePreset) {
|
||||
originalPresetName = await getCurrentPresetName();
|
||||
@@ -224,14 +219,10 @@ export async function updateRPGData(renderUserStats, renderInfoBox, renderThough
|
||||
|
||||
setIsGenerating(false);
|
||||
|
||||
// Restore desktop button to original state
|
||||
// Restore button to original state
|
||||
const $updateBtn = $('#rpg-manual-update');
|
||||
$updateBtn.html('<i class="fa-solid fa-sync"></i> Refresh RPG Info').prop('disabled', false);
|
||||
|
||||
// Restore mobile FAB to original state (icon only)
|
||||
const $updateBtnMobile = $('#rpg-manual-update-mobile');
|
||||
$updateBtnMobile.html('<i class="fa-solid fa-sync"></i>').prop('disabled', false);
|
||||
|
||||
// Reset the flag after tracker generation completes
|
||||
// This ensures the flag persists through both main generation AND tracker generation
|
||||
// console.log('[RPG Companion] 🔄 Tracker generation complete - resetting lastActionWasSwipe to false');
|
||||
|
||||
Reference in New Issue
Block a user