diff --git a/CHANGELOG.md b/CHANGELOG.md index e0ff859..4822c24 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Add `config.extra.show_backlinks` config variable for showing the backlinks button for linked articles in the article's quick actions. - Add `fediverse:creator` meta tag. - Add `title` class for use on ``. +- Add back support for lazy async images in comments. - Add missing translation strings for author separator and conjunctions. - Add shortcode for Mastodon post embedding. - Add support for blurred media in comments. diff --git a/static/comments.js b/static/comments.js index ead46c6..5491d2c 100644 --- a/static/comments.js +++ b/static/comments.js @@ -7,6 +7,7 @@ let dateLocale = document.getElementById("date-locale").textContent; let favesFromText = document.getElementById("faves-from-text").textContent; let host = document.getElementById("host").textContent; let id = document.getElementById("id").textContent; +let lazyAsyncImage = document.getElementById("lazy-async-image").textContent; let loadingText = document.getElementById("loading-text").textContent; let noCommentsText = document.getElementById("no-comments-text").textContent; let relAttributes = document.getElementById("rel-attributes").textContent; @@ -41,10 +42,10 @@ function emojify(input, emojis) { img.setAttribute("src", escapeHtml(emoji.static_url)); img.setAttribute("alt", `:${emoji.shortcode}:`); img.setAttribute("title", `:${emoji.shortcode}:`); - // {% - if config.markdown.lazy_async_image -%} - // img.setAttribute("decoding", "async"); - // img.setAttribute("loading", "lazy"); - // {% - endif -%} + if (lazyAsyncImage == "true") { + img.setAttribute("decoding", "async"); + img.setAttribute("loading", "lazy"); + } picture.appendChild(source); picture.appendChild(img); @@ -132,10 +133,10 @@ function loadComments() { "alt", `@${status.account.username}@${instance} avatar` ); - // {% - if config.markdown.lazy_async_image -%} - // avatarImg.setAttribute("decoding", "async"); - // avatarImg.setAttribute("loading", "lazy"); - // {% - endif -%} + if (lazyAsyncImage == "true") { + avatarImg.setAttribute("decoding", "async"); + avatarImg.setAttribute("loading", "lazy"); + } let avatarPicture = document.createElement("picture"); avatarPicture.appendChild(avatarSource); @@ -235,10 +236,10 @@ function loadComments() { mediaElement.setAttribute("title", attachment.description); } - // {% - if config.markdown.lazy_async_image -%} - // mediaElement.setAttribute("decoding", "async"); - // mediaElement.setAttribute("loading", "lazy"); - // {% - endif -%} + if (lazyAsyncImage == "true") { + mediaElement.setAttribute("decoding", "async"); + mediaElement.setAttribute("loading", "lazy"); + } if (status.sensitive == true) { mediaElement.classList.add("spoiler"); diff --git a/templates/partials/comments.html b/templates/partials/comments.html index f5fe600..46db72d 100644 --- a/templates/partials/comments.html +++ b/templates/partials/comments.html @@ -29,10 +29,11 @@ -{%- if page.extra.comments.uri -%} - {%- set uri = page.extra.comments.uri -%} - -{%- endif -%} +{%- if config.markdown.lazy_async_image %} + +{%- else -%} + +{%- endif %}
{%- if config.extra.comments.show_qr -%}