File "wgl-video-popup.php"
Full Path: /home/ubunrgit/public_html/wp-content/plugins/unicoach-core/includes/elementor/widgets/wgl-video-popup.php
File size: 18.81 KB
MIME-type: text/x-php
Charset: utf-8
<?php
/*
* This template can be overridden by copying it to yourtheme/unicoach-core/elementor/widgets/wgl-video-popup.php.
*/
namespace WglAddons\Widgets;
defined('ABSPATH') || exit; // Abort, if called directly.
use Elementor\{Widget_Base, Controls_Manager};
use Elementor\{Embed};
use Elementor\{Group_Control_Border, Group_Control_Box_Shadow, Group_Control_Typography, Group_Control_Background};
use WglAddons\Unicoach_Global_Variables as Unicoach_Globals;
class Wgl_Video_Popup extends Widget_Base
{
public function get_name() {
return 'wgl-video-popup';
}
public function get_title() {
return esc_html__('WGL Video Popup', 'unicoach-core');
}
public function get_icon() {
return 'wgl-video-popup';
}
public function get_categories() {
return [ 'wgl-extensions' ];
}
protected function register_controls()
{
/*-----------------------------------------------------------------------------------*/
/* CONTENT -> GENERAL
/*-----------------------------------------------------------------------------------*/
$this->start_controls_section(
'wgl_video_popup_section',
[ 'label' => esc_html__('General', 'unicoach-core') ]
);
$this->add_control(
'title',
[
'label' => esc_html__('Title', 'unicoach-core'),
'type' => Controls_Manager::TEXT,
'label_block' => true,
]
);
$this->add_control(
'link',
[
'label' => esc_html__('Video Link', 'unicoach-core'),
'type' => Controls_Manager::TEXT,
'description' => esc_html__('Link from youtube or vimeo.', 'unicoach-core'),
'separator' => 'after',
'label_block' => true,
'placeholder' => esc_attr__('https://www.youtube.com/watch?v=', 'unicoach-core'),
'default' => 'https://www.youtube.com/watch?v=TKnufs85hXk',
]
);
$this->add_control(
'title_pos',
[
'label' => esc_html__('Title Position', 'unicoach-core'),
'type' => Controls_Manager::CHOOSE,
'options' => [
'top' => [
'title' => esc_html__('Top', 'unicoach-core'),
'icon' => 'eicon-v-align-bottom',
],
'left' => [
'title' => esc_html__('Left', 'unicoach-core'),
'icon' => 'eicon-h-align-right',
],
'bot' => [
'title' => esc_html__('Bottom', 'unicoach-core'),
'icon' => 'eicon-v-align-top',
],
'right' => [
'title' => esc_html__('Right', 'unicoach-core'),
'icon' => 'eicon-h-align-left',
],
],
'label_block' => false,
'default' => 'bot',
'toggle' => true,
]
);
$this->add_responsive_control(
'button_pos',
[
'label' => esc_html__('Alignment', 'unicoach-core'),
'type' => Controls_Manager::CHOOSE,
'options' => [
'left' => [
'title' => esc_html__('Left', 'unicoach-core'),
'icon' => 'fa fa-align-left',
],
'center' => [
'title' => esc_html__('Center', 'unicoach-core'),
'icon' => 'fa fa-align-center',
],
'right' => [
'title' => esc_html__('Right', 'unicoach-core'),
'icon' => 'fa fa-align-right',
],
'inline' => [
'title' => esc_html__('Inline', 'unicoach-core'),
'icon' => 'eicon-h-align-stretch',
],
],
'default' => 'center',
]
);
$this->end_controls_section();
/*-----------------------------------------------------------------------------------*/
/* CONTENT -> ANIMATION
/*-----------------------------------------------------------------------------------*/
$this->start_controls_section(
'section_content_animation',
[
'label' => esc_html__('Animation', 'unicoach-core'),
'condition' => [ 'title!' => '' ],
]
);
$this->add_control(
'animation_style',
[
'label' => esc_html__('Animation Style', 'unicoach-core'),
'type' => Controls_Manager::SELECT,
'options' => [
'' => esc_html__('No animation', 'unicoach-core'),
'ring_static' => esc_html__('Static Ring', 'unicoach-core'),
'ring_pulse' => esc_html__('Pulsing Ring', 'unicoach-core'),
'circles' => esc_html__('Divergent Rings', 'unicoach-core'),
],
'default' => '',
]
);
$this->add_control(
'anim_color',
[
'label' => esc_html__('Animation Element Color', 'unicoach-core'),
'type' => Controls_Manager::COLOR,
'condition' => [ 'animation_style!' => '' ],
'default' => Unicoach_Globals::get_primary_color(),
'selectors' => [
'{{WRAPPER}} .videobox_animation' => 'color: {{VALUE}};',
'{{WRAPPER}} .animation_ring_pulse .videobox_animation' => 'background-color: {{VALUE}};',
],
]
);
$this->add_control(
'always_run_animation',
[
'label' => esc_html__('Run Animation Until Hover', 'unicoach-core'),
'type' => Controls_Manager::SWITCHER,
'condition' => [
'animation_style!' => ['', 'ring_static']
],
]
);
$this->end_controls_section();
/*-----------------------------------------------------------------------------------*/
/* STYLE -> TITLE
/*-----------------------------------------------------------------------------------*/
$this->start_controls_section(
'section_style_title',
[
'label' => esc_html__('Title', 'unicoach-core'),
'tab' => Controls_Manager::TAB_STYLE,
'condition' => [ 'title!' => '' ],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'title',
'selector' => '{{WRAPPER}} .title',
]
);
$this->add_control(
'title_tag',
[
'label' => esc_html__('HTML Tag', 'unicoach-core'),
'type' => Controls_Manager::SELECT,
'options' => [
'h1' => '‹h1›',
'h2' => '‹h2›',
'h3' => '‹h3›',
'h4' => '‹h4›',
'h5' => '‹h5›',
'h6' => '‹h6›',
'div' => '‹div›',
],
'default' => 'h3',
]
);
$this->add_responsive_control(
'title_margin',
[
'label' => esc_html__('Margin', 'unicoach-core'),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => ['px', 'em', '%'],
'default' => [
'top' => '28',
'right' => '0',
'bottom' => '0',
'left' => '0',
'unit' => 'px',
'isLinked' => false
],
'selectors' => [
'{{WRAPPER}} .title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
]
);
$this->add_responsive_control(
'title_padding',
[
'label' => esc_html__('Padding', 'unicoach-core'),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => ['px', 'em', '%'],
'selectors' => [
'{{WRAPPER}} .title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
]
);
$this->add_control(
'title_color',
[
'label' => esc_html__('Title Color', 'unicoach-core'),
'type' => Controls_Manager::COLOR,
'default' => '#ffffff',
'selectors' => [
'{{WRAPPER}} .title' => 'color: {{VALUE}};',
],
]
);
$this->add_control(
'title_divider',
[
'label' => esc_html__('Title Divider', 'unicoach-core'),
'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__('On', 'unicoach-core'),
'label_off' => esc_html__('Off', 'unicoach-core'),
'default' => '',
'prefix_class' => 'divider_',
]
);
$this->end_controls_section();
/*-----------------------------------------------------------------------------------*/
/* STYLE -> BUTTON
/*-----------------------------------------------------------------------------------*/
$this->start_controls_section(
'section_style_button',
[
'label' => esc_html__('Button', 'unicoach-core'),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_responsive_control(
'button_margin',
[
'label' => esc_html__('Margin', 'unicoach-core'),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', 'em', '%' ],
'selectors' => [
'{{WRAPPER}} .videobox_link' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
]
);
$this->add_control(
'button_size',
[
'label' => esc_html__('Button Diameter', 'unicoach-core'),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => ['max' => 200],
],
'default' => ['size' => 95, 'unit' => 'px'],
'selectors' => [
'{{WRAPPER}} .videobox_link' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
],
]
);
$this->start_controls_tabs('button');
$this->start_controls_tab(
'tab_button_idle',
['label' => esc_html__('Idle' , 'unicoach-core')]
);
$this->add_control(
'triangle_color_idle',
[
'label' => esc_html__('Icon Color', 'unicoach-core'),
'type' => Controls_Manager::COLOR,
'default' => '#ffffff',
'selectors' => [
'{{WRAPPER}} .videobox_icon' => 'fill: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Background::get_type(),
[
'name' => 'bg_color',
'label' => esc_html__('Button Background', 'unicoach-core'),
'types' => ['classic', 'gradient'],
'selector' => '{{WRAPPER}} .videobox_link',
]
);
$this->add_group_control(
Group_Control_Border::get_type(),
[
'name' => 'button_border',
'label' => esc_html__('Border Type', 'unicoach-core'),
'selector' => '{{WRAPPER}} .videobox_link',
'fields_options' => [
'border' => [ 'default' => 'solid' ],
'width' => [ 'default' => [
'top' => 1,
'right' => 1,
'bottom' => 1,
'left' => 1,
] ],
'color' => [
'default' => '#ffffff'
],
],
]
);
$this->add_group_control(
Group_Control_Box_Shadow::get_type(),
[
'name' => 'button_shadow',
'selector' => '{{WRAPPER}} .videobox_link',
]
);
$this->end_controls_tab();
$this->start_controls_tab(
'custom_item_color_hover',
['label' => esc_html__('Hover', 'unicoach-core')]
);
$this->add_control(
'triangle_color_hover',
[
'label' => esc_html__('Icon Color', 'unicoach-core'),
'type' => Controls_Manager::COLOR,
'default' => Unicoach_Globals::get_primary_color(),
'selectors' => [
'{{WRAPPER}} .videobox_link:hover .videobox_icon' => 'fill: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Background::get_type(),
[
'name' => 'bg_color_hover',
'selector' => '{{WRAPPER}} .videobox_link:hover',
'fields_options' => [
'background' => ['default' => 'classic'],
'color' => ['default' => '#ffffff'],
],
]
);
$this->add_group_control(
Group_Control_Border::get_type(),
[
'name' => 'button_border_hover',
'selector' => '{{WRAPPER}} .videobox_link:hover',
]
);
$this->add_group_control(
Group_Control_Box_Shadow::get_type(),
[
'name' => 'button_shadow_hover',
'selector' => '{{WRAPPER}} .videobox_link:hover',
]
);
$this->end_controls_tab();
$this->end_controls_tabs();
$this->add_control(
'triangle_size',
[
'label' => esc_html__('Icon Size', 'unicoach-core'),
'type' => Controls_Manager::SLIDER,
'separator' => 'before',
'size_units' => ['px', '%'],
'range' => [
'px' => ['max' => 100],
],
'default' => ['size' => 14, 'unit' => 'px'],
'selectors' => [
'{{WRAPPER}} .videobox_icon' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
],
]
);
$this->add_control(
'triangle_corners',
[
'label' => esc_html__('Icon Rounded Corners', 'unicoach-core'),
'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__('On', 'unicoach-core'),
'label_off' => esc_html__('Off', 'unicoach-core'),
'default' => 'yes',
]
);
$this->end_controls_section();
}
protected function render()
{
$_s = $this->get_settings_for_display();
$animated_element = '';
$this->add_render_attribute('video-wrap', 'class', [
'wgl-video_popup',
'button_align-' . $_s['button_pos'],
$_s['animation_style'] ? 'animation_' . $_s['animation_style'] : '',
'title_pos-' . $_s['title_pos'],
!empty($_s['bg_image']['url']) ? 'with_image' : '',
$_s['always_run_animation'] ? 'idle-animation' : '',
]);
// Animation element
switch ($_s['animation_style']) {
case 'circles':
$animated_element .= '<div class="videobox_animation circle_1"></div>';
$animated_element .= '<div class="videobox_animation circle_2"></div>';
$animated_element .= '<div class="videobox_animation circle_3"></div>';
break;
case 'ring_pulse':
case 'ring_static':
$animated_element .= '<div class="videobox_animation"></div>';
break;
}
// Triangle svg
switch ($_s['triangle_corners']) {
default:
case false:
$triangle_svg = '<svg class="videobox_icon" viewBox="0 0 10 10"><polygon points="1,0 1,10 8.5,5"/></svg>';
break;
case true:
$triangle_svg = '<svg class="videobox_icon" viewBox="0 0 232 232"><path d="M203,99L49,2.3c-4.5-2.7-10.2-2.2-14.5-2.2 c-17.1,0-17,13-17,16.6v199c0,2.8-0.07,16.6,17,16.6c4.3,0,10,0.4,14.5-2.2 l154-97c12.7-7.5,10.5-16.5,10.5-16.5S216,107,204,100z"/></svg>';
break;
}
// Render
echo '<div ', $this->get_render_attribute_string('video-wrap'), '>';
echo '<div class="videobox_content">';
if (!empty($_s['bg_image']['url'])) {
echo '<div class="videobox_background">',
wp_get_attachment_image($_s['bg_image']['id'], 'full'),
'</div>',
'<div class="videobox_link_wrapper">';
}
if (!empty($_s['title'])) {
echo '<', $_s['title_tag'], ' class="title">',
esc_html__($_s['title']),
'</', $_s['title_tag'], '>';
}
$lightbox_url = Embed::get_embed_url( $_s['link'], [], [] );
$lightbox_options = [
'type' => 'video',
'url' => $lightbox_url,
'modalOptions' => [
'id' => 'elementor-lightbox-' . $this->get_id(),
],
];
$this->add_render_attribute( 'video-lightbox', [
'class' => 'videobox_link videobox',
'data-elementor-open-lightbox' => 'yes',
'data-elementor-lightbox' => wp_json_encode( $lightbox_options ),
] );
echo '<div ', $this->get_render_attribute_string( 'video-lightbox' ) , '>';
echo $triangle_svg;
echo $animated_element;
echo '</div>';
if (!empty($_s['bg_image']['url'])) {
echo '</div>';
}
echo '</div>'; // videobox_content
echo '</div>';
}
public function wpml_support_module() {
add_filter( 'wpml_elementor_widgets_to_translate', [$this, 'wpml_widgets_to_translate_filter']);
}
public function wpml_widgets_to_translate_filter( $widgets ){
return \WglAddons\Includes\Wgl_WPML_Settings::get_translate(
$this, $widgets
);
}
}