<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
$gridpress_card_data = $gridpress_card_data ?? [];

$gridpress_card_id = isset( $gridpress_card_data['id'] ) ? $gridpress_card_data['id'] : '';
$gridpress_video_url = isset( $gridpress_card_data['video_url'] ) ? $gridpress_card_data['video_url'] : '';
$gridpress_thumb_image = isset( $gridpress_card_data['thumb_image'] ) ? $gridpress_card_data['thumb_image'] : '';
$gridpress_video_views = isset( $gridpress_card_data['video_views'] ) ? $gridpress_card_data['video_views'] : '';
$gridpress_video_likes = isset( $gridpress_card_data['video_likes'] ) ? $gridpress_card_data['video_likes'] : '';

$gridpress_show_views = isset( $gridpress_display_settings['show_views'] ) ? $gridpress_display_settings['show_views'] : '';
$gridpress_show_likes = isset( $gridpress_display_settings['show_likes'] ) ? $gridpress_display_settings['show_likes'] : '';
?>

<div class="jc-cards gridpress-videocard-itmcon" data-id="<?php echo esc_attr( $gridpress_card_id ); ?>">
    <div class="jc-cards-camera-icon">
        <img src="<?php echo esc_url( GRIDPRESS_URL . 'images/camera.svg' ); ?>"
             alt="<?php echo esc_attr__( 'Video', 'gridpress-grid-layout-design' ); ?>">
    </div>
    <strong class="jc-cards-title">
        <a href="#">
            <?php echo esc_html( $gridpress_card_data['short_title'] ); ?>
        </a>
    </strong>
    <div class="jc-cards-image">
        <a class="jc-cards-image-wrap" href="#">
            <img src="<?php echo esc_url( $gridpress_thumb_image ); ?>"
                 alt="<?php echo esc_attr( $gridpress_card_data['short_title'] ); ?>">
        </a>
        <a href="#" class="jc-cards-play">
            <img src="<?php echo esc_url( GRIDPRESS_URL . 'images/play.svg' ); ?>"
                 alt="<?php echo esc_attr__( 'Play', 'gridpress-grid-layout-design' ); ?>">
        </a>
    </div>
    <?php if ( $gridpress_show_views === 'on' || $gridpress_show_likes === 'on' ) : ?>
        <div class="jc-cards-image-overlay">

            <?php if ( ! empty( $gridpress_video_views ) && $gridpress_show_views === 'on' ) : ?>
                <a href="#" class="jc-cards-stats gridpress-dynm-video-views">
                    <div class="jc-cards-stats-icons">
                        <img src="<?php echo esc_url( GRIDPRESS_URL . 'images/eye.svg' ); ?>"
                             alt="<?php echo esc_attr__( 'Views', 'gridpress-grid-layout-design' ); ?>">
                    </div>
                    <span class="jc-cards-stats-text">
                        <?php echo esc_html( $gridpress_video_views ); ?>
                    </span>
                </a>
            <?php endif; ?>

            <?php if ( ! empty( $gridpress_video_likes ) && $gridpress_show_likes === 'on' ) : ?>
                <a href="#" class="jc-cards-stats gridpress-dynm-video-likes">
                    <div class="jc-cards-stats-icons">
                        <img src="<?php echo esc_url( GRIDPRESS_URL . 'images/like.svg' ); ?>"
                             alt="<?php echo esc_attr__( 'Likes', 'gridpress-grid-layout-design' ); ?>">
                    </div>
                    <span class="jc-cards-stats-text">
                        <?php echo esc_html( $gridpress_video_likes ); ?>
                    </span>
                </a>
            <?php endif; ?>
        </div>
    <?php endif; ?>
</div>