1
|
|
|
<?php |
2
|
|
|
|
3
|
|
|
namespace dominus77\lightslider; |
4
|
|
|
|
5
|
|
|
use yii\base\Widget; |
6
|
|
|
use yii\helpers\Html; |
7
|
|
|
use yii\helpers\Json; |
8
|
|
|
use yii\helpers\ArrayHelper; |
9
|
|
|
use yii\web\JsExpression; |
10
|
|
|
use dominus77\lightslider\assets\SliderAsset; |
11
|
|
|
use dominus77\lightslider\assets\GalleryAsset; |
12
|
|
|
|
13
|
|
|
/** |
14
|
|
|
* Class Slider |
15
|
|
|
* Renders a JQuery LightSlider widget for Yii2. |
16
|
|
|
* @package dominus77\lightslider |
17
|
|
|
* @see http://sachinchoolur.github.io/lightslider/ |
18
|
|
|
* |
19
|
|
|
* Slider |
20
|
|
|
* ------------------------------------------------- |
21
|
|
|
* <?= \dominus77\lightslider\Slider::widget([ |
22
|
|
|
* 'items' => ['Slide 1', 'Slide 2', 'Slide 3', 'Slide 4', 'Slide 5', 'Slide 6', 'Slide 7', '...'], |
23
|
|
|
* 'clientOptions' => [ |
24
|
|
|
* 'item' => 3, |
25
|
|
|
* 'autoWidth' => false, |
26
|
|
|
* 'slideMove' => 1, // slidemove will be 1 if loop is true |
27
|
|
|
* 'slideMargin' => 10, |
28
|
|
|
* //... |
29
|
|
|
* ], |
30
|
|
|
* 'listOptions' => [], |
31
|
|
|
* 'itemOptions' => [], |
32
|
|
|
* ]); ?> |
33
|
|
|
* |
34
|
|
|
* Integrate with lightGallery (http://sachinchoolur.github.io/lightGallery/) |
35
|
|
|
* |
36
|
|
|
* ------------------------------------------------- |
37
|
|
|
* <?= \dominus77\lightslider\Slider::widget([ |
38
|
|
|
* 'id' => 'myGalleryID', |
39
|
|
|
* 'items' => [ |
40
|
|
|
* [ |
41
|
|
|
* 'item' => \yii\helpers\Html::img(Yii::getAlias('@web/uploads/img/image1.jpg')), |
42
|
|
|
* 'options' => [ |
43
|
|
|
* 'data-thumb' => \Yii::getAlias('@web/uploads/img/thumb/image1.jpg'), |
44
|
|
|
* 'data-src' => \Yii::getAlias('@web/uploads/img/largeImage1.jpg'), |
45
|
|
|
* //... |
46
|
|
|
* ] |
47
|
|
|
* ], |
48
|
|
|
* [ |
49
|
|
|
* 'item' => \yii\helpers\Html::img(Yii::getAlias('@web/uploads/img/image2.jpg')), |
50
|
|
|
* 'options' => [ |
51
|
|
|
* 'data' => [ |
52
|
|
|
* 'thumb' => \Yii::getAlias('@web/uploads/img/thumb/image2.jpg'), |
53
|
|
|
* 'src' => \Yii::getAlias('@web/uploads/img/largeImage2.jpg'), |
54
|
|
|
* ], |
55
|
|
|
* //... |
56
|
|
|
* ] |
57
|
|
|
* ], |
58
|
|
|
* //... |
59
|
|
|
* ], |
60
|
|
|
* 'clientOptions' => [ |
61
|
|
|
* 'gallery' => true, |
62
|
|
|
* 'item' => 1, |
63
|
|
|
* 'loop' => true, |
64
|
|
|
* 'thumbItem' => 9, |
65
|
|
|
* 'slideMargin' => 0, |
66
|
|
|
* 'enableDrag' => false, |
67
|
|
|
* 'currentPagerPosition' => 'left', |
68
|
|
|
* 'onSliderLoad' => new \yii\web\JsExpression("function(el) { |
69
|
|
|
* el.lightGallery({ |
70
|
|
|
* selector: '#myGalleryID .lslide' |
71
|
|
|
* }); |
72
|
|
|
* }"), |
73
|
|
|
* //... |
74
|
|
|
* ], |
75
|
|
|
* //... |
76
|
|
|
* ]); ?> |
77
|
|
|
*/ |
78
|
|
|
class Slider extends Widget |
79
|
|
|
{ |
80
|
|
|
/** |
81
|
|
|
* @var string|integer |
82
|
|
|
* 'id' => 'myId', |
83
|
|
|
*/ |
84
|
|
|
public $id = ''; |
85
|
|
|
|
86
|
|
|
/** |
87
|
|
|
* Items |
88
|
|
|
* @var array |
89
|
|
|
* |
90
|
|
|
* [ |
91
|
|
|
* '<h1>Slide 1</h1><p>Text 1</p>', |
92
|
|
|
* '<h1>Slide 2</h1><p>Text 2</p>', |
93
|
|
|
* '...', |
94
|
|
|
* ] |
95
|
|
|
*/ |
96
|
|
|
public $items = []; |
97
|
|
|
|
98
|
|
|
/** |
99
|
|
|
* @var array |
100
|
|
|
* @see http://sachinchoolur.github.io/lightslider/ |
101
|
|
|
*/ |
102
|
|
|
public $clientOptions = []; |
103
|
|
|
|
104
|
|
|
/** |
105
|
|
|
* List Options |
106
|
|
|
* @var array |
107
|
|
|
* 'listOptions' => ['class' => 'myListCssClass'] |
108
|
|
|
*/ |
109
|
|
|
public $listOptions = []; |
110
|
|
|
|
111
|
|
|
/** |
112
|
|
|
* Items options |
113
|
|
|
* @var array |
114
|
|
|
* 'itemOptions' => ['class' => 'myItemsCssClass'] |
115
|
|
|
*/ |
116
|
|
|
public $itemOptions = []; |
117
|
|
|
|
118
|
|
|
/** |
119
|
|
|
* @var integer|string |
120
|
|
|
*/ |
121
|
|
|
private $_id; |
|
|
|
|
122
|
|
|
|
123
|
|
|
/** |
124
|
|
|
* @var |
125
|
|
|
*/ |
126
|
|
|
private $_options = []; |
127
|
|
|
|
128
|
|
|
/** |
129
|
|
|
* Initializes the widget. |
130
|
|
|
*/ |
131
|
2 |
|
public function init() |
132
|
|
|
{ |
133
|
2 |
|
parent::init(); |
134
|
2 |
|
$this->_id = $this->id ? $this->id : $this->getId(); |
135
|
2 |
|
$this->listOptions['id'] = $this->_id; |
136
|
2 |
|
$this->_options = $this->getOptions(); |
137
|
2 |
|
} |
138
|
|
|
|
139
|
|
|
/** |
140
|
|
|
* Renders widget |
141
|
|
|
* @inheritdoc |
142
|
|
|
*/ |
143
|
1 |
|
public function run() |
144
|
|
|
{ |
145
|
1 |
|
if ($this->items) { |
|
|
|
|
146
|
1 |
|
$this->registerAssets(); |
147
|
1 |
|
echo Html::beginTag('ul', $this->listOptions) . PHP_EOL; |
148
|
1 |
|
if (ArrayHelper::isAssociative($this->items[0])) { |
149
|
|
|
$this->renderGalleryItems(); |
150
|
|
|
} else { |
151
|
1 |
|
$this->renderSliderItems(); |
152
|
|
|
} |
153
|
1 |
|
echo Html::endTag('ul') . PHP_EOL; |
154
|
|
|
} |
155
|
1 |
|
} |
156
|
|
|
|
157
|
|
|
/** |
158
|
|
|
* Render Slider Items |
159
|
|
|
*/ |
160
|
1 |
|
public function renderSliderItems() |
161
|
|
|
{ |
162
|
1 |
|
foreach ($this->items as $key => $item) { |
163
|
1 |
|
echo Html::tag('li', $item, $this->itemOptions) . PHP_EOL; |
164
|
|
|
} |
165
|
1 |
|
} |
166
|
|
|
|
167
|
|
|
/** |
168
|
|
|
* Render Gallery Items |
169
|
|
|
*/ |
170
|
|
|
public function renderGalleryItems() |
171
|
|
|
{ |
172
|
|
|
foreach ($this->items as $item) { |
173
|
|
|
$itemData = []; |
174
|
|
|
if (isset($item['options'])) { |
175
|
|
|
foreach ($item['options'] as $key => $data) { |
176
|
|
|
$itemData[$key] = $data; |
177
|
|
|
} |
178
|
|
|
} |
179
|
|
|
$itemOptions = ArrayHelper::merge($itemData, $this->itemOptions); |
180
|
|
|
echo Html::tag('li', $item['item'], $itemOptions) . PHP_EOL; |
181
|
|
|
} |
182
|
|
|
} |
183
|
|
|
|
184
|
|
|
/** |
185
|
|
|
* Set client options |
186
|
|
|
* @return array |
187
|
|
|
*/ |
188
|
2 |
|
public function getOptions() |
189
|
|
|
{ |
190
|
2 |
|
$options = []; |
191
|
2 |
|
return ArrayHelper::merge($options, $this->clientOptions); |
192
|
|
|
} |
193
|
|
|
|
194
|
|
|
/** |
195
|
|
|
* Register resource |
196
|
|
|
*/ |
197
|
1 |
|
public function registerAssets() |
198
|
|
|
{ |
199
|
1 |
|
$options = Json::encode($this->_options); |
200
|
1 |
|
$view = $this->getView(); |
201
|
1 |
|
SliderAsset::register($view); |
202
|
1 |
|
if (isset($this->_options['gallery']) && $this->_options['gallery'] === true) { |
203
|
|
|
GalleryAsset::register($view); |
204
|
|
|
} |
205
|
1 |
|
$script = new JsExpression(" |
206
|
1 |
|
var slider = $('#{$this->_id}').lightSlider({$options}); |
207
|
|
|
"); |
208
|
1 |
|
$view->registerJs($script, $view::POS_READY); |
209
|
1 |
|
} |
210
|
|
|
} |
211
|
|
|
|