From bad8941384014b5b5326a1a233a1bdbf0438cdfa Mon Sep 17 00:00:00 2001 From: Bryan Stopp Date: Tue, 23 Jan 2024 22:26:27 -0600 Subject: [PATCH] Auto-Select next Article in Teasers (#119) * Make article teasers auto-update to latest published in order. * Lint --- .../blocks/article-teaser/article-teaser.js | 23 ++++++++++--- cigaradvisor/scripts/scripts.js | 33 ++++++++++++++----- 2 files changed, 44 insertions(+), 12 deletions(-) diff --git a/cigaradvisor/blocks/article-teaser/article-teaser.js b/cigaradvisor/blocks/article-teaser/article-teaser.js index 2d606d7d..376196cd 100644 --- a/cigaradvisor/blocks/article-teaser/article-teaser.js +++ b/cigaradvisor/blocks/article-teaser/article-teaser.js @@ -1,5 +1,7 @@ import { createOptimizedPicture } from '../../scripts/aem.js'; -import { fetchPostsInfo, fetchAuthorInfo, fetchCategoryInfo } from '../../scripts/scripts.js'; +import { + fetchPostsInfo, fetchAuthorInfo, fetchCategoryInfo, getPostByIdx, +} from '../../scripts/scripts.js'; function formatDate(originalDateString) { const utcDateString = new Date(originalDateString * 1000); @@ -45,9 +47,22 @@ export function buildArticleTeaser(parentElement, article) { } export default async function decorate(block) { - const filterPath = block.querySelector('a').getAttribute('href'); - block.classList.add('article-teaser'); - const article = await fetchPostsInfo(filterPath); + const filterPath = block.querySelector('a')?.getAttribute('href'); + let article; + if (filterPath) { + article = await fetchPostsInfo(filterPath); + } else if (block.querySelector(':scope > div > div:nth-of-type(2)').textContent.toLowerCase() === 'next') { + block.classList.add('next'); + const idx = document.querySelectorAll('main .article-teaser.block.next').length; + article = await getPostByIdx(idx); + + // Check for a pinned / manually entered teaser + const existing = document.querySelector(`a[href="${article.path}"]`); + if (existing && existing.closest('div.block.article-teaser')) { + existing.closest('div.block.article-teaser').classList.add('next'); + article = await getPostByIdx(idx + 1); + } + } if (!article) { return; } diff --git a/cigaradvisor/scripts/scripts.js b/cigaradvisor/scripts/scripts.js index cfc1b971..a691d7c4 100644 --- a/cigaradvisor/scripts/scripts.js +++ b/cigaradvisor/scripts/scripts.js @@ -192,6 +192,17 @@ export function getRelativePath(path) { } let articleIndexData; +async function loadPosts() { + if (!articleIndexData) { + const resp = await fetch(ARTICLE_INDEX_PATH); + let jsonData = ''; + if (resp.ok) { + jsonData = await resp.json(); + } + articleIndexData = jsonData.data; + } +} + /** * Fetches posts information based on the provided filter value and filter parameter. * @param {string} filterValue - The value to filter the posts by. @@ -201,17 +212,23 @@ let articleIndexData; export async function fetchPostsInfo(filterValue, filterParam = 'path') { let filter = filterValue; filter = getRelativePath(filterValue); - if (!articleIndexData) { - const resp = await fetch(ARTICLE_INDEX_PATH); - let jsonData = ''; - if (resp.ok) { - jsonData = await resp.json(); - } - articleIndexData = jsonData.data; - } + await loadPosts(); return articleIndexData.find((obj) => obj[filterParam] === filter); } +/** + * Fetches a post by a given index, starting at 1. + * @param idx the index + * @return {Promise} + */ +export async function getPostByIdx(idx) { + await loadPosts(); + if (articleIndexData.length >= idx) { + return articleIndexData[idx - 1]; + } + return undefined; +} + let authorIndexData; /** * Retrieves all authors from the server.