<?if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();
/** @var array $arParams */
/** @var array $arResult */
/** @global CMain $APPLICATION */
/** @global CUser $USER */
/** @global CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */
/** @var CBitrixComponent $component */
$this->setFrameMode(true);
?>

<section class="video-swiper-block block" id="testimonials">
    <div class="video-swiper-block__content container">
        <div class="row flex-lg-row-reverse flex-row video-swiper-block__active-content" data-set="active-content">
            <div class="col-12 col-lg-5">
                <h2 class="video-swiper-block__title block__title">Ответы на вопросы</h2>
                <div class="video-swiper-block__text">
                    <h3 data-set="question"></h3>
                    <p data-set="answer"></p>
                </div>
            </div>
            <div class="col-12 col-lg-7 px-0 px-sm-auto">
                <div class="video-swiper-block__video video">
                    <div class="video__preview pic-wrapper" data-set="img-src">
                        <img class="_center" src="<?=SITE_TEMPLATE_PATH.'/img/common/filler-7.jpg';?>" alt="-">
                        <button class="video__play-btn"><img src="<?=SITE_TEMPLATE_PATH.'/img/icons/play-btn.svg';?>" alt="PLAY"></button>
                    </div>
                    <div class="video__content" data-set="video-src"><iframe loading="lazy" width="100%" height="434" src="https://www.youtube.com/embed/JR8yP1CGtzU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope picture-in-picture" allowfullscreen></iframe></div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-12">
                <div class="video-swiper-block__swiper swiper" data-swiper-name="video-swiper">
                    <div class="video-swiper-block__items swiper-wrapper">
                        <?foreach($arResult["ITEMS"] as $arItem):?>
                        	<?
                        	$this->AddEditAction($arItem['ID'], $arItem['EDIT_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_EDIT"));
                        	$this->AddDeleteAction($arItem['ID'], $arItem['DELETE_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_DELETE"), array("CONFIRM" => GetMessage('CT_BNL_ELEMENT_DELETE_CONFIRM')));
                        	?>
                            <div class="video-swiper-block__item swiper-slide" id="<?=$this->GetEditAreaId($arItem['ID']);?>" set-img-src="<?=Nastart\Pict::resizePict($arItem["PREVIEW_PICTURE"],618,440,false,70)['SRC'];?>">
                                <ul class="attrs">
                                    <?if($arItem['PROPERTIES']['MORE_LIKED']['VALUE']):?>
                                    <li>set-like=<?=$arItem['PROPERTIES']['MORE_LIKED']['VALUE'];?></li>
                                    <li>set-question=q4</li>
                                    <?endif;?>
                                    <?if($arItem['PROPERTIES']['WORK_TIME']['VALUE']):?>
                                    <li>set-time=<?=$arItem['PROPERTIES']['WORK_TIME']['VALUE'];?></li>
                                    <li>set-answer=a4</li>
                                    <?endif;?>
                                    <li>set-video-src=https://www.youtube.com/embed/<?=$arItem['VIDEOID'];?></li>
                                </ul>
                                <?if($arItem["PREVIEW_PICTURE"]):?>
                                <div class="video-swiper-block__item-pic pic-wrapper">
                                    <?=Nastart\Pict::getPicture($arItem["PREVIEW_PICTURE"],370,245,false,70);?>
                                </div>
                                <?endif;?>
                            </div>
                        <?endforeach;?>
                    </div>
                    <div class="swiper__panel">
                        <div class="swiper__pag"></div>
                        <div class="swiper__nav">
                            <button class="swiper__btn-prev"><svg xmlns="http://www.w3.org/2000/svg" width="61" height="16" viewBox="0 0 61 16" fill="none">
                                    <path d="M0.292889 8.70711C-0.0976334 8.31658 -0.0976334 7.68342 0.292889 7.29289L6.65685 0.928932C7.04737 0.538408 7.68054 0.538408 8.07106 0.928932C8.46159 1.31946 8.46159 1.95262 8.07106 2.34315L2.41421 8L8.07106 13.6569C8.46159 14.0474 8.46159 14.6805 8.07106 15.0711C7.68054 15.4616 7.04737 15.4616 6.65685 15.0711L0.292889 8.70711ZM61 9L0.999996 9V7L61 7V9Z" fill="#E8E8FF" />
                                </svg>
                            </button>
                            <button class="swiper__btn-next"><svg xmlns="http://www.w3.org/2000/svg" width="61" height="16" viewBox="0 0 61 16" fill="none">
                                    <path d="M60.7071 8.70711C61.0976 8.31658 61.0976 7.68342 60.7071 7.29289L54.3432 0.928932C53.9526 0.538408 53.3195 0.538408 52.9289 0.928932C52.5384 1.31946 52.5384 1.95262 52.9289 2.34315L58.5858 8L52.9289 13.6569C52.5384 14.0474 52.5384 14.6805 52.9289 15.0711C53.3195 15.4616 53.9526 15.4616 54.3432 15.0711L60.7071 8.70711ZM0 9H60V7H0V9Z" fill="#4F6ECB" />
                                </svg>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>