${markdownContent}
`;
- });
-
- // Documentation alert boxes
- eleventyConfig.addPairedLiquidShortcode('note', function (content, title = '') {
- return renderDocsAlertBox(content, 'note', "Note")
- })
-
- eleventyConfig.addPairedLiquidShortcode('warning', function (content, title = '') {
- return renderDocsAlertBox(content, 'warning', "Warning")
- })
-
- eleventyConfig.addPairedLiquidShortcode('critical', function (content, title = '') {
- return renderDocsAlertBox(content, 'critical', "Critical")
- })
-
-
- let flowId = 0; // Keep a global counter to allow more than one
- eleventyConfig.addPairedShortcode("renderFlow", function (flow, height = 200) {
- flowId++; // Increment the flowId to allow multiple flows on the same page
-
- return `
- `
- });
-
- eleventyConfig.addGlobalData("coreNodesArray", () => {
- // Read the JSON file with core nodes
- const coreNodes = JSON.parse(fs.readFileSync(path.join(__dirname, 'src', '_data', 'coreNodes.json'), 'utf-8'));
-
- // Transform coreNodes object into an array
- return Object.entries(coreNodes).map(([key, nodes]) => ({ key, nodes }));
- })
-
- eleventyConfig.addAsyncShortcode("coreNodeDoc", async function (category, node) {
- return await coreNodeDoc(category, node)
- });
-
- eleventyConfig.addFilter("filterNodeCategory", function(nodes, category) {
- if (category === "all") {
- return nodes;
- } else {
- return nodes.filter(node => node.tags.includes(category));
- }
- });
-
- // Custom filters
- eleventyConfig.addFilter("json", (content) => {
- return JSON.stringify(content)
- });
-
- eleventyConfig.addFilter("fromJson", (content) => {
- try {
- return JSON.parse(content);
- } catch (e) {
- console.error("Error parsing JSON:", e);
- return content;
- }
- });
-
- eleventyConfig.addFilter("head", (array, n) => {
- if( n < 0 ) {
- return array.slice(n);
- }
- return array.slice(0, n);
- });
-
- eleventyConfig.addFilter("limit", (arr, limit) => arr.slice(0, limit ));
-
- eleventyConfig.addFilter('console', function (value) {
- const str = util.inspect(value, { showHidden: false, depth: null });
- return `${unescape(str)}
;`
- });
-
-
- eleventyConfig.addFilter('dictsortBy', function(val, reverse, attr) {
- let array = [];
- for (let k in val) {
- // Preserve the key (slug) by adding it to the object
- array.push({...val[k], _key: k});
- }
-
- array.sort((t1, t2) => {
- var a = t1[attr];
- var b = t2[attr];
-
- return a > b ? 1 : (a === b ? 0 : -1); // eslint-disable-line no-nested-ternary
- });
-
- return array
- });
-
- eleventyConfig.addFilter('shortDate', dateObj => {
- return spacetime(new Date(dateObj)).format('{date} {month-short}, {year}')
- });
-
- // Filter to safely convert values to Date objects
- eleventyConfig.addFilter('toDate', value => {
- if (!value) return new Date();
- if (value instanceof Date) return value;
- return new Date(value);
- });
-
- eleventyConfig.addFilter('formatNumber', num => {
- if (num === undefined || num === null) return '0';
- return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
- });
-
- eleventyConfig.addFilter('md', (content) => {
- if (!content) return '';
- const md = new markdownIt({
- html: true,
- })
- .use(markdownItAnchor, {
- permalink: markdownItAnchor.permalink.headerLink()
- });
- return md.render(content);
- });
-
- eleventyConfig.addFilter('stripFirstH1', (str) => {
- if (!str) return str;
-
- // Remove the first h1 heading from the content to avoid duplicate h1 tags
- // This is typically the package name which is already shown in the page header
- return str.replace(/"+content.split(/\.\n/).join(".
")+"
" - }); - - eleventyConfig.addFilter("toAbsoluteUrl", function(url) { - return new URL(url, site.baseURL).href; - }) - - eleventyConfig.addFilter("handbookBreadcrumbs", (url) => { - let parts = url.split("/").filter(e => e !== ''); - if (parts[parts.length-1] === "index") { - parts.pop(); - } - - let path = ""; - return "/"+parts.map(p => { - let url = `${path}/${p}`; - path = url; - return `${p}` - }).join("/") - }); - - eleventyConfig.addFilter("rewriteHandbookLinks", (str, page) => { - // If page.inputPath looks like: ./src/handbook/abc/def.md - // then the url of the page will be `/handbook/abc/def/` - // links of the form `./` or `[^/]` must be prepended with `../` - // to ensure it links to the right place - - const isIndexPage = /(README.md|index.md)$/i.test(page.inputPath) - - const matcher = /((href|src)="([^"]*))"/g - let match - while ((match = matcher.exec(str)) !== null) { - let url = match[3] - if (/^(http|#|mailto:)/.test(url)) { - // Do not rewrite absolute urls, in-page anchors or emails - continue - } - // */abc.md#anchor => */abc/#anchor - url = url.replace(/.md(#.*)?$/, '$1') - // */README#anchor => */#anchor - url = url.replace(/README(#.*)?$/, '$1') - if (url[0] !== '/' && !isIndexPage) { - url = '../'+url - } - - str = str.substring(0, match.index) + `${match[2]}="${url}"` + str.substring(match.index+match[1].length) - } - return str; - }) - - eleventyConfig.addFilter("handbookEditLink", (page) => { - let baseUrl = 'https://github.com/FlowFuse/website/edit/main/' - let filePath = page.inputPath - - if (/^\/docs/.test(page.url)) { - pathElements = page.inputPath.split(path.sep) - - if (pathElements[pathElements.length - 1] === "index.md") { - pathElements[pathElements.length - 1] = "README.md" - } - - filePath = path.join(...pathElements.slice(2)) - baseUrl = 'https://github.com/FlowFuse/flowfuse/edit/main/' - } - - return baseUrl+filePath.replace(/^.\//,'') - }) - - eleventyConfig.addFilter("pageOwners", (page) => { - // Eleventy's inputPath is relative, we need to drop the './' in front - return new codeowners().getOwner(page.inputPath.substring(2)) - }); - - eleventyConfig.addFilter("ghUsersToTeamMembers", (ghUsers, team) => { - let teamMembers = []; - for (let i = 0; i < ghUsers.length; i++) { - const ghUser = ghUsers[i]; - - Object.keys(team).forEach(function (member) { - if (team[member].github === ghUser.substring(1)) { - teamMembers.push(team[member]) - } - }) - } - - return teamMembers - }); - - eleventyConfig.addFilter("relatedPosts", function (collection = []) { - const { tags: requiredTags, page } = this.ctx; - return collection - .map(post => { - const commonTags = requiredTags?.reduce((count, tag) => count + (post.data.tags?.includes(tag) ? 1 : 0), 0); - return { ...post, commonTags }; - }) - .filter(post => post.url !== page.url && post.commonTags >= requiredTags.length - 1) - .sort((a, b) => b.commonTags - a.commonTags || b.date - a.date) - .slice(0, 5); - }); - - // Custom async filters - eleventyConfig.addNunjucksAsyncFilter("jsmin", async function (code, callback) { - try { - const minified = await minify(code); - callback(null, minified.code); - } catch (err) { - console.error("Terser error: ", err); - // Fail gracefully. - callback(null, code); - } - }); - - eleventyConfig.addShortcode("renderTeamMember", function (teamMember) { - // When the author is no longer at FlowFuse - if (typeof teamMember === "undefined" || teamMember === null) { - return `
-
-
`
- }
-
- return `
-
-
-
-
-
`
- });
-
- eleventyConfig.addShortcode("renderCompanyTile", function (company) {
- return `
-
- ${teamMember.title}
-
-
- 
- ${company.name}
-
`
- });
-
- eleventyConfig.addShortcode("renderIntegration", function (integration) {
- return `
- 
-
-
`
- });
-
- eleventyConfig.addShortcode("year", () => `${new Date().getFullYear()}`);
-
- // Feature catalog helpers for tier badges
- const featureCatalog = yaml.load(fs.readFileSync("./src/_data/featureCatalog.yaml", "utf8"));
-
- function changelogTitle(url) {
- const slug = url.replace(/\/$/, '').split('/').pop();
- const parts = url.replace(/\/$/, '').split('/').filter(Boolean);
- // url: /changelog/2026/02/slug/ -> src/changelog/2026/02/slug.md
- const filePath = path.join("./src", parts.join('/') + '.md');
- try {
- const content = fs.readFileSync(filePath, 'utf8');
- const match = content.match(/^---[\s\S]*?title:\s*["']?(.+?)["']?\s*$/m);
- if (match) return match[1];
- } catch (e) { /* file not found, fall back */ }
- return slug.replace(/-/g, ' ').replace(/\b\w/g, c => c.toUpperCase());
- }
-
- function findFeatureById(id) {
- for (const section of featureCatalog.sections) {
- for (const feature of section.features) {
- if (feature.id === id) return feature;
- }
- }
- return null;
- }
-
- function getChangelogUrls(feature) {
- if (!feature.changelog) return [];
- const entries = Array.isArray(feature.changelog) ? feature.changelog : [feature.changelog];
- return entries.map(entry => typeof entry === 'string' ? entry : entry.url);
- }
-
- function getChangelogUrlsForRelease(feature, release) {
- if (!feature.changelog) return [];
- const entries = Array.isArray(feature.changelog) ? feature.changelog : [feature.changelog];
- return entries
- .filter(entry => typeof entry === 'object' && entry.release === release)
- .map(entry => entry.url);
- }
-
- function findFeatureByChangelog(changelogUrl) {
- const normalized = changelogUrl.replace(/\/$/, '') + '/';
- for (const section of featureCatalog.sections) {
- for (const feature of section.features) {
- const urls = getChangelogUrls(feature);
- for (const url of urls) {
- if ((url.replace(/\/$/, '') + '/') === normalized) return feature;
- }
- }
- }
- return null;
- }
-
- function deriveTierLabel(tierData) {
- if (!tierData) return null;
- const starter = tierData.starter && tierData.starter.value;
- const pro = tierData.pro && tierData.pro.value;
- const enterprise = tierData.enterprise && tierData.enterprise.value;
- const enterpriseDimmed = tierData.enterprise && tierData.enterprise.dimmed;
- if (starter && pro && enterprise && !enterpriseDimmed) return "All tiers";
- if (pro && enterprise && !enterpriseDimmed) return "Pro+";
- if (enterprise === 'contact' || (typeof enterprise === 'string' && enterprise.toLowerCase().includes('contact'))) return "Enterprise (on request)";
- if (enterpriseDimmed) return "Enterprise (on request)";
- if (enterprise) return "Enterprise";
- return "Not available";
- }
-
- function renderTierBadges(feature) {
- if (!feature) return '';
- const cloudLabel = deriveTierLabel(feature.cloud);
- const selfHostedLabel = deriveTierLabel(feature.selfHosted);
- const showCloud = cloudLabel && cloudLabel !== 'Not available';
- const showSelfHosted = selfHostedLabel && selfHostedLabel !== 'Not available';
- if (!showCloud && !showSelfHosted) return '';
- let html = ``;
- if (showCloud) {
- html += `
';
- return html;
- }
-
- function renderChangelogLinks(urls) {
- if (!urls || urls.length === 0) return '';
- let html = '';
- return html;
- }
-
- // Inject tier badges and changelog links into release blog posts based on frontmatter
- eleventyConfig.addTransform("releaseFeatures", function(content) {
- if (!this.page.outputPath || !this.page.outputPath.endsWith(".html")) return content;
-
- // Transforms don't have access to template data, so parse frontmatter from source
- const inputPath = this.page.inputPath;
- if (!inputPath || !inputPath.endsWith('.md')) return content;
-
- let frontmatter;
- try {
- const source = fs.readFileSync(inputPath, 'utf8');
- const fmMatch = source.match(/^---\n([\s\S]*?)\n---/);
- if (!fmMatch) return content;
- frontmatter = yaml.load(fmMatch[1]);
- } catch (e) { return content; }
-
- const features = frontmatter.features;
- const release = frontmatter.release;
- if (!release || !features || !Array.isArray(features) || features.length === 0) return content;
-
- // Build injection map: heading text -> { badges HTML, changelogs HTML }
- const injections = [];
- for (const entry of features) {
- let badges = '';
- let changelogs = '';
-
- if (entry.id) {
- // Feature from featureCatalog
- const feature = findFeatureById(entry.id);
- if (!feature) continue;
- badges = renderTierBadges(feature);
- const changelogUrls = release ? getChangelogUrlsForRelease(feature, release) : getChangelogUrls(feature);
- changelogs = renderChangelogLinks(changelogUrls);
- } else if (entry.tiers) {
- // Inline tier specification (no feature ID)
- const inlineFeature = {};
- if (entry.tiers.cloud) {
- // Convert shorthand ("all", "pro+", "enterprise") to tier structure
- const t = entry.tiers.cloud;
- inlineFeature.cloud = {
- starter: { value: t === 'all' ? true : null },
- pro: { value: (t === 'all' || t === 'pro+') ? true : null },
- enterprise: { value: true }
- };
- }
- if (entry.tiers.selfHosted) {
- const t = entry.tiers.selfHosted;
- inlineFeature.selfHosted = {
- starter: { value: t === 'all' ? true : null },
- pro: { value: (t === 'all' || t === 'pro+') ? true : null },
- enterprise: { value: true }
- };
- }
- badges = renderTierBadges(inlineFeature);
- }
-
- if (badges || changelogs) {
- injections.push({ heading: entry.heading, badges, changelogs });
- }
- }
-
- if (injections.length === 0) return content;
-
- // Find all headings (h2-h6) in the HTML with their positions
- const headingRegex = /`;
- html += `Cloud`;
- html += `${cloudLabel}`;
- html += `
`;
- }
- if (showSelfHosted) {
- html += ``;
- html += `Self-Hosted`;
- html += `${selfHostedLabel}`;
- html += `
`;
- }
- html += 'UIBUILDER example: Get and view a Quote of the Day
\nUsing the UIBUILDER IIFE library. No framework used.
\n \n\n \n\n \n \n\nNo quote received yet.\n \n