github-mirror/framework
github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-04-25 14:14:03 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add lazy loading attribute to twemoji rendered images & autocomplete (#31)

Browse Source
This commit is contained in:
David Sevilla Martín 2020-10-15 18:50:00 -04:00 committed by GitHub
parent 1b08d47f6e
commit 97c89bcc42
2 changed files with 10 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
extensions/emoji/js/src/forum/addComposerAutocomplete.js
View File

@ -77,7 +77,7 @@ export default function addComposerAutocomplete() {
onmouseenter={function() {
dropdown.setIndex($(this).parent().index() - 1);
}}>
<img alt={emoji} class="emoji" draggable="false" src={`${cdn}72x72/${code}.png`}/>
<img alt={emoji} class="emoji" draggable="false" loading="lazy" src={`${cdn}72x72/${code}.png`}/>
{name}
</button>
);

11
extensions/emoji/js/src/forum/renderEmoji.js
View File

@ -7,12 +7,19 @@ import Post from 'flarum/models/Post';
import base from './cdn';
const options = {
base,
attributes: () => ({
loading: 'lazy',
}),
};
export default function renderEmoji() {
override(Post.prototype, 'contentHtml', function(original) {
const contentHtml = original();
if (this.oldContentHtml !== contentHtml) {
this.emojifiedContentHtml = twemoji.parse(contentHtml, { base });
this.emojifiedContentHtml = twemoji.parse(contentHtml, options);
this.oldContentHtml = contentHtml;
}
@ -22,6 +29,6 @@ export default function renderEmoji() {
override(s9e.TextFormatter, 'preview', (original, text, element) => {
original(text, element);
twemoji.parse(element, { base });
twemoji.parse(element, options);
});
}