ویجت نظرات ۳بعدی المنتوری

/**
 * Plugin Name: نظرات سه بعدی - 3D
 * Plugin URI:  https://mrbarati.com/3d-comment/
 * Description: ویجت المنتور حرفه‌ای برای نمایش نظرات به صورت چرخشی سه بعدی با قابلیت‌های کامل سفارشی‌سازی
 * Version: 1.0.0
 * Author: Niaz + Barati
 * Author URI: https://mrbarati.com
 * Requires PHP: 7.4
 * Requires at least: 5.8
 * Tested up to: 6.9
 * Elementor tested up to: 3.25.0
 * Elementor Pro tested up to: 3.25.0
 * License: GPL v2 or later
 */

if (!defined('ABSPATH')) exit;

// Plugin constants
define('CIRCULAR_TESTIMONIALS_3D_VERSION', '1.0.1');
define('CIRCULAR_TESTIMONIALS_3D_FILE', __FILE__);
define('CIRCULAR_TESTIMONIALS_3D_PATH', plugin_dir_path(__FILE__));
define('CIRCULAR_TESTIMONIALS_3D_URL', plugin_dir_url(__FILE__));
define('CIRCULAR_TESTIMONIALS_3D_BASENAME', plugin_basename(__FILE__));

/**
 * Main Plugin Class
 */
final class Circular_Testimonials_3D_Plugin {
    
    private static $_instance = null;
    
    public static function instance() {
        if (is_null(self::$_instance)) {
            self::$_instance = new self();
        }
        return self::$_instance;
    }
    
    private function __construct() {
        add_action('plugins_loaded', [$this, 'on_plugins_loaded']);
        add_action('init', [$this, 'i18n']);
    }
    
    public function i18n() {
        load_plugin_textdomain('circular-testimonials-3d', false, dirname(CIRCULAR_TESTIMONIALS_3D_BASENAME) . '/languages');
    }
    
    public function on_plugins_loaded() {
        if (!did_action('elementor/loaded')) {
            add_action('admin_notices', [$this, 'admin_notice_missing_main_plugin']);
            return;
        }
        
        if (!version_compare(ELEMENTOR_VERSION, '3.0.0', '>=')) {
            add_action('admin_notices', [$this, 'admin_notice_minimum_elementor_version']);
            return;
        }
        
        if (version_compare(PHP_VERSION, '7.4', '<')) {
            add_action('admin_notices', [$this, 'admin_notice_minimum_php_version']);
            return;
        }
        
        add_action('elementor/widgets/register', [$this, 'register_widgets']);
        add_action('elementor/frontend/after_enqueue_styles', [$this, 'enqueue_widget_styles']);
        add_action('elementor/frontend/after_register_scripts', [$this, 'register_widget_scripts']);
    }
    
    private function display_admin_notice($message) {
        if (!current_user_can('activate_plugins')) return;
        printf('<div class="notice notice-warning is-dismissible"><p>%s</p></div>', wp_kses_post($message));
    }
    
    public function admin_notice_missing_main_plugin() {
        $message = sprintf(
            esc_html__('"%1$s" requires "%2$s" to be installed and activated.', 'circular-testimonials-3d'),
            '<strong>' . esc_html__('نظرات سه بعدی', 'circular-testimonials-3d') . '</strong>',
            '<strong>' . esc_html__('Elementor', 'circular-testimonials-3d') . '</strong>'
        );
        $this->display_admin_notice($message);
    }
    
    public function admin_notice_minimum_elementor_version() {
        $message = sprintf(
            esc_html__('"%1$s" requires "%2$s" version %3$s or greater.', 'circular-testimonials-3d'),
            '<strong>' . esc_html__('نظرات سه بعدی', 'circular-testimonials-3d') . '</strong>',
            '<strong>' . esc_html__('Elementor', 'circular-testimonials-3d') . '</strong>',
            '۳.۰.۰'
        );
        $this->display_admin_notice($message);
    }
    
    public function admin_notice_minimum_php_version() {
        $message = sprintf(
            esc_html__('"%1$s" requires "%2$s" version %3$s or greater.', 'circular-testimonials-3d'),
            '<strong>' . esc_html__('نظرات سه بعدی', 'circular-testimonials-3d') . '</strong>',
            '<strong>' . esc_html__('PHP', 'circular-testimonials-3d') . '</strong>',
            '۷.۴'
        );
        $this->display_admin_notice($message);
    }
    
