<?php

/* @var $this yii\web\View
 * @var \common\models\slider\Slide[] $slides;
 * @var \common\models\blog\Article[] $articles
 * @var \common\models\Service[] $services
 * @var \common\models\Comment[] $comments
 * @var \common\models\Settings $settings
 * @var \common\models\Package[] $package;
 * @var \artbox\core\components\SeoComponent $seo;
 */
    
    use artbox\core\helpers\ImageHelper;
    use artbox\core\helpers\Url;
    use yii\web\View;
    $seo = Yii::$app->get('seo');
    \frontend\assets\ScrollAsset::register($this);
    $js = <<<JS
          //первый слайдер
          if($(window).width() > 767) {
        $('.for-hidden-mob').mCustomScrollbar(
            {
                autoHideScrollbar: true,
                theme: 'minimal'
            }
        );
    }
          setTimeout(function() {
              if ($(".slider-first")
                      .children().length > 1) {

                  $(".slider-first")
                      .owlCarousel({
                          responsiveClass: true,
                          navSpeed: 600,
                          smartSpeed: 600,
                          dots: true,
                          nav: true,
                          navText: [],
                          items: 1,
                          autoplay: true,
                          autoplayTimeout: 6000,
                          autoplayHoverPause: true,
                          loop: true,
                          autoHeight: true,
                          onInitialized: function() {
                              $(".slider-first")
                                  .find('.owl-nav')
                                  .addClass('wrapp-navi')
                              $(".slider-first")
                                  .find('.owl-dots')
                                  .addClass('wrapp-navi')
                              $(".slider-first")
                                  .find('.wrapp-navi')
                                  .wrapAll("<div class='owl-controls-wrapp'><div class='container'><div class='row'><div class='owl-controls-pre-bl col-xs-12 col-sm-5 col-lg-5 col-sm-push-7'><div class='owl-controls'></div></div></div></div></div>");
                              //                $(".slider-first").find('.wrapp-navi').wrapAll( "<div class='owl-controls-wrapp'><div class='container'><div class='row'><div class='hidden-xs col-sm-7 col-md-7'></div><div class='col-xs-12 col-sm-5 col-md-5'><div class='owl-controls'></div></div></div></div></div>");
                          }
                      });

              }
          }, 2200)
      

JS;

    $this->registerJs($js, View::POS_LOAD);

?>
<?php if (!empty($slides)) {?>
<section class="slider-category-wrapp hidden-xs">
  <div class="slider-first-wrapp">
    <div class="style slider-first owl-carousel">
      <?php foreach ($slides as $slide){?>
      <div class="slider-first-items">
        <a href="<?=$slide->link?>">
          <!--размер img 1920x556-->
            <?=ImageHelper::set($slide->language->image->getPath())
                          ->cropResize(1920, 556)
                          ->quality(82)
                          ->renderImage()?>
        </a>
      </div>
      <?php }?>
    
    </div>
  </div>
</section>
<?php }?>

<section class="section-box-2">
    <?php if (!empty($services)){?>
  <div class="container">
    <div class="row">
      <?php foreach ($services as $service){?>
      <div class="col-xs-6 col-sm-3 col-md-3 categories-home-wr">
        <div class="categories-home">
          <div class="img">
            <!--263x146px-->
              <?=ImageHelper::set($service->image->getPath())
                            ->cropResize(263, 146)
                            ->quality(84)
                            ->renderImage(['alt'=>ucfirst($service->title).' - Консультация врача и лечение заболеваний',
                                'title'=>ucfirst($service->title).' - Консультация врача и лечение заболеваний'])?>
          </div>
          <div class="style categories-home-links-wr">
            <div class="style categories-home-links-title">
              <!--если есть вложенность добавить класс для а "arrow"-->
              <a <?=(count($service->services) > 0 ? 'class="arrow"' : '')?>
                      href="<?=Url::to(['alias' => $service->language->alias])?>"><span><?=$service->title?></span></a>
            </div>
            <?php if (count($service->services) > 0){?>
            <!--если есть вложенность-->
            <div class="style categories-home-links-hidden">
              <ul>
                <?php foreach ($service->services as $item){?>
                <li><a href="<?=Url::to(['alias' => $item->language->alias])?>"><?=$item->title?></a></li>
                <?php } ?>
              </ul>
            </div>
            <?php } ?>
          </div>
        </div>
      </div>
      <?php } ?>
  </div>
      <?php }?>
</section>

<section class="section-box-home-doc">
    <style>
        .doctor_long_img {
            width: 340px;
            height: 440px;
        }

        .doctor_short_img {
            width: 165px;
            height: 165px;
        }
    </style>
    <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>
</section>

<?php if (!empty($seo->text)){?>

<section class="section-box-3">
  <div class="container">
    
    <div class="row">
      <div class="hidden-xs col-sm-5 col-md-5 col-lg-5"></div>
      <div class="col-sm-12 col-md-12 col-lg-12">
        <div class="style box3-text-wr">
          <h1 class="box3-text-title"><?=$seo->h1?></h1>
          <div class="hidden-sm hidden-md hidden-lg row box3-img-hidden-wrapp">
            <img class="box3-img-hidden" src="images/box-3/box3-new.jpg" alt="">
          </div>
          <div class="for-hidden-mob style status-hide">
              <?=$seo->text?>
          </div>
          <div class="show-txt-mo hide-status" data-langshow="развернуть" data-langhide="свернуть"><span>
                  <b><?=\Yii::t('app','Slide Up')?></b>
              </span></div>
        </div>
      </div>
    </div>
<!--    <img class="hidden-xs box3-img" src="images/box-3/box3-new.jpg" alt="">-->
  </div>
</section>
<?php }?>
<section class="section-box-4">
    <?php if (!empty($package)){?>
  <div class="container">
    <div class="row">
      <div class="col-xs-12">
        <div class="title-bx4"><?=\Yii::t('app','Package offerings')?></div>
      </div>
    </div>
    <div class="row">
      <?php foreach ($package as $item){?>
      <div class="col-xs-12 col-sm-4 package-offers-wr">
        <a href="<?=Url::to(['alias' => $item->language->alias])?>">
          <div class="img"><?=ImageHelper::set(($item->image) ? $item->image->getPath() : null)
                                         ->cropResize(388, 240)
                                         ->quality(82)
                                         ->renderImage()?></div>
          <div class="rotate"><?=ImageHelper::set(($item->image) ? $item->image->getPath() : null)
                                            ->cropResize(388, 240)
                                            ->quality(82)
                                            ->renderImage()?></div>
          <p><?=$item->title?></p>
          <span class="btn_"><?=\Yii::t('app','Buy')?></span>
        </a>
      </div>
      <?php }?>
    </div>
  </div>
  <?php }?>
</section>
<?php if (!empty($comments)){?>
<div class="section-box-5 fix-map-margin">
  <div class="container">
    <div class="row">
      <div class="col-xs-12">
        <div class="title-bx4"><?=\Yii::t('app','Callbacks')?> <br />
            <?=\Yii::t('app','ours clients')?></div>
      </div>
    </div>
    <div class="row slider-home sliders">
      <?php foreach ($comments as $comment){?>
      <div class="col-xs-12 col-sm-4">
        <div class="style comments-h-autor"><?=$comment->name?></div>
        <div class="style comments-h-text"><?=$comment->comment?></div>
      </div>
      <?php }?>
    <div class="row add-comment-h-wr">
      <div class="col-xs-12 add-comment-h">
        <span class="btn_"><?=\Yii::t('app','Give feedback')?></span>
      </div>
    </div>
  </div>
</div>
<?php }?>