<?php
/**
 * @var object $this
 * @var object|null $docs common\models\Doctor        список всех докторов с status = true
 */

use yii\helpers\Html;
use artbox\core\helpers\ImageHelper;


?>


<style>
    .doctor_long_img {
        width: 340px;
        height: 440px;
    }

    .doctor_short_img {
        width: 165px;
        height: 165px;
    }
</style>
<section class="section-breadcrumb">
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-12 breadcrumb-wrapp">
                <ul class="breadcrumb" itemscope="" itemtype=" http://schema.org/BreadcrumbList"><li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"><a href="/" itemprop="item"><span itemprop="name">Главная</span></a><meta itemprop="position" content="1"></li>
                    <li class="active" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
                        <span itemprop="name">Наши врачи</span>
                        <link itemprop="item" content="#"><meta itemprop="position" content="2">
                    </li>
                </ul>
            </div>
        </div>
    </div>
</section>

<section class="doctor-page">
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-12">
                <h1 class="title-pages">Наши врачи</h1>
            </div>
        </div>
    </div>

    <div class="style slider-doctors-wrapper">
        <div class="style slider-doctors owl-carousel">

	        <?php if (isset($docs)) {
		        $first = '';
		        $second = '';
		        $third = '';
		        $counter = 0;
		        foreach ($docs as $doc) {
			        $activeStyle = ($counter == 0) ? 'active' : '';
			        $docFio = explode(" ", $doc->language->name);
			        $docName = ($docFio[0]) ?? '';
			        $docSurname = ($docFio[1]) ?? '';
			        $docPosition = $doc->language->position;
			        $docDescription = $doc->language->description;
			        $img1 = '';
			        $img2 = '';
			        if (isset($doc->image)) {
				        $img1 = ImageHelper::set(($doc->image) ? $doc->image->getPath() : null)
					        ->cropResize(340, 440)
					        ->quality(84)
					        ->renderImage();
				        $img2 = ImageHelper::set(($doc->image) ? $doc->image->getPath() : null)
					        ->cropResize(165, 165)
					        ->quality(84)
					        ->renderImage();

			        }
			        #die(var_dump(htmlspecialchars($img1)));
			        # $docImg1 = (isset($doc->image->fileName)) ? "/images/" . $doc->image->fileName : "/images/no-image.png";
			        $docImg2 = (isset($doc->image->fileName)) ? "/images/" . $doc->image->fileName : "/images/no-image.png";
			        $docImg3 = (isset($doc->image->fileName)) ? "/images/" . $doc->image->fileName : "/images/no-image.png";


			        $first .= ' <div class="slider-doc-items">
                <div class="slider-doc-img-wr">
                    <!-- 340x440px-->
                    ' . $img1 . '
                </div>
            </div>';


			        $second .= '   <div class="' . $activeStyle . ' slider-doc-main-items" style="display: none;">
                <div class="slider-doc-main-item-img">
                    <div>
                       ' . $img1 . '
                    </div>
                </div>
                <div class="slider-doc-main-item-txt">
                    <div class="doc-name">' . $docName . '</div>
                    <div class="doc-surname">' . $docSurname . '</div>
                    <div class="specialty">' . $docPosition . '</div>
                    <div class="doc-txt">
                        <p>
                           ' . $docDescription . '
                        </p>
                    </div>
                    <div class="doc-btn">
                        <span class="btn_ modal-link" data-form="callback">Записаться на прием</span>
                    </div>
                </div>
                <div class="btns-doc">
                    <div class="left"></div>
                    <div class="right"></div>
                </div>
            </div>';


			        $third .= '      <div class="col-xs-12 col-sm-6 doctors-col">
                <div class="row">
                    <div class="col-xs-12 col-sm-4 doctor-img-wr">
                        <div class="doctor-img">
                            <!--165x165px-->
                            ' . $img2 . '
                        </div>
                    </div>
                    <div class="col-xs-12 col-sm-8">
                        <div class="style doc-name">' . $docName . '</div>
                        <div class="style doc-surname">' . $docSurname . '</div>
                        <div class="style specialty">' . $docPosition . '</div>
                        <div class="style doc-txt">
                            <p>
                             ' . $docDescription . '
                            </p>
                        </div>
                        <div class="style doc-btn">
                            <span class="btn_ modal-link" data-form="callback">Записаться на прием</span>
                        </div>
                    </div>
                </div>
            </div>';
			        ++$counter;
		        }
	        } ?>


	        <?= $first; ?>
        </div>

        <div class="slider-doc-main">
	        <?= $second; ?>



        </div>
    </div>

    <div class="container">
        <div class="row">

	        <?= $third; ?>




        </div>
    </div>

</section>