static/js/forum.js

document.addEventListener('DOMContentLoaded', function() {
    try {
        // Quote functionality
        setupQuoteButtons();
        
        // Reaction buttons
        setupReactionButtons();
        
        // Topic lock/pin confirmations
        setupModeratorActions();
        
        // Report form
        setupReportForms();
        
        // Search form validation
        setupSearchForm();
        
        // Confirmations for delete actions
        setupDeleteConfirmations();
    } catch (error) {
        console.log("Une erreur s'est produite lors de l'initialisation du JavaScript:", error);
    }
});

/**
 * Setup functionality for post quoting 
 */
function setupQuoteButtons() {
    const quoteButtons = document.querySelectorAll('.quote-button');
    
    quoteButtons.forEach(button => {
        button.addEventListener('click', function(e) {
            e.preventDefault();
            
            // If user has selected text, we'll quote only that part
            const selection = window.getSelection();
            if (selection && selection.toString().trim().length > 0) {
                // Get the selected text
                const selectedText = selection.toString().trim();
                
                // Get the post content element
                const postContent = this.closest('.post-content');
                if (postContent) {
                    // Get post author
                    const authorElement = this.closest('.post').querySelector('.post-author');
                    const author = authorElement ? authorElement.textContent.trim() : 'Someone';
                    
                    // Create a quote with the selected text
                    const quoteContent = `<blockquote><p>${selectedText}</p><footer>Posted by ${author}</footer></blockquote><p></p>`;
                    
                    // If we're on the topic page with a reply form
                    const replyForm = document.getElementById('reply-form');
                    if (replyForm) {
                        const textarea = replyForm.querySelector('textarea');
                        if (textarea) {
                            textarea.value += quoteContent;
                            textarea.focus();
                            // Scroll to the form
                            replyForm.scrollIntoView({ behavior: 'smooth' });
                        }
                    } else {
                        // We're not on a page with a reply form, store in session and redirect
                        sessionStorage.setItem('quoteContent', quoteContent);
                        window.location.href = this.getAttribute('href');
                    }
                }
            } else {
                // No text selected, just follow the link
                window.location.href = this.getAttribute('href');
            }
        });
    });
    
    // Check if we have stored quote content when loading a reply page
    const storedQuote = sessionStorage.getItem('quoteContent');
    if (storedQuote) {
        const textarea = document.querySelector('textarea[name="content"]');
        if (textarea) {
            textarea.value = storedQuote;
            textarea.focus();
            // Position cursor at the end
            textarea.selectionStart = textarea.selectionEnd = textarea.value.length;
        }
        // Clear the stored quote
        sessionStorage.removeItem('quoteContent');
    }
}

/**
 * Setup functionality for post reactions
 */
function setupReactionButtons() {
    const reactionButtons = document.querySelectorAll('.reaction-btn');
    
    reactionButtons.forEach(button => {
        button.addEventListener('click', function(e) {
            e.preventDefault();
            
            if (!document.body.classList.contains('logged-in')) {
                alert('Vous devez être connecté pour réagir aux publications');
                return;
            }
            
            const postId = this.dataset.postId;
            const reactionType = this.dataset.reactionType;
            const countElement = this.querySelector('.reaction-count');
            
            // Send AJAX request
            fetch(`/post/${postId}/react`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                    'X-CSRFToken': getCsrfToken()
                },
                body: `reaction_type=${reactionType}`
            })
            .then(response => response.json())
            .then(data => {
                // Update the button state
                if (data.status === 'added' || data.status === 'updated') {
                    // Add active class to this button, remove from others
                    const siblingButtons = this.parentNode.querySelectorAll('.reaction-btn');
                    siblingButtons.forEach(btn => btn.classList.remove('active'));
                    this.classList.add('active');
                } else if (data.status === 'removed') {
                    this.classList.remove('active');
                }
                
                // Update count
                if (countElement) {
                    countElement.textContent = data.count;
                    
                    // Hide count if zero
                    if (data.count === 0) {
                        countElement.classList.add('hidden');
                    } else {
                        countElement.classList.remove('hidden');
                    }
                }
            })
            .catch(error => {
                console.error('Error:', error);
            });
        });
    });
}

