Skip to content

Update template to version 1.60.0 #53

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
timjore wants to merge 9 commits into
base: main
Choose a base branch
from
Open

Update template to version 1.60.0 #53

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
d986181
Update files
timjore Feb 24, 2024
bfc954a
Update files
timjore Feb 24, 2024
ab1bbdd
Update files
timjore Feb 24, 2024
a2eabe8
Update files
timjore Feb 24, 2024
00d89e8
Update files
timjore Feb 24, 2024
9b40c7b
Update files
timjore Feb 24, 2024
687b2a0
Update files
timjore Feb 24, 2024
2d721d8
Update files
timjore Feb 24, 2024
fd93e23
Update files
timjore Feb 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
202 changes: 129 additions & 73 deletions .eleventy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,68 @@ function transformImage(src, cls, alt, sizes, widths = ["500", "700", "auto"]) {
return metadata;
}

function getAnchorLink(filePath, linkTitle) {
const {attributes, innerHTML} = getAnchorAttributes(filePath, linkTitle);
return `<a ${Object.keys(attributes).map(key => `${key}="${attributes[key]}"`).join(" ")}>${innerHTML}</a>`;
}

function getAnchorAttributes(filePath, linkTitle) {
let fileName = filePath.replaceAll("&amp;", "&");
let header = "";
let headerLinkPath = "";
if (filePath.includes("#")) {
[fileName, header] = filePath.split("#");
headerLinkPath = `#${headerToId(header)}`;
}

let noteIcon = process.env.NOTE_ICON_DEFAULT;
const title = linkTitle ? linkTitle : fileName;
let permalink = `/notes/${slugify(filePath)}`;
let deadLink = false;
try {
const startPath = "./src/site/notes/";
const fullPath = fileName.endsWith(".md")
? `${startPath}${fileName}`
: `${startPath}${fileName}.md`;
const file = fs.readFileSync(fullPath, "utf8");
const frontMatter = matter(file);
if (frontMatter.data.permalink) {
permalink = frontMatter.data.permalink;
}
if (
frontMatter.data.tags &&
frontMatter.data.tags.indexOf("gardenEntry") != -1
) {
permalink = "/";
}
if (frontMatter.data.noteIcon) {
noteIcon = frontMatter.data.noteIcon;
}
} catch {
deadLink = true;
}

if (deadLink) {
return {
attributes: {
"class": "internal-link is-unresolved",
"href": "/404",
"target": "",
},
innerHTML: title,
}
}
return {
attributes: {
"class": "internal-link",
"target": "",
"data-note-icon": noteIcon,
"href": `${permalink}${headerLinkPath}`,
},
innerHTML: title,
}
}

