wpa-superstar-plugin/admin/settings/tabs/class-seoprostack-tab-pro-plugins.php

<?php
/**
 * The Pro Plugins tab for plugin settings.
 *
 * @package SEO_Pro_Stack
 * @subpackage SEO_Pro_Stack/Admin/Settings/Tabs
 */

// If this file is called directly, abort.
if (!defined('ABSPATH')) {
    exit;
}

/**
 * The Pro Plugins tab for plugin settings.
 */
class SEOProStack_Tab_Pro_Plugins {

    /**
     * Render the tab content.
     */
    public function render() {
        ?>
        <div class="seoprostack-settings-content tab-content" id="pro-plugins">
            <div class="seoprostack-setting-section">
                <h2><?php esc_html_e('Premium WordPress Plugins', 'seoprostack'); ?></h2>
                <p class="description"><?php esc_html_e('These premium plugins enhance your WordPress site with advanced features and functionality.', 'seoprostack'); ?></p>
                
                <div class="seoprostack-plugin-filters" id="seoprostack-plugin-filters">
                    <a href="#" class="button current" data-category="all"><?php esc_html_e('All', 'seoprostack'); ?></a>
                    <a href="#" class="button" data-category="seo"><?php esc_html_e('SEO', 'seoprostack'); ?></a>
                    <a href="#" class="button" data-category="performance"><?php esc_html_e('Performance', 'seoprostack'); ?></a>
                    <a href="#" class="button" data-category="analytics"><?php esc_html_e('Analytics', 'seoprostack'); ?></a>
                </div>
                
                <div class="seoprostack-loading" style="text-align: center; padding: 30px; display: none;">
                    <span class="spinner is-active"></span>
                    <p><?php esc_html_e('Loading plugins...', 'seoprostack'); ?></p>
                </div>
                
                <div class="seoprostack-plugin-list" id="seoprostack-plugin-list">
                    <!-- Plugins will be loaded here via AJAX -->
                </div>
                
                <div class="seoprostack-no-plugins" style="display: none;">
                    <p><?php esc_html_e('No plugins found matching your criteria.', 'seoprostack'); ?></p>
                </div>
            </div>
            
            <script type="text/javascript">
                jQuery(document).ready(function($) {
                    // Function to load plugins
                    function loadProPlugins(category) {
                        var $container = $('#seoprostack-plugin-list');
                        var $loading = $('.seoprostack-loading');
                        var $noPlugins = $('.seoprostack-no-plugins');
                        
                        // Reset container and show loading
                        $container.empty();
                        $noPlugins.hide();
                        $loading.show();
                        
                        // Make AJAX request
                        $.ajax({
                            url: seoProStack.ajaxurl,
                            type: 'POST',
                            data: {
                                action: 'seoprostack_get_pro_plugins',
                                category: category,
                                nonce: seoProStack.nonce
                            },
                            success: function(response) {
                                $loading.hide();
                                
                                if (response.success && response.data.plugins && response.data.plugins.length > 0) {
                                    // Render plugins
                                    $.each(response.data.plugins, function(index, plugin) {
                                        var $pluginCard = $('<div class="seoprostack-plugin-card" />');
                                        
                                        // Plugin header
                                        var $header = $('<div class="seoprostack-plugin-header" />');
                                        $header.append('<h3>' + plugin.name + '</h3>');
                                        $header.append('<span class="seoprostack-plugin-version">v' + plugin.version + '</span>');
                                        $pluginCard.append($header);
                                        
                                        // Plugin content
                                        var $content = $('<div class="seoprostack-plugin-content" />');
                                        $content.append('<p>' + plugin.description + '</p>');
                                        
                                        // Plugin actions
                                        var $actions = $('<div class="seoprostack-plugin-actions" />');
                                        
                                        if (plugin.status === 'installed') {
                                            if (plugin.active) {
                                                $actions.append('<span class="button button-disabled">Active</span>');
                                            } else {
                                                $actions.append('<a href="#" class="button activate-plugin" data-plugin="' + plugin.path + '">Activate</a>');
                                            }
                                        } else {
                                            $actions.append('<a href="' + plugin.url + '" class="button button-primary" target="_blank">Get Plugin</a>');
                                        }
                                        
                                        $content.append($actions);
                                        $pluginCard.append($content);
                                        
                                        // Add card to container
                                        $container.append($pluginCard);
                                    });
                                } else {
                                    $noPlugins.show();
                                }
                            },
                            error: function() {
                                $loading.hide();
                                $noPlugins.show();
                            }
                        });
                    }
                    
                    // Handle category filter clicks
                    $('#seoprostack-plugin-filters a').on('click', function(e) {
                        e.preventDefault();
                        
                        // Update active filter
                        $('#seoprostack-plugin-filters a').removeClass('current');
                        $(this).addClass('current');
                        
                        // Load plugins
                        var category = $(this).data('category');
                        loadProPlugins(category);
                    });
                    
                    // Load initial plugins
                    loadProPlugins('all');
                    
                    // Delegate plugin activation
                    $(document).on('click', '.activate-plugin', function(e) {
                        e.preventDefault();
                        
                        var $button = $(this);
                        var pluginPath = $button.data('plugin');
                        
                        $button.text('Activating...').addClass('updating-message');
                        
                        $.ajax({
                            url: seoProStack.ajaxurl,
                            type: 'POST',
                            data: {
                                action: 'seoprostack_activate_plugin',
                                plugin: pluginPath,
                                nonce: seoProStack.nonce
                            },
                            success: function(response) {
                                if (response.success) {
                                    $button.removeClass('updating-message')
                                          .removeClass('activate-plugin')
                                          .addClass('button-disabled')
                                          .text('Active')
                                          .prop('disabled', true);
                                } else {
                                    $button.removeClass('updating-message').text('Activate');
                                    alert(response.data.message || 'Error activating plugin');
                                }
                            },
                            error: function() {
                                $button.removeClass('updating-message').text('Activate');
                                alert('Error connecting to server');
                            }
                        });
                    });
                });
            </script>
        </div>
        <?php
    }
}