1
0
mirror of https://github.com/e107inc/e107.git synced 2025-03-14 01:19:44 +01:00

Lazy loading added to bbcode images and avatar images by default.

This commit is contained in:
Cameron 2021-10-26 14:57:01 -07:00
parent 723974a0ba
commit 038d88aa2a
3 changed files with 12 additions and 6 deletions

View File

@ -80,6 +80,11 @@
unset($imgParms['figcaption']);
}
if(empty($imgParms['loading']))
{
$imgParms['loading'] = 'lazy';
}
$resizeWidth = e107::getBB()->resizeWidth();
$w = !empty($imgParms['width']) ? (int) $imgParms['width'] : vartrue($resizeWidth, 0);

View File

@ -4109,9 +4109,10 @@ class e_parse
$class = !empty($options['class']) ? $options['class'] : $shape . ' user-avatar';
$style = !empty($options['style']) ? " style='" . $options['style'] . "'" : '';
$loading = !empty($options['loading']) ? " loading='".$options['loading']."'" : " loading='lazy'"; // default to lazy.
$text = $linkStart;
$text .= '<img ' . $id . "class='" . $class . $classOnline . "' alt=\"" . $title . "\" src='" . $url . "' width='" . $width . "' " . $heightInsert . $style . ' />';
$text .= '<img ' . $id . "class='" . $class . $classOnline . "' alt=\"" . $title . "\" src='" . $url . "' width='" . $width . "' " . $heightInsert . $style . $loading . ' />';
$text .= $linkEnd;
// return $url;

View File

@ -42,23 +42,23 @@
array(
'codetext' => '{e_MEDIA_IMAGE}2020-12/5.sm.webp',
'parm' => '',
'expected' => '<img class="img-rounded rounded bbcode bbcode-img" src="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2F5.sm.webp&amp;w=0&amp;h=0" alt="5.sm.webp" />'
'expected' => '<img class="img-rounded rounded bbcode bbcode-img" src="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2F5.sm.webp&amp;w=0&amp;h=0" alt="5.sm.webp" loading="lazy" />'
),
array(
'codetext' => '{e_MEDIA}images/2020-12/horse.jpg',
'parm' => 'width=300',
'expected' => '<img class="img-rounded rounded bbcode bbcode-img" src="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=300&amp;h=0" alt="Horse" srcset="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=600&amp;h=0 2x" width="300" title="Horse" />'
'expected' => '<img class="img-rounded rounded bbcode bbcode-img" src="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=300&amp;h=0" alt="Horse" srcset="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=600&amp;h=0 2x" width="300" loading="lazy" title="Horse" />'
),
array(
'codetext' => '{e_MEDIA_IMAGE}2020-12/horse.jpg',
'parm' => 'width=300',
'expected' => '<img class="img-rounded rounded bbcode bbcode-img" src="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=300&amp;h=0" alt="Horse" srcset="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=600&amp;h=0 2x" width="300" title="Horse" />'
'expected' => '<img class="img-rounded rounded bbcode bbcode-img" src="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=300&amp;h=0" alt="Horse" srcset="thumb.php?src=e_MEDIA_IMAGE%2F2020-12%2Fhorse.jpg&amp;w=600&amp;h=0 2x" width="300" loading="lazy" title="Horse" />'
),
array(
'codetext' => '{e_THEME}voux/install/gasmask.jpg',
'parm' => 'width=300&alt=Custom',
'parm' => 'width=300&alt=Custom&loading=auto',
'expected' => "<figure>
<img class=\"img-rounded rounded bbcode bbcode-img\" src=\"thumb.php?src=e_THEME%2Fvoux%2Finstall%2Fgasmask.jpg&amp;w=300&amp;h=0\" alt=\"Custom\" srcset=\"thumb.php?src=e_THEME%2Fvoux%2Finstall%2Fgasmask.jpg&amp;w=600&amp;h=0 2x\" width=\"300\" title=\"Custom\" /><figcaption>Custom</figcaption>
<img class=\"img-rounded rounded bbcode bbcode-img\" src=\"thumb.php?src=e_THEME%2Fvoux%2Finstall%2Fgasmask.jpg&amp;w=300&amp;h=0\" alt=\"Custom\" srcset=\"thumb.php?src=e_THEME%2Fvoux%2Finstall%2Fgasmask.jpg&amp;w=600&amp;h=0 2x\" width=\"300\" loading=\"auto\" title=\"Custom\" /><figcaption>Custom</figcaption>
</figure>"
),
);