✘✘ GRAYBYTE WORDPRESS FILE MANAGER ✘✘

<?php
namespace Elementor;

if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly

/**
 * Kinsley Testimonials Widget.
 *
 * @since 1.0
 */
class Kinsley_Testimonials_Widget extends Widget_Base {

	public function get_name() {
		return 'kinsley-testimonials';
	}

	public function get_title() {
		return esc_html__( 'Testimonials', 'kinsley-plugin' );
	}

	public function get_icon() {
		return 'eicon-parallax';
	}

	public function get_categories() {
		return [ 'kinsley-category' ];
	}

	/**
	 * Register widget controls.
	 *
	 * @since 1.0
	 */
	protected function register_controls() {

		$this->start_controls_section(
			'title_tab',
			[
				'label' => esc_html__( 'Title', 'kinsley-plugin' ),
				'tab' => Controls_Manager::TAB_CONTENT,
			]
		);

		$this->add_control(
			'title',
			[
				'label'       => esc_html__( 'Title', 'kinsley-plugin' ),
				'type'        => Controls_Manager::TEXTAREA,
				'placeholder' => esc_html__( 'Enter title', 'kinsley-plugin' ),
				'default'     => esc_html__( 'Title', 'kinsley-plugin' ),
			]
		);

		$this->add_control(
			'title_tag',
			[
				'label'       => esc_html__( 'Title Tag', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'h2',
				'options' => [
					'h1'  => __( 'H1', 'kinsley-plugin' ),
					'h2' => __( 'H2', 'kinsley-plugin' ),
					'h3' => __( 'H3', 'kinsley-plugin' ),
					'h4' => __( 'H4', 'kinsley-plugin' ),
					'div' => __( 'DIV', 'kinsley-plugin' ),
				],
			]
		);

		$this->add_control(
			'title_align',
			[
				'label'       => esc_html__( 'Title Align', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'default',
				'options' => [
					'default'  => __( 'Default', 'kinsley-plugin' ),
					'left' => __( 'Left', 'kinsley-plugin' ),
				],
			]
		);

		$this->add_control(
			'description',
			[
				'label'       => esc_html__( 'Description', 'kinsley-plugin' ),
				'type'        => Controls_Manager::TEXTAREA,
				'placeholder' => esc_html__( 'Enter description', 'kinsley-plugin' ),
				'default'     => esc_html__( 'Description', 'kinsley-plugin' ),
			]
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'items_tab',
			[
				'label' => esc_html__( 'Items', 'kinsley-plugin' ),
				'tab' => Controls_Manager::TAB_CONTENT,
			]
		);

		$repeater = new \Elementor\Repeater();

		$repeater->add_control(
			'image', [
				'label' => esc_html__( 'Image', 'kinsley-plugin' ),
				'type' => Controls_Manager::MEDIA,
				'default' => [
					'url' => \Elementor\Utils::get_placeholder_image_src(),
				],
			]
		);

		$repeater->add_control(
			'title', [
				'label'       => esc_html__( 'Name', 'kinsley-plugin' ),
				'type'        => Controls_Manager::TEXTAREA,
				'placeholder' => esc_html__( 'Enter name', 'kinsley-plugin' ),
				'default'	=> esc_html__( 'Name', 'kinsley-plugin' ),
			]
		);

		$repeater->add_control(
			'subtitle', [
				'label'       => esc_html__( 'Role', 'kinsley-plugin' ),
				'type'        => Controls_Manager::TEXTAREA,
				'placeholder' => esc_html__( 'Enter role', 'kinsley-plugin' ),
				'default'	=> esc_html__( 'Role', 'kinsley-plugin' ),
			]
		);

		$repeater->add_control(
			'text', [
				'label'       => esc_html__( 'Text', 'kinsley-plugin' ),
				'type'        => Controls_Manager::WYSIWYG,
				'placeholder' => esc_html__( 'Enter text', 'kinsley-plugin' ),
				'default'	=> esc_html__( 'Text', 'kinsley-plugin' ),
			]
		);

		$repeater->add_control(
			'rating', [
				'label'       => esc_html__( 'Rating', 'kinsley-plugin' ),
				'type'        => Controls_Manager::NUMBER,
				'min' 		  => 0,
				'max' 		  => 5,
				'step' 		  => 1,
				'default' 	  => 5,
			]
		);

		$this->add_control(
			'items',
			[
				'label' => esc_html__( 'Testimonials Items', 'kinsley-plugin' ),
				'type' => Controls_Manager::REPEATER,
				'prevent_empty' => false,
				'fields' => $repeater->get_controls(),
				'title_field' => '{{{ title }}}',
			]
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'settings_tab',
			[
				'label' => esc_html__( 'Settings', 'kinsley-plugin' ),
				'tab' => Controls_Manager::TAB_CONTENT,
			]
		);

		$this->add_control(
			'bg_position',
			[
				'label'       => esc_html__( 'BG Transition Position', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'none',
				'options' => [
					'top'  => __( 'Top', 'kinsley-plugin' ),
					'bottom' => __( 'Bottom', 'kinsley-plugin' ),
					'middle' => __( 'Middle', 'kinsley-plugin' ),
					'none' => __( 'None', 'kinsley-plugin' ),
				],
			]
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'item_settings_tab',
			[
				'label' => esc_html__( 'Item Settings', 'kinsley-plugin' ),
				'tab' => Controls_Manager::TAB_CONTENT,
			]
		);

		$this->add_control(
			'item_show_image',
			[
				'label'       => esc_html__( 'Show Image', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'yes',
				'options' => [
					'yes'  => __( 'Yes', 'kinsley-plugin' ),
					'no' => __( 'No', 'kinsley-plugin' ),
				],
			]
		);

		$this->add_control(
			'item_show_name',
			[
				'label'       => esc_html__( 'Show Name', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'yes',
				'options' => [
					'yes'  => __( 'Yes', 'kinsley-plugin' ),
					'no' => __( 'No', 'kinsley-plugin' ),
				],
			]
		);

		$this->add_control(
			'item_show_role',
			[
				'label'       => esc_html__( 'Show Role', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'yes',
				'options' => [
					'yes'  => __( 'Yes', 'kinsley-plugin' ),
					'no' => __( 'No', 'kinsley-plugin' ),
				],
			]
		);

		$this->add_control(
			'item_show_text',
			[
				'label'       => esc_html__( 'Show Text', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'yes',
				'options' => [
					'yes'  => __( 'Yes', 'kinsley-plugin' ),
					'no' => __( 'No', 'kinsley-plugin' ),
				],
			]
		);

		$this->add_control(
			'item_show_rating',
			[
				'label'       => esc_html__( 'Show Rating', 'kinsley-plugin' ),
				'type'        => Controls_Manager::SELECT,
				'default' => 'yes',
				'options' => [
					'yes'  => __( 'Yes', 'kinsley-plugin' ),
					'no' => __( 'No', 'kinsley-plugin' ),
				],
			]
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'title_styling',
			[
				'label'     => esc_html__( 'Title', 'kinsley-plugin' ),
				'tab'       => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'title_color',
			[
				'label'     => esc_html__( 'Title Color', 'kinsley-plugin' ),
				'type'      => Controls_Manager::COLOR,
				'default'	=> '',
				'selectors' => [
					'{{WRAPPER}} .knsl-title-frame .knsl-title--h' => 'color: {{VALUE}};',
				],
			]
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name'     => 'title_typography',
				'label'     => esc_html__( 'Title Typography', 'kinsley-plugin' ),
				'selector' => '{{WRAPPER}} .knsl-title-frame .knsl-title--h',
			]
		);

		$this->add_control(
			'description_color',
			[
				'label'     => esc_html__( 'Description Color', 'kinsley-plugin' ),
				'type'      => Controls_Manager::COLOR,
				'default'	=> '',
				'selectors' => [
					'{{WRAPPER}} .knsl-title-frame .knsl-text' => 'color: {{VALUE}};',
				],
			]
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name'     => 'description_typography',
				'label'     => esc_html__( 'Description Typography', 'kinsley-plugin' ),
				'selector' => '{{WRAPPER}} .knsl-title-frame .knsl-text',
			]
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'items_styling',
			[
				'label'     => esc_html__( 'Items', 'kinsley-plugin' ),
				'tab'       => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'item_q_color',
			[
				'label'     => esc_html__( 'Quote Color', 'kinsley-plugin' ),
				'type'      => Controls_Manager::COLOR,
				'default'	=> '',
				'selectors' => [
					'{{WRAPPER}} blockquote:before, {{WRAPPER}} blockquote:after' => 'color: {{VALUE}};',
				],
			]
		);

		$this->add_control(
			'item_title_color',
			[
				'label'     => esc_html__( 'Title Color', 'kinsley-plugin' ),
				'type'      => Controls_Manager::COLOR,
				'default'	=> '',
				'selectors' => [
					'{{WRAPPER}} .knsl-testimonial-card h3' => 'color: {{VALUE}};',
				],
			]
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name'     => 'item_title_typography',
				'label'     => esc_html__( 'Title Typography', 'kinsley-plugin' ),
				'selector' => '{{WRAPPER}} .knsl-testimonial-card h3',
			]
		);

		$this->add_control(
			'item_subtitle_color',
			[
				'label'     => esc_html__( 'Subtitle Color', 'kinsley-plugin' ),
				'type'      => Controls_Manager::COLOR,
				'default'	=> '',
				'selectors' => [
					'{{WRAPPER}} .knsl-testimonial-card .knsl-subtitle--h' => 'color: {{VALUE}};',
				],
			]
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name'     => 'item_subtitle_typography',
				'label'     => esc_html__( 'Subtitle Typography', 'kinsley-plugin' ),
				'selector' => '{{WRAPPER}} .knsl-testimonial-card .knsl-subtitle--h',
			]
		);

		$this->add_control(
			'item_text_color',
			[
				'label'     => esc_html__( 'Text Color', 'kinsley-plugin' ),
				'type'      => Controls_Manager::COLOR,
				'default'	=> '',
				'selectors' => [
					'{{WRAPPER}} .knsl-testimonial-card blockquote' => 'color: {{VALUE}};',
				],
			]
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name'     => 'item_text_typography',
				'label'     => esc_html__( 'Text Typography', 'kinsley-plugin' ),
				'selector' => '{{WRAPPER}} .knsl-testimonial-card blockquote',
			]
		);

		$this->add_control(
			'item_rating_color',
			[
				'label'     => esc_html__( 'Rating Color', 'kinsley-plugin' ),
				'type'      => Controls_Manager::COLOR,
				'default'	=> '',
				'selectors' => [
					'{{WRAPPER}} .knsl-testimonial-card .knsl-name-and-text blockquote .knsl-stars li' => 'color: {{VALUE}};',
				],
			]
		);

		$this->end_controls_section();
	}


	/**
	 * Render widget output on the frontend.
	 *
	 * @since 1.0
	 */
	protected function render() {
		$settings = $this->get_settings_for_display();

		$this->add_inline_editing_attributes( 'title', 'basic' );
		$this->add_inline_editing_attributes( 'description', 'basic' );

		?>

		<!-- testimonials -->
	    <section class="knsl-transition-<?php echo esc_attr( $settings['bg_position'] ); ?> knsl-p-0-80">
	      <?php kinsley_deco_svg( 'left' ); ?>

	      <div class="container">
	        <div class="row justify-content-center">
	          <?php if ( $settings['title'] || $settings['description'] ) : ?>
	          <div class="col-lg-12">

	            <div class="knsl-center knsl-title-frame knsl-scroll-animation knsl-mb-80<?php if ( $settings['title_align'] == 'left' ) : ?> knsl-title-left<?php endif; ?>">
	              <?php if ( $settings['title'] ) : ?>
	              <<?php echo esc_attr( $settings['title_tag'] ); ?> class="knsl-title--h knsl-mb-20">
	              	<span <?php echo $this->get_render_attribute_string( 'title' ); ?>>
					          	<?php echo wp_kses_post( $settings['title'] ); ?>
					        </span>
	              </<?php echo esc_attr( $settings['title_tag'] ); ?>>
	              <?php endif; ?>
	              <?php if ( $settings['description'] ) : ?>
								<div class="knsl-text">
									<p>
		              	<span <?php echo $this->get_render_attribute_string( 'description' ); ?>>
					          		<?php echo wp_kses_post( $settings['description'] ); ?>
					        	</span>
		              </p>
								</div>
	              <?php endif; ?>
	            </div>

	          </div>
	          <?php endif; ?>
	          <?php if ( $settings['items'] ) : ?>
	          <div class="col-lg-6">

	            <!-- slider -->
	            <div class="swiper-slider knsl-testimonials-slider knsl-scroll-animation">
	              <div class="swiper-wrapper">
	                <?php foreach ( $settings['items'] as $index => $item ) :
						$item_title = $this->get_repeater_setting_key( 'title', 'items', $index );
						$this->add_inline_editing_attributes( $item_title, 'basic' );

						$item_subtitle = $this->get_repeater_setting_key( 'subtitle', 'items', $index );
						$this->add_inline_editing_attributes( $item_subtitle, 'basic' );

						$item_text = $this->get_repeater_setting_key( 'text', 'items', $index );
						$this->add_inline_editing_attributes( $item_text, 'advanced' );
					?>
	                <div class="swiper-slide">

	                  <div class="knsl-testimonial-card">
	                    <?php if ( $item['image'] && $settings['item_show_image'] == 'yes' ) : $image = wp_get_attachment_image_url( $item['image']['id'], 'kinsley_140x140' ); ?>
	                    <div class="knsl-avatar-frame">
	                      <img src="<?php echo esc_url( $image ); ?>" alt="<?php echo esc_attr( $item['title'] ); ?>" />
	                    </div>
	                    <?php endif; ?>
	                    <div class="knsl-name-and-text">
	                      <?php if ( $item['title'] && $settings['item_show_name'] == 'yes' ) : ?>
	                      <h3 class="knsl-mb-10">
	                      	<span <?php echo $this->get_render_attribute_string( $item_title ); ?>>
								<?php echo wp_kses_post( $item['title'] ); ?>
							</span>
	                      </h3>
	                      <?php endif; ?>
	                      <?php if ( $item['subtitle'] && $settings['item_show_role'] == 'yes' ) : ?>
	                      <div class="knsl-subtitle--h">
	                      	<span <?php echo $this->get_render_attribute_string( $item_subtitle ); ?>>
								<?php echo wp_kses_post( $item['subtitle'] ); ?>
							</span>
	                      </div>
	                      <?php endif; ?>
						  <?php if ( $settings['item_show_text'] == 'yes' || $settings['item_show_rating'] == 'yes' ) : ?>
	                      <blockquote>
	                        <?php if ( $item['rating'] && $settings['item_show_rating'] == 'yes' ) : ?>
								<ul class="knsl-stars">
									<?php for ( $i = 1; $i <= 5; $i++ ) : ?>
									<?php if ( $item['rating'] >= $i ) : ?>
									<li><i class="fas fa-star"></i></li>
									<?php else : ?>
									<li class="knsl-empty"><i class="fas fa-star"></i></li>
									<?php endif; ?>
									<?php endfor; ?>
								</ul>
						    <?php endif; ?>

	                        <?php if ( $item['text'] && $settings['item_show_text'] == 'yes' ) : ?>
	                        	<div <?php echo $this->get_render_attribute_string( $item_text ); ?>>
									<?php echo wp_kses_post( $item['text'] ); ?>
								</div>
	                        <?php endif; ?>
	                      </blockquote>
						  <?php endif; ?>
	                    </div>
	                  </div>

	                </div>
	                <?php endforeach; ?>
	              </div>
	              <div class="knsl-testimonials-nav">
	                <div class="knsl-testimonials-slider-1-prev"><i class="fas fa-arrow-left"></i></div>
	                <div class="knsl-testimonials-slider-1-next"><i class="fas fa-arrow-right"></i></div>
	              </div>
	            </div>
	            <!-- slider end -->

	          </div>
	          <?php endif; ?>
	        </div>
	      </div>
	    </section>
	    <!-- testimonials end -->

		<?php
	}

	/**
	 * Render widget output in the editor.
	 *
	 * Written as a Backbone JavaScript template and used to generate the live preview.
	 *
	 * @since 1.0.0
	 * @access protected
	 */
	protected function content_template() {
		?>

		<#
		view.addInlineEditingAttributes( 'title', 'basic' );
		view.addInlineEditingAttributes( 'description', 'basic' );
		#>

		<!-- testimonials -->
	    <section class="knsl-transition-{{{ settings.bg_position }}} knsl-p-0-80">
	      <div class="container">
	        <div class="row justify-content-center">
	          <# if ( settings.title || settings.description ) { #>
	          <div class="col-lg-12">

	            <div class="knsl-center knsl-title-frame knsl-scroll-animation knsl-mb-80<# if ( settings.title_align == 'left' ) { #> knsl-title-left<# } #>">
	              <# if ( settings.title ) { #>
	              <{{{ settings.title_tag }}} class="knsl-title--h knsl-mb-20">
	              	<span {{{ view.getRenderAttributeString( 'title' ) }}}>
					          	{{{ settings.title }}}
					        </span>
	              </{{{ settings.title_tag }}}>
	              <# } #>
	              <# if ( settings.description ) { #>
								<div class="knsl-text">
									<p>
		              	<span {{{ view.getRenderAttributeString( 'description' ) }}}>
						          	{{{ settings.description }}}
						        </span>
		              </p>
								</div>
	              <# } #>
	            </div>

	          </div>
	          <# } #>

	          <# if ( settings.items ) { #>
	          <div class="col-lg-6">

	            <!-- slider -->
	            <div class="swiper-slider knsl-testimonials-slider knsl-scroll-animation">
	              <div class="swiper-wrapper">
	                <# _.each( settings.items, function( item, index ) {

						var item_title = view.getRepeaterSettingKey( 'title', 'items', index );
						view.addInlineEditingAttributes( item_title, 'basic' );

						var item_subtitle = view.getRepeaterSettingKey( 'subtitle', 'items', index );
						view.addInlineEditingAttributes( item_subtitle, 'basic' );

						var item_text = view.getRepeaterSettingKey( 'text', 'items', index );
						view.addInlineEditingAttributes( item_text, 'advanced' );

					#>
	                <div class="swiper-slide">

	                  <div class="knsl-testimonial-card">
	                    <# if ( item.image && settings.item_show_image == 'yes' ) { #>
	                    <div class="knsl-avatar-frame">
	                      <img src="{{{ item.image.url }}}" alt="{{{ item.title }}}" />
	                    </div>
	                    <# } #>
	                    <div class="knsl-name-and-text">
	                      <# if ( item.title && settings.item_show_name == 'yes' ) { #>
	                      <h3 class="knsl-mb-10">
	                      	<span {{{ view.getRenderAttributeString( item_title ) }}}>
								{{{ item.title }}}
							</span>
	                      </h3>
	                      <# } #>
	                      <# if ( item.subtitle && settings.item_show_role == 'yes' ) { #>
	                      <div class="knsl-subtitle--h">
	                      	<span {{{ view.getRenderAttributeString( item_subtitle ) }}}>
								{{{ item.subtitle }}}
							</span>
	                      </div>
	                      <# } #>
						  <# if ( settings.item_show_rating == 'yes' || settings.item_show_text == 'yes' ) { #>
	                      <blockquote>
	                        <# if ( item.rating && settings.item_show_rating == 'yes' ) { #>
								<ul class="knsl-stars">
									<# for ( var i = 0; i < 5; i++ ) { #>
									<# if ( item.rating >= i ) { #>
									<li><i class="fas fa-star"></i></li>
									<# } else { #>
									<li class="knsl-empty"><i class="fas fa-star"></i></li>
									<# } #>
									<# } #>
								</ul>
						    <# } #>

	                        <# if ( item.text && settings.item_show_text == 'yes' ) { #>
                        	<div {{{ view.getRenderAttributeString( item_text ) }}}>
								{{{ item.text }}}
							</div>
	                        <# } #>
	                      </blockquote>
						  <# } #>
	                    </div>
	                  </div>

	                </div>
	                <# }); #>
	              </div>
	              <div class="knsl-testimonials-nav">
	                <div class="knsl-testimonials-slider-1-prev"><i class="fas fa-arrow-left"></i></div>
	                <div class="knsl-testimonials-slider-1-next"><i class="fas fa-arrow-right"></i></div>
	              </div>
	            </div>
	            <!-- slider end -->

	          </div>
	          <# } #>
	        </div>
	      </div>
	    </section>
	    <!-- testimonials end -->

		<?php
	}
}

Plugin::instance()->widgets_manager->register( new Kinsley_Testimonials_Widget() );