vassili/seitime-frappe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

refactor!: drop lazy loading utility

Browse source 
Browsers now natively support this with `lazy` attribute.
This commit is contained in:
Ankush Menat 2022-08-09 18:15:14 +05:30
parent ce164d59e3
commit 5d4e1e66b8
2 changed files with 0 additions and 51 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
frappe/public/scss/website/website_image.scss
View file

@ -18,12 +18,6 @@ img {
background: $light;
}
.website-image-lazy {
min-height: 200px;
height: 100%;
background-color: $light;
}
@mixin website-image {
display: inline-block;
object-fit: contain;

45
frappe/website/js/website.js
View file

@ -371,50 +371,6 @@ $.extend(frappe, {
$($heading).append($a);
});
},
setup_lazy_images: function () {
// Use IntersectionObserver to only load images that are visible in the viewport
// Fallback for browsers that don't support it
// To use this feature, instead of adding an img tag, add
// <div class="website-image-lazy" data-class="img-class" data-src="image.jpg" data-alt="image"></div>
const allowed_attributes = ["src", "srcset", "alt", "title", "width", "height"];
function replace_with_image(target) {
const $target = $(target);
const attrs = $target.data();
const data_string = Object.keys(attrs)
.filter((key) => allowed_attributes.includes(key))
.map((key) => `${key}="${attrs[key]}"`)
.join(" ");
$target.replaceWith(`<img ${data_string}>`);
}
if (!window.IntersectionObserver) {
$(".website-image-lazy").each((_, el) => {
replace_with_image(el);
});
return;
}
const io = new IntersectionObserver(
(entries) => {
entries.forEach((e) => {
if (e.intersectionRatio > 0) {
io.unobserve(e.target);
replace_with_image(e.target);
}
});
},
{
threshold: [0, 0.2, 0.4, 0.6],
}
);
$(".website-image-lazy").each((_, el) => {
// Start observing an element
io.observe(el);
});
},
show_language_picker() {
if (frappe.session.user === "Guest" && window.show_language_picker) {
frappe
@ -665,7 +621,6 @@ $(document).ready(function () {
}
frappe.render_user();
frappe.setup_lazy_images();
$(document).trigger("page-change");
});