Solves disapearring slides issue and more adjustments. #499

This commit is contained in:
mateuswetah 2021-03-18 17:40:20 -03:00
parent 1ec5359a98
commit b3be04199d
2 changed files with 23 additions and 26 deletions

View File

@ -489,9 +489,9 @@ function tainacan_get_the_media_component_slide( $args = array() ) {
<?php echo $args['media_title'] ?> <?php echo $args['media_title'] ?>
</span> </span>
<?php endif; ?> <?php endif; ?>
<br>
<?php if ( !empty($args['media_description']) ) :?> <?php if ( !empty($args['media_description']) ) :?>
<span class="swiper-slide-metadata__description"> <span class="swiper-slide-metadata__description">
<br>
<?php echo $args['media_description'] ?> <?php echo $args['media_description'] ?>
</span> </span>
<?php endif; ?> <?php endif; ?>

View File

@ -116,27 +116,23 @@ class TainacanMediaGallery {
// parse slide data (url, title, size ...) from DOM elements // parse slide data (url, title, size ...) from DOM elements
// (children of gallerySelector) // (children of gallerySelector)
parseThumbnailElements(el) { parseThumbnailElements(el) {
let thumbElements = el.childNodes, let items = [];
items = [], const galleryElements = el.childNodes;
liElement,
metadataElement,
fullContentElement,
item;
for (let i = 0; i < thumbElements.length; i++) {
liElement = thumbElements[i];
// include only element nodes // Crossbrowser safe way to traverse nodeList
if (liElement.nodeType !== 1) Array.prototype.forEach.call(galleryElements, (liElement) => {
continue;
fullContentElement = liElement.querySelectorAll('.media-full-content *');
if ( !fullContentElement.length ) { // Include only element nodes
if (liElement.nodeType === 1) {
let item = {};
let fullContentElement = liElement.querySelectorAll('.media-full-content *');
if ( !fullContentElement.length ) {
item = { item = {
html: fullContentElement.outterHTML ? fullContentElement.outterHTML : fullContentElement html: fullContentElement.outerHTML ? fullContentElement.outerHTML : fullContentElement
} }
} else { } else {
if (fullContentElement[fullContentElement.length - 1].nodeName === 'IMG') { if (fullContentElement[fullContentElement.length - 1].nodeName === 'IMG') {
fullContentElement = fullContentElement[fullContentElement.length - 1]; fullContentElement = fullContentElement[fullContentElement.length - 1];
item = { item = {
@ -147,13 +143,13 @@ class TainacanMediaGallery {
} else { } else {
fullContentElement = fullContentElement[0]; fullContentElement = fullContentElement[0];
item = { item = {
html: fullContentElement.outterHTML ? fullContentElement.outterHTML : fullContentElement html: fullContentElement.outerHTML ? fullContentElement.outerHTML : fullContentElement
} }
} }
} }
metadataElement = liElement.querySelector('.swiper-slide-metadata'); let metadataElement = liElement.querySelector('.swiper-slide-metadata');
if (metadataElement) { if (metadataElement) {
const name = metadataElement.querySelector('.swiper-slide-metadata__name'); const name = metadataElement.querySelector('.swiper-slide-metadata__name');
const caption = metadataElement.querySelector('.swiper-slide-metadata__caption'); const caption = metadataElement.querySelector('.swiper-slide-metadata__caption');
const description = metadataElement.querySelector('.swiper-slide-metadata__description'); const description = metadataElement.querySelector('.swiper-slide-metadata__description');
@ -163,11 +159,12 @@ class TainacanMediaGallery {
caption, caption,
description description
} }
}
item.el = liElement; // save link to element for getThumbBoundsFn
items.push(item);
} }
});
item.el = liElement; // save link to element for getThumbBoundsFn
items.push(item);
}
return items; return items;
}; };