TF-2160 Use loading attribute replace IntersectionObserver

(cherry picked from commit 88362cab421f0962dc0103bd165d70850668043e)
This commit is contained in:
dab246
2023-09-26 15:31:10 +07:00
committed by Dat H. Pham
parent be7eada7b7
commit 73de2f37fa
3 changed files with 1 additions and 38 deletions
@@ -61,40 +61,6 @@ class HtmlUtils {
}
''';
static const scriptLazyLoadImage = '''
<script type="text/javascript">
const lazyImages = document.querySelectorAll("img.lazy-loading");
const options = {
root: null, // Use the viewport as the root
rootMargin: "0px",
threshold: 0 // Specify the threshold for intersection
};
const handleIntersection = (entries, observer) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
const img = entry.target;
const src = img.getAttribute("data-src");
// Replace the placeholder with the actual image source
img.src = src;
img.removeAttribute("data-src");
// Stop observing the image
observer.unobserve(img);
}
});
};
const observer = new IntersectionObserver(handleIntersection, options);
lazyImages.forEach((image) => {
observer.observe(image);
});
</script>
''';
static String customCssStyleHtmlEditor({TextDirection direction = TextDirection.ltr}) {
if (PlatformInfo.isWeb) {
return '''
@@ -4,7 +4,6 @@ import 'dart:math' as math;
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/utils/html_transformer/html_template.dart';
import 'package:core/presentation/utils/html_transformer/html_utils.dart';
import 'package:core/presentation/views/html_viewer/html_viewer_controller_for_web.dart';
import 'package:core/utils/app_logger.dart';
import 'package:flutter/cupertino.dart';
@@ -171,7 +170,7 @@ class _HtmlContentViewerOnWebState extends State<HtmlContentViewerOnWeb> {
minHeight: minHeight,
minWidth: minWidth,
styleCSS: tooltipLinkCss,
javaScripts: webViewActionScripts + scriptsDisableZoom + HtmlUtils.scriptLazyLoadImage,
javaScripts: webViewActionScripts + scriptsDisableZoom,
direction: widget.direction);
return htmlTemplate;
@@ -68,7 +68,6 @@ class _HtmlContentViewState extends State<HtmlContentViewer> {
_htmlData = generateHtml(
widget.contentHtml,
direction: widget.direction,
javaScripts: HtmlUtils.scriptLazyLoadImage
);
}
@@ -81,7 +80,6 @@ class _HtmlContentViewState extends State<HtmlContentViewer> {
_htmlData = generateHtml(
widget.contentHtml,
direction: widget.direction,
javaScripts: HtmlUtils.scriptLazyLoadImage
);
}
}