Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory : /proc/thread-self/cwd/wp-content/plugins/uicore-elements/includes/widgets/ |
<?php
namespace UiCoreElements;
use Elementor\Plugin;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Modules\NestedElements\Controls\Control_Nested_Repeater;
use UiCoreElements\Utils\Carousel_Trait;
use UiCoreElements\Utils\Animation_Trait;
use UiCoreElements\Utils\Item_Style_Component;
defined('ABSPATH') || exit();
/**
* Custom Carousel
*
* @author Lucas Marini Falbo <[email protected]>
* @since 1.0.7
*/
class CustomCarousel extends UiCoreNestedWidget {
use Carousel_Trait;
use Animation_Trait;
use Item_Style_Component;
public function get_name()
{
return 'uicore-custom-carousel';
}
public function get_title()
{
return esc_html__('Custom Carousel', 'uicore-elements');
}
public function get_icon()
{
return 'eicon-carousel-loop ui-e-widget';
}
public function get_categories()
{
return ['uicore'];
}
public function get_keywords()
{
return ['slide', 'carousel', 'nested'];
}
public function get_styles()
{
$styles = ['custom-carousel'];
return $styles;
}
public function get_scripts()
{
return $this->TRAIT_get_scripts(false);
}
// Nested required functions
protected function carousel_content_container( int $index ) {
return [
'elType' => 'container',
'settings' => [
'_title' => sprintf( __( 'Item #%s', 'uicore-elements' ), $index ),
'content_width' => 'full',
'flex_justify_content' => 'center',
'flex_align_items' => 'center',
],
];
}
protected function get_default_children_elements() {
return [
$this->carousel_content_container( 1 ),
$this->carousel_content_container( 2 ),
$this->carousel_content_container( 3 ),
];
}
protected function get_default_repeater_title_setting_key() {
return 'carousel_item_title';
}
protected function get_default_children_title() {
return esc_html__( 'Item #%d', 'uicore-elements' );
}
protected function get_default_children_placeholder_selector() {
return '.swiper-wrapper';
}
/**
* We've set a bool variable to this function because Custom Slider extends this widget and requires one extra control.
*
* @param bool $is_slider - If the widget is a slider, it will enable the slider height control.
*/
protected function register_controls(bool $is_slider = false)
{
if( !Plugin::$instance->experiments->is_feature_active('nested-elements') ){
$this->nesting_fallback('controls');
return;
}
$this->start_controls_section(
'section_content',
[
'label' => __('Items', 'uicore-elements'),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
$repeater = new Repeater();
$repeater->add_control(
'carousel_item_title',
[
'label' => __('Title', 'uicore-elements'),
'type' => Controls_Manager::TEXT,
'render_type' => 'template',
'dynamic' => [
'active' => true,
],
]
);
$this->add_control(
'carousel_items',
[
'type' => Control_Nested_Repeater::CONTROL_TYPE,
'fields' => $repeater->get_controls(),
'default' => [
[ 'carousel_item_title' => __( 'Item #1', 'uicore-elements' ) ],
[ 'carousel_item_title' => __( 'Item #2', 'uicore-elements' ) ],
[ 'carousel_item_title' => __( 'Item #3', 'uicore-elements' ) ],
]
]
);
$this->end_controls_section();
// Additional Carousel Controls
$this->start_controls_section(
'section_additional_settings',
[
'label' => __('Additional Settings', 'uicore-elements'),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
$this->TRAIT_register_carousel_additional_controls($is_slider); // Carousel Additionals
$this->end_controls_section();
$this->start_controls_section(
'section_carousel_settings',
[
'label' => __('Carousel Settings', 'uicore-elements'),
]
);
$this->TRAIT_register_carousel_settings_controls(); // Carousel settings
$this->end_controls_section();
$this->TRAIT_register_navigation_controls(); // Navigation settings
$this->start_controls_section(
'section_style_review_items',
[
'label' => esc_html__( 'Items', 'uicore-elements' ),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->TRAIT_register_all_item_style_controls();
$this->end_controls_section();
$this->TRAIT_register_navigation_style_controls(); // Carousel Navigation Styles
// Decrease default item padding
$this->update_control('item_padding', [
'default' => [
'top' => 25,
'right' => 25,
'bottom' => 25,
'left' => 25,
'unit' => 'px',
'isLinked' => true,
],
]);
// Adds description to loop
$this->update_control('loop', [
'description' => esc_html__('Loop preview is disabled here on the editor, due to compatibility issues. But you can test on the front-end, since it works outside the editor.', 'uicore-elements'),
]);
}
public function render()
{
if( Plugin::$instance->experiments->is_feature_active('nested-elements') == false ){
$this->nesting_fallback();
return;
}
$items = $this->get_settings_for_display('carousel_items');
$carousel_items = '';
foreach ( $items as $index => $item ) {
ob_start();
$this->render_item($index);
$carousel_items .= ob_get_clean();
}
?>
<div class="ui-e-carousel swiper">
<div class='swiper-wrapper'>
<?php echo $carousel_items; //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</div>
<?php $this->TRAIT_render_carousel_navigations(); ?>
</div>
<?php
}
public function render_item( $index ) {
?>
<div class="ui-e-wrp swiper-slide">
<?php $this->print_child( $index ); ?>
</div>
<?php
}
public function print_child( $index ) {
$children = $this->get_children();
$child_ids = [];
if( empty( $children )){
return;
}
foreach ( $children as $child ) {
$child_ids[] = $child->get_id();
}
// Add the `ui-e-item` class directly on the item container
$add_attribute_to_container = function ( $should_render, $container ) use ( $child_ids ) {
if ( in_array( $container->get_id(), $child_ids ) ) {
$container->add_render_attribute( '_wrapper', [
'class' => 'ui-e-item',
] );
}
return $should_render;
};
add_filter( 'elementor/frontend/container/should_render', $add_attribute_to_container, 10, 3 );
$children[ $index ]->print_element();
remove_filter( 'elementor/frontend/container/should_render', $add_attribute_to_container );
}
protected function get_initial_config(): array {
if ( Plugin::$instance->experiments->is_feature_active( 'e_nested_atomic_repeaters' ) ) {
return array_merge( parent::get_initial_config(), [
'support_improved_repeaters' => true,
'node' => 'button',
] );
}
return parent::get_initial_config();
}
protected function content_template() {
if( Plugin::$instance->experiments->is_feature_active('nested-elements') == false ){
return;
}
?>
<#
var carouselItems = settings.carousel_items,
navigationDots = settings.navigation.includes('dots'),
navigationArrows = settings.navigation.includes('arrows'),
navigationFraction = settings.navigation.includes('fraction');
var prev = elementor.helpers.renderIcon( view, settings.previous_arrow, { 'aria-hidden': true }, 'i' , 'object' ),
next = elementor.helpers.renderIcon( view, settings.next_arrow, { 'aria-hidden': true }, 'i' , 'object' );
#>
<div class="ui-e-carousel swiper {{ elementorFrontend.config.swiperClass }}">
<div class='swiper-wrapper'> </div>
<# if ( navigationDots ) { #>
<div class="swiper-pagination ui-e-dots"></div>
<# } #>
<# if ( navigationArrows ) { #>
<div class="ui-e-button ui-e-previous" role="button" aria-label="Previous slide">
{{{ prev.value }}}
</div>
<div class="ui-e-button ui-e-next" role="button" aria-label="Next slide">
{{{ next.value }}}
</div>
<# } #>
<# if ( navigationFraction ) { #>
<div class="ui-e-fraction">
<span class="ui-e-current"></span>
/
<span class="ui-e-total"></span>
</div>
<# } #>
</div>
<?php
}
}
\Elementor\Plugin::instance()->widgets_manager->register(new CustomCarousel());