    public function register_widgets($widgets_manager) {
        require_once CIRCULAR_TESTIMONIALS_3D_PATH . 'includes/widgets/circular-testimonials-widget.php';
        $widgets_manager->register(new \Circular_Testimonials_3D_Widget());
    }
    
    public function enqueue_widget_styles() {
        wp_enqueue_style(
            'circular-testimonials-3d-style',
            CIRCULAR_TESTIMONIALS_3D_URL . 'assets/css/circular-testimonials-3d.css',
            [],
            CIRCULAR_TESTIMONIALS_3D_VERSION
        );
    }
    
    public function register_widget_scripts() {
        wp_register_script(
            'circular-testimonials-3d-script',
            CIRCULAR_TESTIMONIALS_3D_URL . 'assets/js/circular-testimonials-3d.js',
            [],
            CIRCULAR_TESTIMONIALS_3D_VERSION,
            true
        );
    }
}

Circular_Testimonials_3D_Plugin::instance();

// Auto-create required files on activation
register_activation_hook(__FILE__, function() {
    $paths = [
        CIRCULAR_TESTIMONIALS_3D_PATH . 'includes/widgets',
        CIRCULAR_TESTIMONIALS_3D_PATH . 'assets/css',
        CIRCULAR_TESTIMONIALS_3D_PATH . 'assets/js'
    ];
    
    foreach ($paths as $path) {
        if (!is_dir($path)) {
            wp_mkdir_p($path);
        }
    }
    
    require_once ABSPATH . 'wp-admin/includes/file.php';
    WP_Filesystem();
    global $wp_filesystem;
    
    // Widget file
    if (!file_exists(CIRCULAR_TESTIMONIALS_3D_PATH . 'includes/widgets/circular-testimonials-widget.php')) {
        $widget_content = '<?php
if (!defined("ABSPATH")) exit;

class Circular_Testimonials_3D_Widget extends \Elementor\Widget_Base {
    
    public function get_name() {
        return "circular_testimonials_3d";
    }
    
    public function get_title() {
        return esc_html__("نظرات سه بعدی", "circular-testimonials-3d");
    }
    
    public function get_icon() {
        return "eicon-testimonial-carousel";
    }
    
    public function get_categories() {
        return ["general"];
    }
    
    public function get_keywords() {
        return ["testimonials", "3d", "circular", "نظرات", "سه بعدی"];
    }
    
    public function get_script_depends() {
        return ["circular-testimonials-3d-script"];
    }
    
    protected function register_controls() {
        
        // Content Section
        $this->start_controls_section("content_section", [
            "label" => esc_html__("نظرات", "circular-testimonials-3d"),
            "tab" => \Elementor\Controls_Manager::TAB_CONTENT,
        ]);
        
        $repeater = new \Elementor\Repeater();
        
        $repeater->add_control("testimonial_name", [
            "label" => esc_html__("نام", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::TEXT,
            "default" => esc_html__("نام شخص", "circular-testimonials-3d"),
        ]);
        
        $repeater->add_control("testimonial_position", [
            "label" => esc_html__("سمت", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::TEXT,
            "default" => esc_html__("مدیرعامل شرکت", "circular-testimonials-3d"),
        ]);
        
        $repeater->add_control("testimonial_quote", [
            "label" => esc_html__("متن نظر", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::TEXTAREA,
            "default" => esc_html__("این یک نظر نمونه است که نشان‌دهنده تجربه مشتری می‌باشد.", "circular-testimonials-3d"),
            "rows" => 5,
        ]);
        
        $repeater->add_control("testimonial_image", [
            "label" => esc_html__("تصویر", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::MEDIA,
            "default" => ["url" => \Elementor\Utils::get_placeholder_image_src()],
        ]);
        
        $this->add_control("testimonials_list", [
            "label" => esc_html__("لیست نظرات", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::REPEATER,
            "fields" => $repeater->get_controls(),
            "default" => [
                [
                    "testimonial_name" => esc_html__("علی احمدی", "circular-testimonials-3d"),
                    "testimonial_position" => esc_html__("مدیرعامل شرکت الف", "circular-testimonials-3d"),
                    "testimonial_quote" => esc_html__("تجربه فوق‌العاده‌ای بود. کیفیت خدمات بسیار عالی و حرفه‌ای.", "circular-testimonials-3d"),
                ],
                [
                    "testimonial_name" => esc_html__("سارا محمدی", "circular-testimonials-3d"),
                    "testimonial_position" => esc_html__("مدیر فروش شرکت ب", "circular-testimonials-3d"),
                    "testimonial_quote" => esc_html__("خدمات سریع و با کیفیت. کاملاً راضی هستم و توصیه می‌کنم.", "circular-testimonials-3d"),
                ],
                [
                    "testimonial_name" => esc_html__("رضا کریمی", "circular-testimonials-3d"),
                    "testimonial_position" => esc_html__("مدیر بازاریابی شرکت ج", "circular-testimonials-3d"),
                    "testimonial_quote" => esc_html__("بهترین تجربه همکاری که تا به حال داشته‌ام. عالی!", "circular-testimonials-3d"),
                ],
            ],
            "title_field" => "{{{ testimonial_name }}}",
        ]);
        
        $this->add_control("autoplay", [
            "label" => esc_html__("پخش خودکار", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::SWITCHER,
            "label_on" => esc_html__("فعال", "circular-testimonials-3d"),
            "label_off" => esc_html__("غیرفعال", "circular-testimonials-3d"),
            "return_value" => "yes",
            "default" => "yes",
        ]);
        
        $this->end_controls_section();
        
        // Container Style
        $this->start_controls_section("container_style_section", [
            "label" => esc_html__("ظاهر کانتینر", "circular-testimonials-3d"),
            "tab" => \Elementor\Controls_Manager::TAB_STYLE,
        ]);
        
        $this->add_responsive_control("container_padding", [
            "label" => esc_html__("فاصله داخلی", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::DIMENSIONS,
            "size_units" => ["px", "em", "%"],
            "selectors" => [
                "{{WRAPPER}} .ct3d-testimonials-container" => "padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};",
            ],
        ]);
        
        $this->add_group_control(\Elementor\Group_Control_Background::get_type(), [
            "name" => "container_background",
            "types" => ["classic", "gradient"],
            "selector" => "{{WRAPPER}} .ct3d-testimonials-container",
        ]);
        
        $this->end_controls_section();
        
        // Image Style
        $this->start_controls_section("image_style_section", [
            "label" => esc_html__("ظاهر تصاویر", "circular-testimonials-3d"),
            "tab" => \Elementor\Controls_Manager::TAB_STYLE,
        ]);
        
        $this->add_responsive_control("image_size", [
            "label" => esc_html__("اندازه تصویر", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::SLIDER,
            "size_units" => ["px"],
            "range" => ["px" => ["min" => 100, "max" => 400, "step" => 10]],
            "default" => ["size" => 200],
            "selectors" => [
                "{{WRAPPER}} .ct3d-testimonial-image" => "width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};",
            ],
        ]);
        
        $this->add_group_control(\Elementor\Group_Control_Border::get_type(), [
            "name" => "image_border",
            "selector" => "{{WRAPPER}} .ct3d-testimonial-image img",
        ]);
        
        $this->add_responsive_control("image_border_radius", [
            "label" => esc_html__("انحنای گوشه", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::DIMENSIONS,
            "size_units" => ["px", "%"],
            "selectors" => [
                "{{WRAPPER}} .ct3d-testimonial-image img" => "border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};",
            ],
        ]);
        
        $this->add_group_control(\Elementor\Group_Control_Box_Shadow::get_type(), [
            "name" => "image_box_shadow",
            "selector" => "{{WRAPPER}} .ct3d-testimonial-image img",
        ]);
        
        $this->end_controls_section();
        
        // Content Style
        $this->start_controls_section("content_style_section", [
            "label" => esc_html__("ظاهر محتوا", "circular-testimonials-3d"),
            "tab" => \Elementor\Controls_Manager::TAB_STYLE,
        ]);
        
        $this->add_control("name_heading", [
            "label" => esc_html__("نام", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::HEADING,
        ]);
        
        $this->add_group_control(\Elementor\Group_Control_Typography::get_type(), [
            "name" => "name_typography",
            "selector" => "{{WRAPPER}} .ct3d-testimonial-name",
        ]);
        
        $this->add_control("name_color", [
            "label" => esc_html__("رنگ نام", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::COLOR,
            "selectors" => ["{{WRAPPER}} .ct3d-testimonial-name" => "color: {{VALUE}}"],
        ]);
        
        $this->add_control("position_heading", [
            "label" => esc_html__("سمت", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::HEADING,
            "separator" => "before",
        ]);
        
        $this->add_group_control(\Elementor\Group_Control_Typography::get_type(), [
            "name" => "position_typography",
            "selector" => "{{WRAPPER}} .ct3d-testimonial-position",
        ]);
        
        $this->add_control("position_color", [
            "label" => esc_html__("رنگ سمت", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::COLOR,
            "selectors" => ["{{WRAPPER}} .ct3d-testimonial-position" => "color: {{VALUE}}"],
        ]);
        
        $this->add_control("quote_heading", [
            "label" => esc_html__("متن نظر", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::HEADING,
            "separator" => "before",
        ]);
        
        $this->add_group_control(\Elementor\Group_Control_Typography::get_type(), [
            "name" => "quote_typography",
            "selector" => "{{WRAPPER}} .ct3d-testimonial-quote",
        ]);
        
        $this->add_control("quote_color", [
            "label" => esc_html__("رنگ متن", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::COLOR,
            "selectors" => ["{{WRAPPER}} .ct3d-testimonial-quote" => "color: {{VALUE}}"],
        ]);
        
        $this->end_controls_section();
        
        // Navigation Style
        $this->start_controls_section("navigation_style_section", [
            "label" => esc_html__("ظاهر دکمه‌های ناوبری", "circular-testimonials-3d"),
            "tab" => \Elementor\Controls_Manager::TAB_STYLE,
        ]);
        
        $this->add_responsive_control("nav_button_size", [
            "label" => esc_html__("اندازه دکمه", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::SLIDER,
            "size_units" => ["px"],
            "range" => ["px" => ["min" => 30, "max" => 80, "step" => 5]],
            "default" => ["size" => 50],
            "selectors" => [
                "{{WRAPPER}} .ct3d-nav-button" => "width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};",
            ],
        ]);
        
        $this->start_controls_tabs("nav_button_tabs");
        
        $this->start_controls_tab("nav_button_normal", [
            "label" => esc_html__("عادی", "circular-testimonials-3d"),
        ]);
        
        $this->add_control("nav_button_bg_color", [
            "label" => esc_html__("رنگ پس‌زمینه", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::COLOR,
            "default" => "#000000",
            "selectors" => ["{{WRAPPER}} .ct3d-nav-button" => "background-color: {{VALUE}}"],
        ]);
        
        $this->add_control("nav_button_text_color", [
            "label" => esc_html__("رنگ متن", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::COLOR,
            "default" => "#ffffff",
            "selectors" => ["{{WRAPPER}} .ct3d-nav-button" => "color: {{VALUE}}"],
        ]);
        
        $this->end_controls_tab();
        
        $this->start_controls_tab("nav_button_hover", [
            "label" => esc_html__("هاور", "circular-testimonials-3d"),
        ]);
        
        $this->add_control("nav_button_hover_bg_color", [
            "label" => esc_html__("رنگ پس‌زمینه", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::COLOR,
            "default" => "#333333",
            "selectors" => ["{{WRAPPER}} .ct3d-nav-button:hover" => "background-color: {{VALUE}}"],
        ]);
        
        $this->add_control("nav_button_hover_text_color", [
            "label" => esc_html__("رنگ متن", "circular-testimonials-3d"),
            "type" => \Elementor\Controls_Manager::COLOR,
            "selectors" => ["{{WRAPPER}} .ct3d-nav-button:hover" => "color: {{VALUE}}"],
        ]);
        
        $this->end_controls_tab();
        $this->end_controls_tabs();
        
        $this->end_controls_section();
    }
    
    protected function render() {
        $settings = $this->get_settings_for_display();
        
        if (empty($settings["testimonials_list"])) return;
        
        $autoplay = ($settings["autoplay"] === "yes") ? "true" : "false";
        ?>
        
        <div class="ct3d-testimonials-container" data-autoplay="<?php echo esc_attr($autoplay); ?>">
            <div class="ct3d-content">
                <?php foreach ($settings["testimonials_list"] as $index => $item) : 
                    $is_active = ($index === 0) ? " ct3d-active" : "";
                ?>
                    <div class="ct3d-testimonial-item<?php echo esc_attr($is_active); ?>">
                        <h3 class="ct3d-testimonial-name"><?php echo esc_html($item["testimonial_name"]); ?></h3>
                        <p class="ct3d-testimonial-position"><?php echo esc_html($item["testimonial_position"]); ?></p>
                        <p class="ct3d-testimonial-quote"><?php echo esc_html($item["testimonial_quote"]); ?></p>
                    </div>
                <?php endforeach; ?>
            </div>
            
            <div class="ct3d-images-container">
                <?php foreach ($settings["testimonials_list"] as $item) : ?>
                    <div class="ct3d-testimonial-image">
                        <img src="<?php echo esc_url($item["testimonial_image"]["url"]); ?>" alt="<?php echo esc_attr($item["testimonial_name"]); ?>">
                    </div>
                <?php endforeach; ?>
            </div>
            
            <div class="ct3d-navigation">
                <button class="ct3d-nav-button ct3d-prev-button" aria-label="<?php echo esc_attr__("قبلی", "circular-testimonials-3d"); ?>">❮</button>
                <button class="ct3d-nav-button ct3d-next-button" aria-label="<?php echo esc_attr__("بعدی", "circular-testimonials-3d"); ?>">❯</button>
            </div>
        </div>
        
        <?php
    }
}';
        
        $wp_filesystem->put_contents(
            CIRCULAR_TESTIMONIALS_3D_PATH . 'includes/widgets/circular-testimonials-widget.php',
            $widget_content,
            FS_CHMOD_FILE
        );
    }
    
    // CSS file
    if (!file_exists(CIRCULAR_TESTIMONIALS_3D_PATH . 'assets/css/circular-testimonials-3d.css')) {
        $css_content = '.ct3d-testimonials-container {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
  direction: rtl;
}

.ct3d-content {
  margin-bottom: 60px;
  min-height: 200px;
  position: relative;
}

.ct3d-testimonial-item {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}

.ct3d-testimonial-item.ct3d-active {
  opacity: 1;
  visibility: visible;
  position: relative;
}

.ct3d-testimonial-name {
  font-size: 24px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 10px 0;
}

.ct3d-testimonial-position {
  font-size: 16px;
  color: #666;
  margin: 0 0 20px 0;
}

.ct3d-testimonial-quote {
  font-size: 18px;
  line-height: 1.8;
  color: #333;
  max-width: 800px;
  margin: 0 auto;
}

.ct3d-quote-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(10px);
}

.ct3d-quote-word.ct3d-animated {
  animation: ct3dFadeIn 0.4s ease forwards;
}

.ct3d-images-container {
  position: relative;
  width: 100%;
  height: 300px;
  margin: 40px 0;
}

.ct3d-testimonial-image {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.ct3d-testimonial-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  border: 4px solid #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.ct3d-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin-top: 20px;
}

.ct3d-nav-button {
  width: 50px;
  height: 50px;
  border: none;
  border-radius: 50%;
  background-color: #000;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  outline: none;
}

.ct3d-nav-button:hover {
  background-color: #333;
  transform: scale(1.1);
}

.ct3d-nav-button:active {
  transform: scale(0.95);
}

.ct3d-nav-button:focus {
  outline: 2px solid #4a90e2;
  outline-offset: 2px;
}

@keyframes ct3dFadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 768px) {
  .ct3d-testimonial-name { font-size: 20px; }
  .ct3d-testimonial-position { font-size: 14px; }
  .ct3d-testimonial-quote { font-size: 16px; }
  .ct3d-images-container { height: 250px; }
  .ct3d-testimonial-image { width: 150px; height: 150px; }
  .ct3d-nav-button { width: 40px; height: 40px; font-size: 12px; }
}';
        
        $wp_filesystem->put_contents(
            CIRCULAR_TESTIMONIALS_3D_PATH . 'assets/css/circular-testimonials-3d.css',
            $css_content,
            FS_CHMOD_FILE
        );
    }
    
    // JS file  
    if (!file_exists(CIRCULAR_TESTIMONIALS_3D_PATH . 'assets/js/circular-testimonials-3d.js')) {
        $js_content = '(function() {
  "use strict";
  
  function calculateGap(width) {
    const minWidth = 1024, maxWidth = 1456, minGap = 60, maxGap = 86;
    
    if (width <= minWidth) return minGap;
    if (width >= maxWidth) return Math.max(minGap, maxGap + 0.06018 * (width - maxWidth));
    
    return minGap + (maxGap - minGap) * ((width - minWidth) / (maxWidth - minWidth));
  }
  
  function initializeTestimonials(container) {
    const items = container.querySelectorAll(".ct3d-testimonial-item");
    const images = container.querySelectorAll(".ct3d-testimonial-image");
    const imagesContainer = container.querySelector(".ct3d-images-container");
    const prevButton = container.querySelector(".ct3d-prev-button");
    const nextButton = container.querySelector(".ct3d-next-button");
    
    if (!items.length || !images.length || !imagesContainer) return;
    
    const autoplayEnabled = container.dataset.autoplay === "true";
    let activeIndex = 0, autoplayInterval = null, containerWidth = imagesContainer.offsetWidth;
    
    function updateImagesPositions() {
      const gap = calculateGap(containerWidth);
      const maxStickUp = gap * 0.8;
      const totalImages = images.length;
      
      images.forEach((image, i) => {
        const isActive = i === activeIndex;
        const isLeft = (activeIndex - 1 + totalImages) % totalImages === i;
        const isRight = (activeIndex + 1) % totalImages === i;
        
        if (isActive) {
          image.style.cssText = "z-index: 3; opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) translateX(0) translateY(0) scale(1) rotateY(0);";
        } else if (isLeft) {
          image.style.cssText = `z-index: 2; opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) translateX(-${gap}px) translateY(-${maxStickUp}px) scale(0.85) rotateY(15deg);`;
        } else if (isRight) {
          image.style.cssText = `z-index: 2; opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) translateX(${gap}px) translateY(-${maxStickUp}px) scale(0.85) rotateY(-15deg);`;
        } else {
          image.style.cssText = "z-index: 1; opacity: 0; pointer-events: none; transform: translate(-50%, -50%);";
        }
      });
    }
    
    function animateQuoteText(quoteElement) {
      const words = quoteElement.textContent.split(" ");
      quoteElement.innerHTML = words.map((word, i) => 
        `<span class="ct3d-quote-word" style="animation-delay: ${i * 0.025}s;">${word}</span>`
      ).join(" ");
      
      setTimeout(() => {
        quoteElement.querySelectorAll(".ct3d-quote-word").forEach(span => {
          span.classList.add("ct3d-animated");
        });
      }, ۱۰);
    }
    
    function updateActiveTestimonial() {
      items.forEach((item, i) => {
        if (i === activeIndex) {
          item.classList.add("ct3d-active");
          const quoteEl = item.querySelector(".ct3d-testimonial-quote");
          if (quoteEl) animateQuoteText(quoteEl);
        } else {
          item.classList.remove("ct3d-active");
        }
      });
      updateImagesPositions();
    }
    
    function goToNext() {
      activeIndex = (activeIndex + 1) % items.length;
      if (autoplayInterval) clearInterval(autoplayInterval);
      updateActiveTestimonial();
    }
    
    function goToPrevious() {
      activeIndex = (activeIndex - 1 + items.length) % items.length;
      if (autoplayInterval) clearInterval(autoplayInterval);
      updateActiveTestimonial();
    }
    
    if (prevButton && nextButton) {
      prevButton.addEventListener("click", goToPrevious);
      nextButton.addEventListener("click", goToNext);
    }
    
    document.addEventListener("keydown", (e) => {
      if (e.key === "ArrowLeft") goToPrevious();
      if (e.key === "ArrowRight") goToNext();
    });
    
    window.addEventListener("resize", () => {
      containerWidth = imagesContainer.offsetWidth;
      updateImagesPositions();
    });
    
    if (autoplayEnabled) {
      autoplayInterval = setInterval(() => {
        activeIndex = (activeIndex + 1) % items.length;
        updateActiveTestimonial();
      }, ۵۰۰۰);
    }
    
    updateActiveTestimonial();
  }
  
  function initializeAllTestimonials() {
    document.querySelectorAll(".ct3d-testimonials-container").forEach(initializeTestimonials);
  }
  
  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", initializeAllTestimonials);
  } else {
    initializeAllTestimonials();
  }
  
  if (typeof jQuery !== "undefined") {
    jQuery(window).on("elementor/frontend/init", () => {
      elementorFrontend.hooks.addAction("frontend/element_ready/circular_testimonials_3d.default", ($scope) => {
        const container = $scope.find(".ct3d-testimonials-container")[0];
        if (container) initializeTestimonials(container);
      });
    });
  }
  
})();';
        
        $wp_filesystem->put_contents(
            CIRCULAR_TESTIMONIALS_3D_PATH . 'assets/js/circular-testimonials-3d.js',
            $js_content,
            FS_CHMOD_FILE
        );
    }
});