use lazyload

This commit is contained in:
cutls 2020-09-17 21:42:04 +09:00
parent 5063061a70
commit ee99a660c2

View File

@ -224,7 +224,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} }
var emoji_url = ` var emoji_url = `
<img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}" <img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}"
alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');"> alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');" loading="lazy">
` `
var regExp = new RegExp(':' + shortcode + ':', 'g') var regExp = new RegExp(':' + shortcode + ':', 'g')
dis_name = dis_name.replace(regExp, emoji_url) dis_name = dis_name.replace(regExp, emoji_url)
@ -241,7 +241,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
noticeavatar = toot.account.avatar_static noticeavatar = toot.account.avatar_static
} }
noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg"> noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg">
<img draggable="false" src="${noticeavatar}" width="20" class="notf-icon prof-img" user="${toot.account.acct}" alt=""> <img draggable="false" src="${noticeavatar}" width="20" class="notf-icon prof-img" user="${toot.account.acct}" alt="" loading="lazy">
</a>` </a>`
if (toot.type == 'mention') { if (toot.type == 'mention') {
var what = lang.lang_parse_mentioned var what = lang.lang_parse_mentioned
@ -379,7 +379,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} }
var emoji_url = ` var emoji_url = `
<img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}" <img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}"
alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');"> alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');" loading="lazy">
` `
var regExp = new RegExp(':' + shortcode + ':', 'g') var regExp = new RegExp(':' + shortcode + ':', 'g')
dis_name = dis_name.replace(regExp, emoji_url) dis_name = dis_name.replace(regExp, emoji_url)
@ -395,7 +395,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} }
noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg" aria-hidden="true"> noticeavatar = `<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg" aria-hidden="true">
<img draggable="false" src="${noticeavatar}" width="20" class="notf-icon prof-img" <img draggable="false" src="${noticeavatar}" width="20" class="notf-icon prof-img"
user="${toot.account.acct}" onerror="this.src=\'../../img/loading.svg\'"> user="${toot.account.acct}" onerror="this.src=\'../../img/loading.svg\'" loading="lazy">
</a>` </a>`
var rebtxt = lang.lang_parse_btedsimple var rebtxt = lang.lang_parse_btedsimple
var rticon = 'fa-retweet light-blue-text' var rticon = 'fa-retweet light-blue-text'
@ -436,7 +436,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} }
var emoji_url = ` var emoji_url = `
<img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}" <img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}"
alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');"> alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');" loading="lazy">
` `
var regExp = new RegExp(':' + shortcode + ':', 'g') var regExp = new RegExp(':' + shortcode + ':', 'g')
dis_name = dis_name.replace(regExp, emoji_url) dis_name = dis_name.replace(regExp, emoji_url)
@ -652,7 +652,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
id="${id}-image-${key2}" data-url="${url}" data-original="${remote_url}" data-type="${media.type}" id="${id}-image-${key2}" data-url="${url}" data-original="${remote_url}" data-type="${media.type}"
class="img-parsed img-link" style="width:calc(${cwdt}% - 1px); height:${imh};"> class="img-parsed img-link" style="width:calc(${cwdt}% - 1px); height:${imh};">
<img draggable="false" src="${purl}" class="${sense} toot-img pointer" <img draggable="false" src="${purl}" class="${sense} toot-img pointer"
onerror="this.src=\'../../img/loading.svg\'" title="${escapeHTML(desc)}" alt="${escapeHTML(desc)}"> onerror="this.src=\'../../img/loading.svg\'" title="${escapeHTML(desc)}" alt="${escapeHTML(desc)}" loading="lazy">
${nsfwmes} ${nsfwmes}
</a>` </a>`
} }
@ -855,7 +855,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
} }
var emoji_url = ` var emoji_url = `
<img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}" <img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}"
alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');"> alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');" loading="lazy">
` `
var regExp = new RegExp(':' + shortcode + ':', 'g') var regExp = new RegExp(':' + shortcode + ':', 'g')
content = content.replace(regExp, emoji_url) content = content.replace(regExp, emoji_url)
@ -875,7 +875,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
var emoji = toot.profile_emojis[keynico] var emoji = toot.profile_emojis[keynico]
var shortcode = emoji.shortcode var shortcode = emoji.shortcode
var emoji_url = `<img draggable="false" src="${emoji.url}" class="emoji-img" data-emoji="${shortcode}" alt=" :${shortcode}: " var emoji_url = `<img draggable="false" src="${emoji.url}" class="emoji-img" data-emoji="${shortcode}" alt=" :${shortcode}: "
title="${shortcode}" onclick="this.classList.toggle(\'bigemoji\');">` title="${shortcode}" onclick="this.classList.toggle(\'bigemoji\');" loading="lazy">`
var regExp = new RegExp(':' + shortcode + ':', 'g') var regExp = new RegExp(':' + shortcode + ':', 'g')
content = content.replace(regExp, emoji_url) content = content.replace(regExp, emoji_url)
spoil = spoil.replace(regExp, emoji_url) spoil = spoil.replace(regExp, emoji_url)
@ -962,7 +962,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
};width:100%; height:0.9rem; font-size:0.8rem;" class="tickers"> };width:100%; height:0.9rem; font-size:0.8rem;" class="tickers">
<img draggable="false" src="${ <img draggable="false" src="${
value.favicon value.favicon
}" style="height:100%;" onerror="this.src=\'../../img/loading.svg\'"> }" style="height:100%;" onerror="this.src=\'../../img/loading.svg\'" loading="lazy">
<span style="position:relative; top:-0.2rem;">${escapeHTML(value.name)}</span> <span style="position:relative; top:-0.2rem;">${escapeHTML(value.name)}</span>
</div>` </div>`
break break
@ -984,7 +984,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
<a onclick="udg('${toot.quote.account.id}','${acct_id}');" user="${ <a onclick="udg('${toot.quote.account.id}','${acct_id}');" user="${
toot.quote.account.acct toot.quote.account.acct
}" class="udg"> }" class="udg">
<img draggable="false" src="${toot.quote.account.avatar}"> <img draggable="false" src="${toot.quote.account.avatar}" loading="lazy">
</a> </a>
</div> </div>
<div class="renote-user"> <div class="renote-user">
@ -1040,7 +1040,7 @@ function parse(obj, mix, acct_id, tlid, popup, mutefilter, type) {
<div class="area-icon grid"> <div class="area-icon grid">
<a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg"> <a onclick="udg('${toot.account.id}','${acct_id}');" user="${toot.account.acct}" class="udg">
<img draggable="false" src="${avatar}" width="40" class="prof-img" <img draggable="false" src="${avatar}" width="40" class="prof-img"
user="${toot.account.acct}" onerror="this.src='../../img/loading.svg'" alt="" /> user="${toot.account.acct}" onerror="this.src='../../img/loading.svg'" alt="" loading="lazy" />
</a> </a>
${noticeavatar} ${noticeavatar}
</div> </div>
@ -1280,7 +1280,7 @@ function userparse(obj, auth, acct_id, tlid, popup) {
} }
var emoji_url = ` var emoji_url = `
<img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}" <img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}"
alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');"> alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');" loading="lazy">
` `
var regExp = new RegExp(':' + shortcode + ':', 'g') var regExp = new RegExp(':' + shortcode + ':', 'g')
dis_name = dis_name.replace(regExp, emoji_url) dis_name = dis_name.replace(regExp, emoji_url)
@ -1323,6 +1323,7 @@ function userparse(obj, auth, acct_id, tlid, popup) {
user="${toot.acct}" user="${toot.acct}"
onerror="this.src='../../img/loading.svg'" onerror="this.src='../../img/loading.svg'"
alt="" alt=""
loading="lazy"
/> />
</a></div> </a></div>
<div class="area-display_name"> <div class="area-display_name">
@ -1513,7 +1514,7 @@ function pollParse(poll, acct_id, emojis) {
} }
var emoji_url = ` var emoji_url = `
<img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}" <img draggable="false" src="${emoSource}" class="emoji-img" data-emoji="${shortcode}"
alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');"> alt=" :${shortcode}: " title="${shortcode}" onclick="this.classList.toggle('bigemoji');" loading="lazy">
` `
var regExp = new RegExp(':' + shortcode + ':', 'g') var regExp = new RegExp(':' + shortcode + ':', 'g')
choiceText = choiceText.replace(regExp, emoji_url) choiceText = choiceText.replace(regExp, emoji_url)