diff --git a/.eleventy.js b/.eleventy.js index 53d820b8..b1809889 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -53,13 +53,6 @@ module.exports = function (eleventyConfig) { eleventyConfig.ignores.add("src/nl/vereniging/bestuur/notulen"); } - // Custom date filter - eleventyConfig.addFilter("localizedDate", function (dateObj, locale = "en") { - return DateTime.fromJSDate(dateObj) - .setLocale(locale) - .toFormat("d LLLL yyyy"); - }); - /* Add id to heading elements */ eleventyConfig.addPlugin(pluginAddIdToHeadings); @@ -185,111 +178,65 @@ module.exports = function (eleventyConfig) { }) ); - - eleventyConfig.addFilter("readablePostDate", (dateObj) => { - return DateTime.fromJSDate(dateObj, { - zone: "Europe/Amsterdam", - }).setLocale('en').toLocaleString(DateTime.DATE_FULL); - }); - - eleventyConfig.addFilter("postDate", (dateObj) => { - return DateTime.fromJSDate(dateObj, { - zone: "Europe/Amsterdam", - }).setLocale('en').toISODate(); - }); - - eleventyConfig.addFilter('splitlines', function (input) { - const parts = input.split(' '); - const lines = parts.reduce(function (prev, current) { - - if (!prev.length) { - return [current]; - } - - let lastOne = prev[prev.length - 1]; - - if (lastOne.length + current.length > 23) { - return [...prev, current]; - } - - prev[prev.length - 1] = lastOne + ' ' + current; - - return prev; - }, []); - - return lines; - }); - - eleventyConfig.on('afterBuild', async () => { - async function convertSvgToJpeg(inputDir, outputDir) { - const browser = await puppeteer.launch(); - const page = await browser.newPage(); - - // Read all files in the input directory - const files = fs.readdirSync(inputDir); - - for (const filename of files) { - if (filename.endsWith(".svg")) { - const inputPath = path.join(inputDir, filename); - const outputPath = path.join(outputDir, filename.replace('.svg', '.jpg')); - - // Read the SVG content - const svgContent = fs.readFileSync(inputPath, 'utf8'); - - // Extract width and height from SVG (Optional: If SVG has explicit size) - const matchWidth = svgContent.match(/width="([0-9]+)"/); - const matchHeight = svgContent.match(/height="([0-9]+)"/); - - const width = matchWidth ? parseInt(matchWidth[1], 10) : 1200; // Default to 1200px - const height = matchHeight ? parseInt(matchHeight[1], 10) : 675; // Default to 630px - - // Set the viewport size to match SVG size - await page.setViewport({ width, height }); - - // Set SVG content inside an HTML wrapper - await page.setContent(` - - -
- ${svgContent} -
- - - `); - - // Take a screenshot and save as JPEG - await page.screenshot({ - path: outputPath, - type: 'jpeg', - quality: 100, - clip: { x: 0, y: 0, width, height } // Ensure clipping matches viewport - }); - - console.log(`Converted: ${filename} -> ${outputPath}`); + if (!quick) { + eleventyConfig.on('afterBuild', async () => { + async function convertSvgToJpeg(inputDir, outputDir) { + const browser = await puppeteer.launch(); + const page = await browser.newPage(); + + // Read all files in the input directory + const files = fs.readdirSync(inputDir); + + for (const filename of files) { + if (filename.endsWith(".svg")) { + const inputPath = path.join(inputDir, filename); + const outputPath = path.join(outputDir, filename.replace('.svg', '.jpg')); + + // Read the SVG content + const svgContent = fs.readFileSync(inputPath, 'utf8'); + + // Extract width and height from SVG (Optional: If SVG has explicit size) + const matchWidth = svgContent.match(/width="([0-9]+)"/); + const matchHeight = svgContent.match(/height="([0-9]+)"/); + + const width = matchWidth ? parseInt(matchWidth[1], 10) : 1200; // Default to 1200px + const height = matchHeight ? parseInt(matchHeight[1], 10) : 675; // Default to 630px + + // Set the viewport size to match SVG size + await page.setViewport({ width, height }); + + // Set SVG content inside an HTML wrapper + await page.setContent(` + + +
+ ${svgContent} +
+ + + `); + + // Take a screenshot and save as JPEG + await page.screenshot({ + path: outputPath, + type: 'jpeg', + quality: 100, + clip: { x: 0, y: 0, width, height } // Ensure clipping matches viewport + }); + + console.log(`Converted: ${filename} -> ${outputPath}`); + } } - } - await browser.close(); - } - - // Execute conversion - const inputDir = 'dist/assets/images/social-preview-images/'; - const outputDir = 'dist/assets/images/social-preview-images/'; - await convertSvgToJpeg(inputDir, outputDir); - }); - - // Allows you to debug a json object in eleventy templates data | stringify - eleventyConfig.addFilter("stringify", (data) => { - return JSON.stringify(data, null, "\t"); - }); + await browser.close(); + } - eleventyConfig.addFilter("customSlug", function (value) { - if (!value) return "fallback-title"; // Fallback for empty titles - return slugify(value, { - lower: true, // Convert to lowercase - remove: /[^\w\s-]/g // Remove all non-word characters except spaces and dashes - }).replace(/\s+/g, '-'); // Replace spaces with dashes (extra safety) + // Execute conversion + const inputDir = 'dist/assets/images/social-preview-images/'; + const outputDir = 'dist/assets/images/social-preview-images/'; + await convertSvgToJpeg(inputDir, outputDir); }); + } // https://www.11ty.dev/docs/permalinks/#remove-trailing-slashes // Dropping these normalizes the URls between sitemap.xml and canonical, which is important for indexing. diff --git a/utils/filters.js b/utils/filters.js index 131dc976..4e073e3d 100644 --- a/utils/filters.js +++ b/utils/filters.js @@ -48,4 +48,50 @@ module.exports = { }); }, -}; \ No newline at end of file + readablePostDate(dateObj) { + return DateTime.fromJSDate(dateObj, { + zone: "Europe/Amsterdam", + }).setLocale('en').toLocaleString(DateTime.DATE_FULL); + }, + + postDate(dateObj) { + return DateTime.fromJSDate(dateObj, { + zone: "Europe/Amsterdam", + }).setLocale('en').toISODate(); + }, + + splitlines(input) { + const parts = input.split(' '); + const lines = parts.reduce(function (prev, current) { + if (!prev.length) { + return [current]; + } + + let lastOne = prev[prev.length - 1]; + + if (lastOne.length + current.length > 23) { + return [...prev, current]; + } + + prev[prev.length - 1] = lastOne + ' ' + current; + return prev; + }, []); + + return lines; + }, + + stringify(data) { + return JSON.stringify(data, null, "\t"); + }, + + customSlug(value) { + if (!value) return "fallback-title"; // Fallback for empty titles + return strToSlug(value).replace(/\s+/g, '-'); // Replace spaces with dashes + }, + + localizedDate(dateObj, locale = "en") { + return DateTime.fromJSDate(dateObj) + .setLocale(locale) + .toFormat("d LLLL yyyy"); + } +};