use intersection observer to unpack visible articles, remove Headlines.unpackVisible()
This commit is contained in:
parent
7adbc95acc
commit
5e77d0062b
|
@ -8,7 +8,7 @@ define(["dojo/_base/declare"], function (declare) {
|
||||||
headlines: [],
|
headlines: [],
|
||||||
current_first_id: 0,
|
current_first_id: 0,
|
||||||
_scroll_reset_timeout: false,
|
_scroll_reset_timeout: false,
|
||||||
intersection_observer: new IntersectionObserver(
|
sticky_header_observer: new IntersectionObserver(
|
||||||
(entries, observer) => {
|
(entries, observer) => {
|
||||||
entries.forEach((entry) => {
|
entries.forEach((entry) => {
|
||||||
const header = entry.target.nextElementSibling;
|
const header = entry.target.nextElementSibling;
|
||||||
|
@ -26,6 +26,15 @@ define(["dojo/_base/declare"], function (declare) {
|
||||||
},
|
},
|
||||||
{threshold: [0, 1], root: document.querySelector("#headlines-frame")}
|
{threshold: [0, 1], root: document.querySelector("#headlines-frame")}
|
||||||
),
|
),
|
||||||
|
unpack_observer: new IntersectionObserver(
|
||||||
|
(entries, observer) => {
|
||||||
|
entries.forEach((entry) => {
|
||||||
|
if (entry.intersectionRatio > 0)
|
||||||
|
Article.unpack(entry.target);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
{threshold: [0], root: document.querySelector("#headlines-frame")}
|
||||||
|
),
|
||||||
row_observer: new MutationObserver((mutations) => {
|
row_observer: new MutationObserver((mutations) => {
|
||||||
const modified = [];
|
const modified = [];
|
||||||
|
|
||||||
|
@ -287,8 +296,6 @@ define(["dojo/_base/declare"], function (declare) {
|
||||||
},
|
},
|
||||||
scrollHandler: function (/*event*/) {
|
scrollHandler: function (/*event*/) {
|
||||||
try {
|
try {
|
||||||
Headlines.unpackVisible();
|
|
||||||
|
|
||||||
if (!Feeds.infscroll_disabled && !Feeds.infscroll_in_progress) {
|
if (!Feeds.infscroll_disabled && !Feeds.infscroll_in_progress) {
|
||||||
const hsp = $("headlines-spacer");
|
const hsp = $("headlines-spacer");
|
||||||
const container = $("headlines-frame");
|
const container = $("headlines-frame");
|
||||||
|
@ -325,22 +332,6 @@ define(["dojo/_base/declare"], function (declare) {
|
||||||
console.warn("scrollHandler", e);
|
console.warn("scrollHandler", e);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
unpackVisible: function () {
|
|
||||||
if (!App.isCombinedMode() || !App.getInitParam("cdm_expanded")) return;
|
|
||||||
|
|
||||||
const rows = $$("#headlines-frame div[id*=RROW][data-content]");
|
|
||||||
const threshold = $("headlines-frame").scrollTop + $("headlines-frame").offsetHeight + 600;
|
|
||||||
|
|
||||||
for (let i = 0; i < rows.length; i++) {
|
|
||||||
const row = rows[i];
|
|
||||||
|
|
||||||
if (row.offsetTop <= threshold) {
|
|
||||||
Article.unpack(row);
|
|
||||||
} else {
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
objectById: function (id){
|
objectById: function (id){
|
||||||
return this.headlines[id];
|
return this.headlines[id];
|
||||||
},
|
},
|
||||||
|
@ -380,13 +371,12 @@ define(["dojo/_base/declare"], function (declare) {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (hl.selected) this.select("all", id);
|
if (hl.selected) this.select("all", id);
|
||||||
|
|
||||||
Article.unpack(new_row);
|
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$$(".cdm .header-sticky-guard").each((e) => { this.intersection_observer.observe(e) });
|
$$(".cdm .header-sticky-guard").each((e) => { this.sticky_header_observer.observe(e) });
|
||||||
|
$$("#headlines-frame > div[id*=RROW].cdm").each((e) => { this.unpack_observer.observe(e) });
|
||||||
|
|
||||||
},
|
},
|
||||||
render: function (headlines, hl) {
|
render: function (headlines, hl) {
|
||||||
let row = null;
|
let row = null;
|
||||||
|
@ -695,7 +685,8 @@ define(["dojo/_base/declare"], function (declare) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$$(".cdm .header-sticky-guard").each((e) => { this.intersection_observer.observe(e) });
|
$$(".cdm .header-sticky-guard").each((e) => { this.sticky_header_observer.observe(e) });
|
||||||
|
$$("#headlines-frame > div[id*=RROW].cdm").each((e) => { this.unpack_observer.observe(e) });
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
console.error("Invalid object received: " + transport.responseText);
|
console.error("Invalid object received: " + transport.responseText);
|
||||||
|
|
|
@ -42,8 +42,6 @@ require(['dojo/_base/kernel', 'dojo/ready'], function (dojo, ready) {
|
||||||
${__("Click to expand article")}</button>`;
|
${__("Click to expand article")}</button>`;
|
||||||
|
|
||||||
dojo.parser.parse(c_inner);
|
dojo.parser.parse(c_inner);
|
||||||
|
|
||||||
Headlines.unpackVisible();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, 150);
|
}, 150);
|
||||||
|
|
Loading…
Reference in New Issue