add: 8 achievements add: larger text setting fix: small infinite
timeline bugs
This commit is contained in:
parent
b860f74124
commit
5dd9fa01cb
19 changed files with 241 additions and 123 deletions
|
@ -1151,82 +1151,90 @@ ${option.input_element_type === "textarea" ? `${option.value}</textarea>` : ""}
|
|||
});
|
||||
|
||||
// intersection observer infinite scrolling
|
||||
const obs = (await ns("ui")).IO_DATA_OBSERVER;
|
||||
if (obs) {
|
||||
console.log("get lost old observer");
|
||||
obs.disconnect();
|
||||
}
|
||||
self.IO_DATA_OBSERVER = null;
|
||||
|
||||
self.IO_DATA_OBSERVER = new IntersectionObserver(
|
||||
async (entries) => {
|
||||
for (const entry of entries) {
|
||||
if (!entry.isIntersecting) {
|
||||
continue;
|
||||
}
|
||||
|
||||
await self.io_load_data();
|
||||
break;
|
||||
self.define(
|
||||
"io_data_load",
|
||||
async (_, tmpl, page, paginated_mode = false) => {
|
||||
// remove old
|
||||
const obs = self.IO_DATA_OBSERVER;
|
||||
if (obs) {
|
||||
console.log("get lost old observer");
|
||||
obs.disconnect();
|
||||
self.IO_DATA_OBSERVER = null;
|
||||
}
|
||||
},
|
||||
{
|
||||
root: document.body,
|
||||
rootMargin: "0px",
|
||||
threshold: 1,
|
||||
},
|
||||
);
|
||||
|
||||
self.define("io_data_load", (_, tmpl, page, paginated_mode = false) => {
|
||||
self.IO_DATA_MARKER = document.querySelector(
|
||||
"[ui_ident=io_data_marker]",
|
||||
);
|
||||
self.IO_DATA_OBSERVER = new IntersectionObserver(
|
||||
async (entries) => {
|
||||
for (const entry of entries) {
|
||||
if (!entry.isIntersecting) {
|
||||
continue;
|
||||
}
|
||||
|
||||
self.IO_DATA_ELEMENT = document.querySelector(
|
||||
"[ui_ident=io_data_load]",
|
||||
);
|
||||
|
||||
self.IO_HTML_TMPL = document.getElementById("loading_skeleton");
|
||||
|
||||
if (!self.IO_DATA_ELEMENT || !self.IO_DATA_MARKER) {
|
||||
console.warn(
|
||||
"ui::io_data_load called, but required elements don't exist",
|
||||
await self.io_load_data();
|
||||
break;
|
||||
}
|
||||
},
|
||||
{
|
||||
root: document.body,
|
||||
rootMargin: "0px",
|
||||
threshold: 1,
|
||||
},
|
||||
);
|
||||
|
||||
return;
|
||||
}
|
||||
// ...
|
||||
self.IO_DATA_MARKER = document.querySelector(
|
||||
"[ui_ident=io_data_marker]",
|
||||
);
|
||||
|
||||
self.IO_DATA_TMPL = tmpl;
|
||||
self.IO_DATA_PAGE = page;
|
||||
self.IO_DATA_SEEN_IDS = [];
|
||||
self.IO_DATA_WAITING = false;
|
||||
self.IO_HAS_LOADED_AT_LEAST_ONCE = false;
|
||||
self.IO_DATA_DISCONNECTED = false;
|
||||
self.IO_DATA_DISABLE_RELOAD = false;
|
||||
self.IO_DATA_ELEMENT = document.querySelector(
|
||||
"[ui_ident=io_data_load]",
|
||||
);
|
||||
|
||||
if (!paginated_mode) {
|
||||
self.IO_DATA_OBSERVER.observe(self.IO_DATA_MARKER);
|
||||
} else {
|
||||
// immediately load first page
|
||||
self.IO_DATA_TMPL = self.IO_DATA_TMPL.replace("&page=", "");
|
||||
self.IO_DATA_TMPL += `&paginated=true&page=`;
|
||||
self.io_load_data();
|
||||
}
|
||||
self.IO_HTML_TMPL = document.getElementById("loading_skeleton");
|
||||
|
||||
if (!self.IO_DATA_ELEMENT || !self.IO_DATA_MARKER) {
|
||||
console.warn(
|
||||
"ui::io_data_load called, but required elements don't exist",
|
||||
);
|
||||
|
||||
setTimeout(() => {
|
||||
if (self.IO_DATA_DISABLE_RELOAD) {
|
||||
console.log("missing data reload disabled");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!self.IO_HAS_LOADED_AT_LEAST_ONCE) {
|
||||
// reload
|
||||
self.IO_DATA_OBSERVER.disconnect();
|
||||
console.log("timeline load fail :(");
|
||||
window.location.reload();
|
||||
}
|
||||
}, 1500);
|
||||
self.IO_DATA_TMPL = tmpl;
|
||||
self.IO_DATA_PAGE = page;
|
||||
self.IO_DATA_SEEN_IDS = [];
|
||||
self.IO_DATA_WAITING = false;
|
||||
self.IO_HAS_LOADED_AT_LEAST_ONCE = false;
|
||||
self.IO_DATA_DISCONNECTED = false;
|
||||
self.IO_DATA_DISABLE_RELOAD = false;
|
||||
|
||||
self.IO_PAGINATED = paginated_mode;
|
||||
});
|
||||
if (!paginated_mode) {
|
||||
self.IO_DATA_OBSERVER.observe(self.IO_DATA_MARKER);
|
||||
} else {
|
||||
// immediately load first page
|
||||
self.IO_DATA_TMPL = self.IO_DATA_TMPL.replace("&page=", "");
|
||||
self.IO_DATA_TMPL += `&paginated=true&page=`;
|
||||
self.io_load_data();
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
if (self.IO_DATA_DISABLE_RELOAD) {
|
||||
console.log("missing data reload disabled");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!self.IO_HAS_LOADED_AT_LEAST_ONCE) {
|
||||
// reload
|
||||
self.IO_DATA_OBSERVER.disconnect();
|
||||
console.log("timeline load fail :(");
|
||||
window.location.reload();
|
||||
}
|
||||
}, 1500);
|
||||
|
||||
self.IO_PAGINATED = paginated_mode;
|
||||
},
|
||||
);
|
||||
|
||||
self.define("io_load_data", async () => {
|
||||
if (self.IO_DATA_WAITING) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue