document.querySelectorAll>document.querySelectorAll('.accordion-item__description').forEach((item) => {
const imageExtRegExp = /\.(jpg|jpeg|png|webp|avif|gif|svg)$/;
const videoExtRegExp = /\.(mp4|avi|wmv|mov|flv|mkv|webm|vob|ogv|m4v|3gp|3g2|mpeg|mpg|m2v|m4v|svi|3gpp|3gpp2|mxf|roq|nsv|flv|f4v|f4p|f4a|f4b)$/;
const youtubevimeoRegExp = /(?:https?:)?\/{2}(?:www\.)?youtu\.?be(?:\/|\.com\/watch\?v\=|\.com\/v\/|\.com\/embed\/)?([\w-]*)[?&]?.*|(?:http:|https:|)\/\/(?:player.|www.)?vimeo\.com\/(?:video\/|embed\/|watch\?\S*v=|v\/)?(\d*)/;
item.querySelectorAll('a').forEach((link) => {
const linkParent = link.parentElement;
const nodes = linkParent.childNodes;
const columnize = () => {
nodes.forEach(node => {
if(node.nodeType === Node.TEXT_NODE) {
linkParent.querySelector('*').style.flexBasis = '50%';
linkParent.style.display = 'flex';
linkParent.style.alignItems = 'center';
linkParent.style.gap = '15px';
}
});
}
if(imageExtRegExp.test(link.href)) {
const wrapperLink = link;
const imgSrc = link.href;
const hasLink = /[\[.*\]]/.test(linkParent.textContent);
const img = document.createElement('img');
const linkHref = linkParent.textContent.replace(/(.+)\[(.+)\](.*)/, '$2');
img.src = imgSrc;
img.alt = link.innerText.replace('/\(.*?\)/','');
img.style = 'max-width: 100%';
if(hasLink) {
wrapperLink.innerHTML = '';
wrapperLink.href = linkHref;
wrapperLink.append(img);
link.replaceWith(wrapperLink);
}
else { link.replaceWith(img); }
nodes.forEach(node => {
if(node.nodeType === Node.TEXT_NODE) {
if(/[\[.*\]]/.test(node.nodeValue)) {
node.nodeValue = node.nodeValue.replace(/\[.*\]/, '');
}
if(node.nodeValue.trim().length && !/\[.*\]/.test(node.nodeValue)) {
linkParent.querySelector('*').style.flexBasis = '50%';
linkParent.style.display = 'flex';
linkParent.style.alignItems = 'center';
linkParent.style.gap = '15px';
}
}
});
}
else if(videoExtRegExp.test(link.href)) {
const videoExt = link.href.match(videoExtRegExp)[1];
const autoplay = link.target === "_blank" ? "autoplay loop muted" : "";
const videoTag = `
`;
link.insertAdjacentHTML('afterend', videoTag);
link.remove();
columnize();
}
else if(youtubevimeoRegExp.test(link.href)) {
const iframeTag = ``;
link.insertAdjacentHTML('afterend', iframeTag);
link.remove();
columnize();
}
});
item.querySelectorAll('p:empty').forEach(p => p.remove());
Array.from(document.querySelectorAll('p'))
.filter(p => p.querySelectorAll('img').length >= 2)
.forEach(p => {
p.style.display="flex";
p.style.flexWrap="wrap";
p.style.gap = '20px';
p.querySelectorAll('img')
.forEach(img => {
img.style.maxWidth = 1;
})
});
});
-
test
-
Description text goes here
-
Description text goes here
-
Description text goes here
-
Description text goes here
-
Description text goes here
-
Description text goes here
-
Description text goes here
-
Description text goes here