| 1 |
( function () { |
| 2 |
/* Get current post ID and taxonomy data from body classes or JSON */ |
| 3 |
var bodyEl = document.body; |
| 4 |
var postId = null; |
| 5 |
var bodyClass = bodyEl.className || ''; |
| 6 |
|
| 7 |
/* Try to get postid from body class: "postid-123" */ |
| 8 |
var pidMatch = bodyClass.match(/postid-(\d+)/); |
| 9 |
if ( pidMatch ) postId = parseInt( pidMatch[1], 10 ); |
| 10 |
|
| 11 |
document.querySelectorAll( '.bkrp-wrap' ).forEach( function ( wrap ) { |
| 12 |
var grid = wrap.querySelector( '.bkrp-grid' ); |
| 13 |
if ( !grid || !postId ) return; |
| 14 |
|
| 15 |
var relation = wrap.dataset.relation || 'category'; |
| 16 |
var count = parseInt( wrap.dataset.count, 10 ) || 3; |
| 17 |
var showImage = wrap.dataset.showImage === '1'; |
| 18 |
var showExcerpt = wrap.dataset.showExcerpt === '1'; |
| 19 |
var showDate = wrap.dataset.showDate === '1'; |
| 20 |
var imageRatio = wrap.dataset.imageRatio || '16/9'; |
| 21 |
|
| 22 |
/* First get current post's terms */ |
| 23 |
var postUrl = '/wp-json/wp/v2/posts/' + postId; |
| 24 |
fetch( postUrl ) |
| 25 |
.then( function (r) { return r.json(); } ) |
| 26 |
.then( function ( post ) { |
| 27 |
var cats = post.categories || []; |
| 28 |
var tags = post.tags || []; |
| 29 |
var param = ''; |
| 30 |
if ( relation === 'category' && cats.length ) { |
| 31 |
param = '&categories=' + cats.join(','); |
| 32 |
} else if ( relation === 'tag' && tags.length ) { |
| 33 |
param = '&tags=' + tags.join(','); |
| 34 |
} else { |
| 35 |
if ( cats.length ) param += '&categories=' + cats.join(','); |
| 36 |
if ( tags.length ) param += '&tags=' + tags.join(','); |
| 37 |
} |
| 38 |
return fetch( '/wp-json/wp/v2/posts?per_page=' + ( count + 1 ) + '&_embed&exclude=' + postId + param ); |
| 39 |
} ) |
| 40 |
.then( function (r) { return r.json(); } ) |
| 41 |
.then( function ( posts ) { |
| 42 |
if ( !posts || !posts.length ) { grid.innerHTML = '<p style="color:#9ca3af;font-size:.9em">No related posts found.</p>'; return; } |
| 43 |
posts = posts.slice( 0, count ); |
| 44 |
grid.classList.remove( 'bkrp-loading' ); |
| 45 |
grid.innerHTML = ''; |
| 46 |
posts.forEach( function ( post ) { |
| 47 |
var thumb = post._embedded && post._embedded['wp:featuredmedia'] && post._embedded['wp:featuredmedia'][0]; |
| 48 |
var thumbUrl = thumb && thumb.source_url ? thumb.source_url : ''; |
| 49 |
var date = post.date ? new Date( post.date ).toLocaleDateString() : ''; |
| 50 |
var excerpt = post.excerpt && post.excerpt.rendered ? post.excerpt.rendered.replace(/<[^>]+>/g,'') : ''; |
| 51 |
excerpt = excerpt.length > 100 ? excerpt.slice(0,100) + '…' : excerpt; |
| 52 |
|
| 53 |
var a = document.createElement( 'a' ); |
| 54 |
a.className = 'bkrp-card'; |
| 55 |
a.href = post.link; |
| 56 |
var html = ''; |
| 57 |
if ( showImage ) { |
| 58 |
html += '<div class="bkrp-img-wrap" style="aspect-ratio:' + imageRatio + '">' + |
| 59 |
( thumbUrl ? '<img src="' + thumbUrl + '" alt="' + post.title.rendered + '" loading="lazy" />' : '' ) + |
| 60 |
'</div>'; |
| 61 |
} |
| 62 |
html += '<div class="bkrp-body">'; |
| 63 |
if ( showDate ) html += '<div class="bkrp-date">' + date + '</div>'; |
| 64 |
html += '<div class="bkrp-title">' + post.title.rendered + '</div>'; |
| 65 |
if ( showExcerpt && excerpt ) html += '<p class="bkrp-excerpt">' + excerpt + '</p>'; |
| 66 |
html += '</div>'; |
| 67 |
a.innerHTML = html; |
| 68 |
grid.appendChild( a ); |
| 69 |
} ); |
| 70 |
} ) |
| 71 |
.catch( function () { |
| 72 |
grid.innerHTML = '<p style="color:#9ca3af;font-size:.9em">Unable to load related posts.</p>'; |
| 73 |
} ); |
| 74 |
} ); |
| 75 |
} )(); |
| 76 |
|
