feat(ipub): make #ensureID private and remove old code
This commit is contained in:
@@ -4,35 +4,20 @@ class IPUBElement extends HTMLElement {
|
||||
static observedAttributes = ["id"];
|
||||
|
||||
connectedCallback() {
|
||||
this.ensureID();
|
||||
this.#ensureID();
|
||||
}
|
||||
|
||||
attributeChangedCallback(_name, _oldValue, _newValue) {
|
||||
this.ensureID();
|
||||
this.#ensureID();
|
||||
}
|
||||
|
||||
ensureID() {
|
||||
if (this.id) {
|
||||
return;
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
#ensureID() {
|
||||
if (!this.id) {
|
||||
this.id = hashFromHTML(this);
|
||||
}
|
||||
|
||||
// INFO: Hash algorithm by Joe Freeman & Cristian Sanchez at StackOverflow:
|
||||
// https://stackoverflow.com/a/16348977
|
||||
// https://stackoverflow.com/a/3426956
|
||||
//
|
||||
// Licensed under CC BY-SA 3.0 (https://creativecommons.org/licenses/by-sa/3.0/)
|
||||
|
||||
let hash = 0;
|
||||
this.innerHTML.split("").forEach((char) => {
|
||||
hash = char.charCodeAt(0) + ((hash << 5) - hash);
|
||||
});
|
||||
|
||||
let id = "";
|
||||
for (let i = 0; i < 3; i++) {
|
||||
id += ((hash >> (i * 8)) & 0xff).toString(16).padStart(2, "0");
|
||||
}
|
||||
|
||||
this.id = id;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -200,43 +185,41 @@ globalThis.addEventListener("load", () => {
|
||||
});
|
||||
});
|
||||
|
||||
for (const element of document.querySelectorAll(
|
||||
`[data-ipub-trigger="on-screen"]`,
|
||||
)) {
|
||||
observer.observe(element);
|
||||
}
|
||||
|
||||
document.addEventListener("scroll", async () => {
|
||||
for (const [id, element] of onScreenMap) {
|
||||
const perc = getPercentageInView(element);
|
||||
// console.debug(`Element #${id} is now ${perc}% on screen`);
|
||||
|
||||
const played = element.getAttribute("data-ipub-trigger-played") == "true";
|
||||
|
||||
if (perc >= 100 && !played) {
|
||||
await playIpubElement(element);
|
||||
element.setAttribute("data-ipub-trigger-played", "true");
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* @param {Element} element
|
||||
*/
|
||||
async function playIpubElement(element) {
|
||||
switch (element.tagName) {
|
||||
case "audio": {
|
||||
/** @type {HTMLAudioElement} */
|
||||
const audio = element;
|
||||
|
||||
// await audio.play();
|
||||
|
||||
break;
|
||||
}
|
||||
default:
|
||||
break;
|
||||
/**
|
||||
* @param {Readonly<Element>} el
|
||||
* @param {number} [length=6]
|
||||
* @returns {string}
|
||||
*
|
||||
* @copyright This function contains code from a hash algorithm by
|
||||
* {@link https://stackoverflow.com/a/16348977|Joe Freeman} and
|
||||
* {@link https://stackoverflow.com/a/3426956|Cristian Sanchez} at
|
||||
* StackOverflow, licensed under {@link https://creativecommons.org/licenses/by-sa/3.0/|CC BY-SA 3.0}.
|
||||
*/
|
||||
function hashFromHTML(el, length = 6) {
|
||||
const hexLength = length / 2;
|
||||
if (hexLength % 2 !== 0) {
|
||||
hexLength + 1;
|
||||
}
|
||||
|
||||
let hash = 0;
|
||||
for (const char of el.innerHTML) {
|
||||
hash = char.charCodeAt(0) + ((hash << 5) - hash);
|
||||
}
|
||||
|
||||
let hex = "";
|
||||
for (let i = 0; i < hexLength; i++) {
|
||||
hex += ((hash >> (i * 8)) & 0xff).toString(16).padStart(2, "0");
|
||||
}
|
||||
|
||||
return hex.substring(0, length);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user