const tagRegex = /(^|\s|\>)(#[^\s!@#$%^&*()=+\.,\[{\]};:'"?><]+)(?!([^<]*>))/g;

module.exports = function (eleventyConfig) {
Expand Down Expand Up @@ -99,25 +161,25 @@ module.exports = function (eleventyConfig) {
let icon;
let color;
let nbLinesToSkip = 0
for (let i = 0; i<4; i++) {
for (let i = 0; i < 4; i++) {
if (parts[i] && parts[i].trim()) {
let line = parts[i] && parts[i].trim().toLowerCase()
if (line.startsWith("title:")) {
titleLine = line.substring(6);
nbLinesToSkip ++;
nbLinesToSkip++;
} else if (line.startsWith("icon:")) {
icon = line.substring(5);
nbLinesToSkip ++;
nbLinesToSkip++;
} else if (line.startsWith("collapse:")) {
collapsible = true
collapse = line.substring(9);
if (collapse && collapse.trim().toLowerCase() == 'open') {
collapsed = false
}
nbLinesToSkip ++;
nbLinesToSkip++;
} else if (line.startsWith("color:")) {
color = line.substring(6);
nbLinesToSkip ++;
nbLinesToSkip++;
}
}
}
Expand All @@ -127,18 +189,17 @@ module.exports = function (eleventyConfig) {
</svg>
</div>` : "";
const titleDiv = titleLine
? `<div class="callout-title"><div class="callout-title-inner">${titleLine}</div>${foldDiv}</div>`
: "";
? `<div class="callout-title"><div class="callout-title-inner">${titleLine}</div>${foldDiv}</div>`
: "";
let collapseClasses = titleLine && collapsible ? 'is-collapsible' : ''
if (collapsible && collapsed) {
collapseClasses += " is-collapsed"
}

let res = `<div data-callout-metadata class="callout ${collapseClasses}" data-callout="${
token.info.substring(3)
}">${titleDiv}\n<div class="callout-content">${md.render(
parts.slice(nbLinesToSkip).join("\n")
)}</div></div>`;
let res = `<div data-callout-metadata class="callout ${collapseClasses}" data-callout="${token.info.substring(3)
}">${titleDiv}\n<div class="callout-content">${md.render(
parts.slice(nbLinesToSkip).join("\n")
)}</div></div>`;
return res
}

Expand All @@ -153,7 +214,21 @@ module.exports = function (eleventyConfig) {
};
md.renderer.rules.image = (tokens, idx, options, env, self) => {
const imageName = tokens[idx].content;
const [fileName, width] = imageName.split("|");
//"image.png|metadata?|width"
const [fileName, ...widthAndMetaData] = imageName.split("|");
const lastValue = widthAndMetaData[widthAndMetaData.length - 1];
const lastValueIsNumber = !isNaN(lastValue);
const width = lastValueIsNumber ? lastValue : null;

let metaData = "";
if (widthAndMetaData.length > 1) {
metaData = widthAndMetaData.slice(0, widthAndMetaData.length - 1).join(" ");
}

if (!lastValueIsNumber) {
metaData += ` ${lastValue}`;
}

if (width) {
const widthIndex = tokens[idx].attrIndex("width");
const widthAttr = `${width}px`;
Expand Down Expand Up @@ -199,7 +274,6 @@ module.exports = function (eleventyConfig) {
return date && date.toISOString();
});


eleventyConfig.addFilter("link", function (str) {
return (
str &&
Expand All @@ -210,46 +284,7 @@ module.exports = function (eleventyConfig) {
}
const [fileLink, linkTitle] = p1.split("|");

let fileName = fileLink.replaceAll("&amp;", "&");
let header = "";
let headerLinkPath = "";
if (fileLink.includes("#")) {
[fileName, header] = fileLink.split("#");
headerLinkPath = `#${headerToId(header)}`;
}

let permalink = `/notes/${slugify(fileName)}`;
let noteIcon = process.env.NOTE_ICON_DEFAULT;
const title = linkTitle ? linkTitle : fileName;
let deadLink = false;

try {
const startPath = "./src/site/notes/";
const fullPath = fileName.endsWith(".md")
? `${startPath}${fileName}`
: `${startPath}${fileName}.md`;
const file = fs.readFileSync(fullPath, "utf8");
const frontMatter = matter(file);
if (frontMatter.data.permalink) {
permalink = frontMatter.data.permalink;
}
if (
frontMatter.data.tags &&
frontMatter.data.tags.indexOf("gardenEntry") != -1
) {
permalink = "/";
}
if (frontMatter.data.noteIcon) {
noteIcon = frontMatter.data.noteIcon;
}
} catch {
deadLink = true;
}

if(deadLink){
return `<a class="internal-link is-unresolved" href="/404">${title}</a>`;
}
return `<a class="internal-link" data-note-icon="${noteIcon}" href="${permalink}${headerLinkPath}">${title}</a>`;
return getAnchorLink(fileLink, linkTitle);
})
);
});
Expand Down Expand Up @@ -289,6 +324,21 @@ module.exports = function (eleventyConfig) {
);
});

eleventyConfig.addTransform("dataview-js-links", function (str) {
const parsed = parse(str);
for (const dataViewJsLink of parsed.querySelectorAll("a[data-href].internal-link")) {
const notePath = dataViewJsLink.getAttribute("data-href");
const title = dataViewJsLink.innerHTML;
const {attributes, innerHTML} = getAnchorAttributes(notePath, title);
for (const key in attributes) {
dataViewJsLink.setAttribute(key, attributes[key]);
}
dataViewJsLink.innerHTML = innerHTML;
}

return str && parsed.innerHTML;
});

