SliderWidget.php 5.52 KB
<?phpnamespace frontend\widgets;use yii\base\Widget;use yii\web\View;use frontend\assets\FlipclockAsset;class SliderWidget extends Widget{    public $title;    public function init(){        parent::init();    }    /**     * @var bool флаг загрузки скрипта слайдера     */    public $is_init_slider = false;    public function run()    {            $slider = \common\models\Slider::find()->where([\common\models\Slider::tableName().'.title'=>$this->title])->joinWith("sliderImage")->one();            if (! empty ($slider))            {                // изображения                $images = $slider->sliderImage;                if (! empty ($images))                {                    // подключаем jssor-slider                    $this->initSliderJs();                    // скрипт-обработчик                    $this->initSliderScript($slider);                    // html                    return $this->htmlSlider($slider, $images);                }            }            return $this->render('slider',[                'slider'=>$slider            ]);    }    // ==== DISPLAY ====    public function initSliderJs ()    {        if (! $this->is_init_slider)        {            // TODO:: wiget подключение jcarousel            $this->view->registerJsFile(\Yii::$app->request->baseUrl . '/js/widget-carousel/lib/jquery.jcarousel.min.js',[                'position' => View::POS_END,                'depends' => ['yii\web\JqueryAsset']            ]);            $this->is_init_slider = true;        }    }    public function initSliderScript ($slider)    {        FlipclockAsset::register($this->view);        $this->view->registerJs('            var '.$slider->title.'_option_1 = {                $AutoPlayInterval: '.$slider->duration.',                $SlideDuration: '.$slider->speed.',            };        ', 1);        $this->view->registerCssFile (\Yii::$app->request->BaseUrl . '/js/widget-carousel/'.$slider->title.'/style.css');        $this->view->registerJsFile(\Yii::$app->request->BaseUrl . '/js/widget-carousel/'.$slider->title.'/style.js',[            'position' => View::POS_END,            'depends' => ['yii\web\JqueryAsset']        ]);    }    public function htmlSlider ($slider, $images)    {        ob_start();        if (! empty ($images))        {            echo '<div id="'.$slider->title.'">';            echo '                <!-- Loading Screen -->                <div u="loading" class="loading">                    <div class="load-1"></div>                    <div class="load-2"></div>                </div>                <!-- Slides Container -->                <div u="slides" class="item-list">';            foreach ($images as $row)            {                if($row->isActive()){                    echo '<div class="item">';                    if(!empty($row->end_at) && strtotime($row->end_at) > strtotime(date("Y-m-d"))){                        ?>                        <div class="clock_style clock_<?= $row->primaryKey ?>"></div>                        <script type="text/javascript">                            var clock;                            $(document).ready(function() {                                var clock;                                clock = $('.clock_<?= $row->primaryKey ?>').FlipClock({                                    clockFace: 'DailyCounter',                                    language: 'ru',                                    classes: {                                        active: 'flip-clock-active',                                        before: 'flip-clock-before',                                        divider: 'flip-clock-divider',                                        dot: 'flip-clock-dot',                                        label: 'flip-clock-label',                                        flip: 'flip',                                        play: 'play',                                        wrapper: 'flip-clock-wrapper'                                    },                                });                                clock.setTime(<?= strtotime($row->end_at) - strtotime(date("Y-m-d H:i:s"))?>);                                clock.setCountdown(true);                                clock.start();                            });                        </script>                        <?php                    }                    if (! empty ($row->url))                    {                        echo '<a href="'.$row->url.'">';                    }                    if (empty ($row->image))                    {                        $row->image = '/img/notpic.gif';                    }                    echo '<img u="image" src="/storage/slider/'.$row->image.'" alt ="'.$row->alt.'" class="glossy" />';                    //echo '<div u="caption" class="title bg-transparent">'.$row->title.'</div>';                    if (! empty ($row->url))                    {                        echo '</a>';                    }                    echo '</div>';                }            }            echo '</div>';            echo '                <div u="navigator" class="jssorb03">                    <div u="prototype">                    </div>                </div>                <span u="arrowleft" class="jssora03l"></span>                <span u="arrowright" class="jssora03r"></span>';            echo '</div>';        }        return ob_get_clean();    }}