element.classList.toggle('selected'); console.log(`Toggled selection for ${element.getAttribute('data-note')}`); } }; // Global function to handle subscription window.handleSubscription = function() { const selectedNotes = document.querySelectorAll('.sruthi-note.selected'); if (selectedNotes.length === 0) { alert('Please select at least one note to subscribe to.'); return; } // Get current purchased notes let purchasedNotes = []; try { const subscriptionPreferences = localStorage.getItem('subscriptionPreferences'); if (subscriptionPreferences) { const preferences = JSON.parse(subscriptionPreferences); if (preferences.sruthi && Array.isArray(preferences.sruthi)) { purchasedNotes = preferences.sruthi; } } } catch (error) { console.error('Error parsing purchased notes:', error); } // Collect newly selected notes const newlySubscribedNotes = []; selectedNotes.forEach(note => { const noteValue = note.getAttribute('data-note'); if (!purchasedNotes.includes(noteValue)) { purchasedNotes.push(noteValue); newlySubscribedNotes.push(noteValue); } note.classList.remove('selected'); note.classList.add('purchased'); }); // Save to localStorage (in a real app, this would be saved to the server) localStorage.setItem('subscriptionPreferences', JSON.stringify({ sruthi: purchasedNotes })); // Update the available swaras in the player if (window.updateAvailableSwaras) { window.updateAvailableSwaras(purchasedNotes); } // Show success message with the newly subscribed notes if (newlySubscribedNotes.length > 0) { alert(`You have successfully subscribed to the following notes: ${newlySubscribedNotes.join(', ')}`); } else { alert('Your subscription has been updated successfully!'); } // Update the UI to reflect the changes updatePurchasedNotes(); }; // Debug function to help troubleshoot subscription issues window.debugSubscription = function() { console.log('Debugging subscription panel:'); const sruthiNotes = document.querySelectorAll('.sruthi-note'); console.log(`Found ${sruthiNotes.length} sruthi notes in the panel`); sruthiNotes.forEach(note => { const noteValue = note.getAttribute('data-note'); const isPurchased = note.classList.contains('purchased'); const isSelected = note.classList.contains('selected'); const isActive = note.classList.contains('current-active'); console.log(`Note: ${noteValue}, Purchased: ${isPurchased}, Selected: ${isSelected}, Active: ${isActive}`); }); // Test click on first non-purchased note const nonPurchasedNote = Array.from(sruthiNotes).find(note => !note.classList.contains('purchased')); if (nonPurchasedNote) { console.log(`Testing click on non-purchased note: ${nonPurchasedNote.getAttribute('data-note')}`); nonPurchasedNote.click(); setTimeout(() => { console.log(`After click, selected: ${nonPurchasedNote.classList.contains('selected')}`); }, 100); } }; });