Uikit2 ! Макет слайдшоу в элементе Zoo gallery

UIkit слайдер вместо стандартного от zoo.

Ресайзятся изображения слайда и миниатюр.

* Все стили и скрипты слайдера, подключены в шаблоне сайта, тут про них ни слова.

1. Скопировать элемент ../media/zoo/elements/gallery в папку приложения ZOO, например сюда: ../media/zoo/applications/jbuniversal/elements/

2. В файле: gallery.xml, создать новый параметр с выбором будущего щаблона, например так:

<param name="mode" type="list" default="lightbox" label="Mode" description="The gallery mode">
	<option value="lightbox">Lightbox</option>
	<option value="slideshow">Slideshow</option>
	<option value="slideshow_ui">Slideshow-UI</option>
</param>

3. Создать одноименный шаблон в папке tmpl.

4. В файле gallery.php, создать новую переменную для полных, "ресайзнутых" изображений слайдов (у меня - $all), так:

foreach ($this->getFiles() as $filename) {

	$file  = $path.$filename;
	$thumb = $this->app->zoo->resizeImage($file, $width, $height);
	$all = $this->app->zoo->resizeImage($file, $slideshow_width, $slideshow_height);
//...

* Параметры ширины и высоты взяты из параметров элемента. Раньше они задавали размеры "обёрточного" блока слайдера.

4.1. Тут же в массиве $thumbs[] = array, добавить all, по аналогии с тумбочками.

$thumbs[] = array(
	'name'         => $name,
	'title'        => $title,
	'filename'     => $filename,
	'img'          => JURI::root().$this->app->path->relative($file),
	'img_file'     => $file,
	'thumb'		   => JURI::root().$this->app->path->relative($thumb),
	'all'		   => JURI::root().$this->app->path->relative($all),
	'thumb_width'  => $thumb_width,
	'thumb_height' => $thumb_height
);

5. Шаблоне slideshow_ui.php, для изображений слайдера использовать по аналогии с тумбочками, созданные All.

В итоге должно получиться что-то типа:

<div class="class" data-uk-slideshow="{animation: 'slide-right'}">

	<ul class="uk-slideshow">

	<?php foreach ($thumbs as $image) : ?>

		<li>
			<img src="/<?php echo $image['all']; ?>" alt="<?php echo $titlealt; ?>"/>
		</li>
	<?php endforeach; ?>

	</ul>
</div>

Из параметров элемента берутся только размеры слайдера - теперь это размер каждого полного слайда.