eleventyConfig.addTransform("callout-block", function (str) {
const parsed = parse(str);

Expand All @@ -302,28 +352,30 @@ module.exports = function (eleventyConfig) {

let titleDiv = "";
let calloutType = "";
let calloutMetaData = "";
let isCollapsable;
let isCollapsed;
const calloutMeta = /\[!([\w-]*)\](\+|\-){0,1}(\s?.*)/;
const calloutMeta = /\[!([\w-]*)\|?(\s?.*)\](\+|\-){0,1}(\s?.*)/;
if (!content.match(calloutMeta)) {
continue;
}

content = content.replace(
calloutMeta,
function (metaInfoMatch, callout, collapse, title) {
function (metaInfoMatch, callout, metaData, collapse, title) {
isCollapsable = Boolean(collapse);
isCollapsed = collapse === "-";
const titleText = title.replace(/(<\/{0,1}\w+>)/, "")
? title
: `${callout.charAt(0).toUpperCase()}${callout
.substring(1)
.toLowerCase()}`;
.substring(1)
.toLowerCase()}`;
const fold = isCollapsable
? `<div class="callout-fold"><i icon-name="chevron-down"></i></div>`
: ``;

calloutType = callout;
calloutMetaData = metaData;
titleDiv = `<div class="callout-title"><div class="callout-title-inner">${titleText}</div>${fold}</div>`;
return "";
}
Expand All @@ -334,6 +386,7 @@ module.exports = function (eleventyConfig) {
blockquote.classList.add(isCollapsable ? "is-collapsible" : "");
blockquote.classList.add(isCollapsed ? "is-collapsed" : "");
blockquote.setAttribute("data-callout", calloutType.toLowerCase());
calloutMetaData && blockquote.setAttribute("data-callout-metadata", calloutMetaData);
blockquote.innerHTML = `${titleDiv}\n<div class="callout-content">${content}</div>`;
}
};
Expand All @@ -344,8 +397,8 @@ module.exports = function (eleventyConfig) {
});

function fillPictureSourceSets(src, cls, alt, meta, width, imageTag) {
imageTag.tagName = "picture";
let html = `<source
imageTag.tagName = "picture";
let html = `<source
media="(max-width:480px)"
srcset="${meta.webp[0].url}"
type="image/webp"
Expand All @@ -355,30 +408,33 @@ module.exports = function (eleventyConfig) {
srcset="${meta.jpeg[0].url}"
/>
`
if (meta.webp && meta.webp[1] && meta.webp[1].url) {
html += `<source
if (meta.webp && meta.webp[1] && meta.webp[1].url) {
html += `<source
media="(max-width:1920px)"
srcset="${meta.webp[1].url}"
type="image/webp"
/>`
}
if (meta.jpeg && meta.jpeg[1] && meta.jpeg[1].url) {
html += `<source
}
if (meta.jpeg && meta.jpeg[1] && meta.jpeg[1].url) {
html += `<source
media="(max-width:1920px)"
srcset="${meta.jpeg[1].url}"
/>`
}
html += `<img
}
html += `<img
class="${cls.toString()}"
src="${src}"
alt="${alt}"
width="${width}"
/>`;
imageTag.innerHTML = html;
}
imageTag.innerHTML = html;
}


eleventyConfig.addTransform("picture", function (str) {
if(process.env.USE_FULL_RESOLUTION_IMAGES === "true"){
return str;
}
const parsed = parse(str);
for (const imageTag of parsed.querySelectorAll(".cm-s-obsidian img")) {
const src = imageTag.getAttribute("src");
Expand Down Expand Up @@ -458,7 +514,7 @@ module.exports = function (eleventyConfig) {
ul: true,
tags: ["h1", "h2", "h3", "h4", "h5", "h6"],
});


eleventyConfig.addFilter("dateToZulu", function (date) {
if (!date) return "";
Expand All @@ -477,7 +533,7 @@ module.exports = function (eleventyConfig) {
return variable;
});

eleventyConfig.addPlugin(pluginRss, {
eleventyConfig.addPlugin(pluginRss, {
posthtmlRenderOptions: {
closingSingleTag: "slash",
singleTags: ["link"],
Expand All @@ -494,7 +550,7 @@ module.exports = function (eleventyConfig) {
},
templateFormats: ["njk", "md", "11ty.js"],
htmlTemplateEngine: "njk",
markdownTemplateEngine: "njk",
markdownTemplateEngine: false,
passthroughFileCopy: true,
};
};
Loading