/**
 * Setup confirmation dialogs for moderator actions
 */
function setupModeratorActions() {
    const lockButton = document.getElementById('lock-topic-btn');
    const pinButton = document.getElementById('pin-topic-btn');
    
    if (lockButton) {
        lockButton.addEventListener('click', function(e) {
            const isLocked = this.dataset.isLocked === 'true';
            const action = isLocked ? 'déverrouiller' : 'verrouiller';
            
            if (!confirm(`Êtes-vous sûr de vouloir ${action} ce sujet ?`)) {
                e.preventDefault();
            }
        });
    }
    
    if (pinButton) {
        pinButton.addEventListener('click', function(e) {
            const isPinned = this.dataset.isPinned === 'true';
            const action = isPinned ? 'détacher' : 'épingler';
            
            if (!confirm(`Êtes-vous sûr de vouloir ${action} ce sujet ?`)) {
                e.preventDefault();
            }
        });
    }
}

/**
 * Setup report forms
 */
function setupReportForms() {
    const reportButtons = document.querySelectorAll('.report-button');
    const reportModal = document.getElementById('report-modal');
    const reportForm = document.getElementById('report-form');
    const closeModalButtons = document.querySelectorAll('.close-modal');
    
    // Show modal on report button click
    reportButtons.forEach(button => {
        button.addEventListener('click', function(e) {
            e.preventDefault();
            
            if (!document.body.classList.contains('logged-in')) {
                alert('Vous devez être connecté pour signaler ce contenu');
                return;
            }
            
            // Set the appropriate ID in the form
            const postId = this.dataset.postId;
            const topicId = this.dataset.topicId;
            
            if (postId) {
                document.getElementById('post_id').value = postId;
                document.getElementById('topic_id').value = '';
            } else if (topicId) {
                document.getElementById('topic_id').value = topicId;
                document.getElementById('post_id').value = '';
            }
            
            // Show the modal
            reportModal.classList.remove('hidden');
        });
    });
    
    // Close modal on close button click
    closeModalButtons.forEach(button => {
        button.addEventListener('click', function() {
            reportModal.classList.add('hidden');
        });
    });
    
    // Close modal when clicking outside
    reportModal.addEventListener('click', function(e) {
        if (e.target === reportModal) {
            reportModal.classList.add('hidden');
        }
    });
    
    // Validate report form
    if (reportForm) {
        reportForm.addEventListener('submit', function(e) {
            const reasonField = document.getElementById('reason');
            if (reasonField.value.trim().length < 10) {
                e.preventDefault();
                alert('Veuillez fournir une raison détaillée pour votre signalement (au moins 10 caractères)');
            }
        });
    }
}

/**
 * Setup search form validation
 */
function setupSearchForm() {
    const searchForm = document.getElementById('search-form');
    
    if (searchForm) {
        searchForm.addEventListener('submit', function(e) {
            const searchInput = document.getElementById('search-input');
            if (searchInput.value.trim().length < 3) {
                e.preventDefault();
                alert('La recherche doit contenir au moins 3 caractères');
            }
        });
    }
}

/**
 * Setup confirmation dialogs for delete actions
 */
function setupDeleteConfirmations() {
    const deleteButtons = document.querySelectorAll('.delete-button');
    
    deleteButtons.forEach(button => {
        button.addEventListener('click', function(e) {
            if (!confirm('Êtes-vous sûr de vouloir supprimer cet élément ? Cette action est irréversible.')) {
                e.preventDefault();
            }
        });
    });
}

/**
 * Get CSRF token from meta tag
 */
function getCsrfToken() {
    return document.querySelector('meta[name="csrf-token"]').getAttribute('content');
}