<?php
/**
 * Zeen Video
 *
 * @since 1.0.0
 *
 * @see WP_Widget
 */
class ZeenEngineVideo extends WP_Widget {

	/**
	 * Sets up a new widget instance.
	 *
	 * @since 1.0.0
	 * @access public
	 */
	public function __construct() {
		$widget_ops = array(
			'classname' => 'zeen_video',
			'description' => esc_html__( 'Add a video to your widget areas.', 'zeen-engine' ),
			'customize_selective_refresh' => true,
		);

		parent::__construct( 'zeen_video', esc_html__( 'Zeen: Video', 'zeen-engine' ), $widget_ops );

	}

	/**
	 * Loads needed scripts
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 */
	public function scripts() {
		wp_enqueue_script( 'media-upload' );
		wp_enqueue_media();
	}

	/**
	 * Outputs the content for the current widget instance.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @param array $args     Display arguments including 'before_title', 'after_title',
	 *                        'before_widget', and 'after_widget'.
	 * @param array $instance Settings for the current widget instance.
	 */
	public function widget( $args, $instance ) {

		/** This filter is documented in wp-includes/widgets/class-wp-widget-pages.php */
		$title                          = apply_filters( 'widget_title', empty( $instance['title'] ) ? '' : $instance['title'], $instance, $this->id_base );
		$url                            = ! empty( $instance['url'] ) ? $instance['url'] : '';
		$retina_url                     = ! empty( $instance['retina_url'] ) ? $instance['retina_url'] : '';
		$video                     = ! empty( $instance['video'] ) ? $instance['video'] : '';

		$output                         = array();

		if ( empty( $url ) && empty( $retina_url ) ) {
			return;
		}
		echo $args['before_widget'];
		if ( ! empty( $title ) ) {
			echo $args['before_title'] . $title . $args['after_title'];
		}
		?>
		<div class="zeen-video preview-classic">
			<a href="#" class="tipi-all-c media-icon  media-tr icon-1 icon-base-1 icon-size-m" data-type="frame" data-format="video" data-target="hero-wrap" data-title="" data-duration="" data-source="self" data-src-a="<?php echo esc_url( $video ); ?>" data-src-b="">
				<i class="tipi-i-play_arrow" aria-hidden="true"></i>
				<span class="icon-bg"></span>
			</a>
			<img src="<?php echo esc_url( $url ); ?>" srcset="<?php if ( $retina_url ) { echo esc_url( $retina_url ) . ' 2x'; } ?>" alt="">
		</div>

		<?php
		echo $args['after_widget'];

	}

	/**
	 * Handles updating settings for the current widget instance.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @param array $new_instance New settings for this instance as input by the user via
	 *                            WP_Widget::form().
	 * @param array $old_instance Old settings for this instance.
	 * @return array Settings to save or bool false to cancel saving.
	 */
	public function update( $new_instance, $old_instance ) {
		$instance = $old_instance;
		$instance['title']      = sanitize_text_field( $new_instance['title'] );
		$instance['url']   = esc_url( $new_instance['url'] );
		$instance['retina_url']   = esc_url( $new_instance['retina_url'] );
		$instance['video']   = sanitize_text_field( $new_instance['video'] );

		return $instance;
	}

	/**
	 * Outputs the widget settings form.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @param array $instance Current settings.
	 */
	public function form( $instance ) {
		$instance   = wp_parse_args( (array) $instance, array( 'title' => '', 'url' => '', 'retina_url' => '', 'video' => '' ) );
		$id = 'zeen-engine-video-' . mt_rand( 1000, 99999 );
		$id_img = 'zeen-engine-img-' . mt_rand( 1000, 99999 );
		$id_retina = 'zeen-engine-retina-' . mt_rand( 1000, 99999 );
		?>
		<p>
			<label for="<?php echo esc_attr( $this->get_field_id('title') ); ?>"><?php esc_html_e( 'Title', 'zeen-engine' ); ?></label>
			<input class="widefat" id="<?php echo esc_attr( $this->get_field_id('title') ); ?>" name="<?php echo esc_attr( $this->get_field_name('title') ); ?>" type="text" value="<?php echo esc_attr( sanitize_text_field( $instance['title'] ) ); ?>" />
		</p>

		<p id="<?php echo esc_attr( $id_img ); ?>" class="zeen-engine-image-wrap zeen-engine-image-wrap-widget">
			<label for="<?php echo esc_attr( $this->get_field_id('url') ); ?>">
				<?php esc_html_e( 'Placeholder', 'zeen-engine' ); ?>
			</label>
			<span class="zeen-engine-control-only">
				<input id="<?php echo esc_attr( $this->get_field_id('url') ); ?>" name="<?php echo esc_attr( $this->get_field_name('url') ); ?>" type="text" value="<?php echo esc_url( $instance['url'] ); ?>" class="widefat zeen-engine-img-input zeen-engine-input-val">

				<a href="#" class="zeen-engine-upload" data-dest="<?php echo esc_attr( $id_img ); ?>" data-output="src" data-file-type="video" data-name="<?php echo esc_attr( $this->get_field_name('url') ); ?>"><?php esc_html_e( 'Upload', 'zeen-engine' ); ?></a>

			</span>
		</p>
	
		<p id="<?php echo esc_attr( $id_retina ); ?>" class="zeen-engine-image-wrap zeen-engine-image-wrap-widget">
			<label for="<?php echo esc_attr( $this->get_field_id('retina_url') ); ?>">
				<?php esc_html_e( 'Placeholder (Retina)', 'zeen-engine' ); ?>
			</label>
			<span class="zeen-engine-control-only">
				<input id="<?php echo esc_attr( $this->get_field_id('retina_url') ); ?>" name="<?php echo esc_attr( $this->get_field_name('retina_url') ); ?>" type="text" value="<?php echo esc_url( $instance['retina_url'] ); ?>" class="widefat zeen-engine-img-input zeen-engine-input-val">

				<a href="#" class="zeen-engine-upload" data-dest="<?php echo esc_attr( $id_retina ); ?>" data-output="src" data-file-type="video" data-name="<?php echo esc_attr( $this->get_field_name('retina_url') ); ?>"><?php esc_html_e( 'Upload', 'zeen-engine' ); ?></a>

			</span>
		</p>

		<p id="<?php echo esc_attr( $id ); ?>" class="zeen-engine-image-wrap zeen-engine-image-wrap-widget">
			<label for="<?php echo esc_attr( $this->get_field_id('video') ); ?>">
				<?php esc_html_e( 'Video', 'zeen-engine' ); ?>
			</label>
			<span class="zeen-engine-control-only">
				<input id="<?php echo esc_attr( $this->get_field_id('video') ); ?>" name="<?php echo esc_attr( $this->get_field_name('video') ); ?>" type="text" value="<?php echo esc_url( $instance['video'] ); ?>" class="widefat zeen-engine-img-input zeen-engine-input-val">

				<a href="#" class="zeen-engine-upload" data-dest="<?php echo esc_attr( $id ); ?>" data-output="src" data-file-type="video" data-name="<?php echo esc_attr( $this->get_field_name('video') ); ?>"><?php esc_html_e( 'Upload', 'zeen-engine' ); ?></a>

			</span>
		</p>
		<?php
	}
}