<?php
/**
 * Gallery Slider Block Debugging Tool
 * 
 * To use: Add ?bw_debug=gallery to any page URL that contains a gallery slider
 */

// Only run for administrators
if (!current_user_can('administrator')) {
    return;
}

// Check for debug parameter
if (!isset($_GET['bw_debug']) || $_GET['bw_debug'] !== 'gallery') {
    return;
}

// Add debugging style
function bw_gallery_debug_styles() {
    echo '<style>
        .bw-debug-panel {
            position: fixed;
            bottom: 0;
            right: 0;
            width: 400px;
            max-height: 500px;
            overflow: auto;
            background: #fff;
            border: 1px solid #ddd;
            box-shadow: 0 0 10px rgba(0,0,0,0.1);
            z-index: 999999;
            padding: 15px;
            font-family: monospace;
            font-size: 12px;
        }
        .bw-debug-panel h3 {
            margin: 0 0 10px 0;
            padding-bottom: 5px;
            border-bottom: 1px solid #eee;
        }
        .bw-debug-panel pre {
            white-space: pre-wrap;
            word-wrap: break-word;
            background: #f5f5f5;
            padding: 10px;
            max-height: 300px;
            overflow: auto;
        }
        .bw-debug-panel .bw-debug-close {
            position: absolute;
            top: 5px;
            right: 5px;
            cursor: pointer;
            font-weight: bold;
        }
    </style>';
}
add_action('wp_head', 'bw_gallery_debug_styles');

// Add debugging script
function bw_gallery_debug_script() {
    ?>
    <script>
    jQuery(document).ready(function($) {
        // Check if jQuery is loaded
        console.log('jQuery version: ' + $.fn.jquery);
        
        // Check if Slick is loaded
        if (typeof $.fn.slick !== 'undefined') {
            console.log('Slick is loaded correctly');
        } else {
            console.error('Slick is NOT loaded correctly');
        }
        
        // Check all gallery sliders
        $('.bw-gallery-slider-container').each(function(index) {
            var sliderId = $(this).attr('id');
            var slideCount = $(this).find('.slide').length;
            console.log('Gallery #' + index + ' (ID: ' + sliderId + ') has ' + slideCount + ' slides');
            
            if (slideCount < 2) {
                console.warn('Gallery #' + index + ' has fewer than 2 slides');
            }
        });
        
        // Create debug panel
        var debugInfo = '';
        debugInfo += '<h4>jQuery</h4>';
        debugInfo += '<p>Version: ' + $.fn.jquery + '</p>';
        debugInfo += '<p>Slick loaded: ' + (typeof $.fn.slick !== 'undefined') + '</p>';
        
        debugInfo += '<h4>Gallery Sliders</h4>';
        var galleryCount = $('.bw-gallery-slider-container').length;
        if (galleryCount === 0) {
            debugInfo += '<p>No gallery sliders found on page</p>';
        } else {
            $('.bw-gallery-slider-container').each(function(index) {
                var sliderId = $(this).attr('id');
                var slideCount = $(this).find('.slide').length;
                debugInfo += '<p>Gallery #' + index + ' (ID: ' + sliderId + ') has ' + slideCount + ' slides</p>';
            });
        }
        
        debugInfo += '<h4>Slick Files</h4>';
        debugInfo += '<ul>';
        debugInfo += '<li>slick.min.js: ' + (typeof $.fn.slick !== 'undefined' ? 'Loaded' : 'Not loaded') + '</li>';
        $('link').each(function() {
            if ($(this).attr('href') && $(this).attr('href').indexOf('slick') !== -1) {
                debugInfo += '<li>' + $(this).attr('href') + ': Loaded</li>';
            }
        });
        debugInfo += '</ul>';
        
        // Add debug panel to body
        $('body').append(
            '<div class="bw-debug-panel">' +
            '<span class="bw-debug-close">×</span>' +
            '<h3>BW Gallery Slider Debug</h3>' +
            debugInfo +
            '</div>'
        );
        
        // Close button
        $('.bw-debug-close').on('click', function() {
            $('.bw-debug-panel').remove();
        });
    });
    </script>
    <?php
}
add_action('wp_footer', 'bw_gallery_debug_script', 99);

/**
 * Check if slick files are accessible
 */
function bw_check_slick_files() {
    $theme_dir = get_stylesheet_directory();
    $slick_js = $theme_dir . '/blocks/bw-gallery-slider/slick/slick.min.js';
    $slick_css = $theme_dir . '/blocks/bw-gallery-slider/slick/slick.css';
    $slick_theme_css = $theme_dir . '/blocks/bw-gallery-slider/slick/slick-theme.css';
    
    $results = array(
        'slick.min.js' => file_exists($slick_js) ? 'Found' : 'Missing',
        'slick.css' => file_exists($slick_css) ? 'Found' : 'Missing',
        'slick-theme.css' => file_exists($slick_theme_css) ? 'Found' : 'Missing'
    );
    
    // Add admin notice
    add_action('admin_notices', function() use ($results) {
        ?>
        <div class="notice notice-info">
            <p><strong>BW Gallery Slider Debug:</strong></p>
            <ul>
                <li>slick.min.js: <?php echo $results['slick.min.js']; ?></li>
                <li>slick.css: <?php echo $results['slick.css']; ?></li>
                <li>slick-theme.css: <?php echo $results['slick-theme.css']; ?></li>
            </ul>
        </div>
        <?php
    });
    
    return $results;
}
bw_check_slick_files();