/**
* register asset
*/
protected function register()
{
$view = $this->getView();
PhotoswipeAsset::register($view);
/* data */
$items = [];
foreach ($this->images as $image) {
$items[] = ['src' => $image['src'], 'w' => $image['width'], 'h' => $image['height'], 'title' => !empty($image['alt']) ? $image['alt'] : null];
}
$items = json_encode($items);
/* options */
$clientOptions = json_encode($this->clientOptions);
$selector = $this->selector;
$js = <<<EOB
\$("{$selector}").css("cursor", "pointer");
var pswpElement = document.querySelectorAll('.pswp')[0];
\$(document).on("click", "{$selector}", function(e){
e.preventDefault();
var index = \$(this).index("{$selector}");
var options = {
index: index,
bgOpacity: 0.7,
showHideOpacity: true
};
\$.merge(options, {$clientOptions});
var gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, {$items}, options);
gallery.init();
});
EOB;
$view->registerJs($js);
}
/**
* register asset
*/
protected function register()
{
$view = $this->getView();
PhotoswipeAsset::register($view);
/* data */
$items = [];
foreach ($this->items as $item) {
list($w, $h) = explode("x", $item['size']);
$items[] = ['src' => $item['image'], 'w' => $w, 'h' => $h, 'title' => !empty($item['caption']) ? $item['caption'] : null];
}
$items = json_encode($items);
$clientOptions = json_encode($this->clientOptions);
$js = <<<EOB
var pswpElement = document.querySelectorAll('.pswp')[0];
\$(document).on("click", ".gallery-image", function(e){
e.preventDefault();
var index = \$(this).data("index");
var options = {
index: index,
bgOpacity: 0.7,
showHideOpacity: true
};
\$.merge(options, {$clientOptions});
var gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, {$items}, options);
gallery.init();
});
EOB;
$view->registerJs($js);
}