@caspingus/lt
Version:
A utility library of helpers and extensions useful when working with Learnosity APIs.
60 lines (59 loc) • 2.64 kB
JavaScript
import { r as e, t } from "../../extensionsFactory-hk5ijx1G.js";
//#region src/assessment/extensions/accessibility/ux/readingMask/index.js
var n = {
mouse: {
x: 0,
y: 0
},
mouseTrackingInitialised: !1,
readingMask: null
};
function r() {
n.readingMask || i(), n.mouseTrackingInitialised ||= (document.addEventListener("mousemove", (e) => {
n.mouse.x = e.clientX, n.mouse.y = e.clientY, n.readingMask?.hidden || c(e.clientY);
}, { passive: !0 }), !0);
}
function i() {
let e = document.createElement("div");
e.id = "lt__reading-mask", e.classList.add("lt__reading-mask"), e.hidden = !0, document.querySelector(".lrn-assess").appendChild(e), n.readingMask = e;
}
function a() {
n.readingMask?.hidden || s();
}
function o() {
n.readingMask?.hidden && s();
}
function s() {
if (!n.readingMask) {
t.utils.logger.warn("[ReadingMask] toggle() called before run()");
return;
}
let e = n.readingMask.hidden;
return n.readingMask.hidden = !e, e ? (n.readingMask.classList.add("has-mask"), c(n.mouse.y)) : n.readingMask.classList.remove("has-mask"), e;
}
function c(e) {
if (!n.readingMask) return;
let t = Math.max(0, e - 80), r = e + 80, i = `
linear-gradient(
to bottom,
black 0,
black ${t}px,
transparent ${t}px,
transparent ${r}px,
black ${r}px,
black 100%
)
`;
n.readingMask.style.maskImage = i, n.readingMask.style.webkitMaskImage = i;
}
function l() {
return "\n /* Learnosity reading mask styles */\n .lt__reading-mask {\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n pointer-events: none; /* Let mouse events pass through */\n z-index: 9999;\n mask-image: linear-gradient(to bottom, black 0, black 100px, transparent 100px, transparent 300px, black 300px, black 100%);\n -webkit-mask-image: linear-gradient(to bottom, black 0, black 100px, transparent 100px, transparent 300px, black 300px, black 100%);\n background: rgba(0, 0, 0, 0.6);\n\n .has-mask {\n mask-image: linear-gradient(to bottom, black 0, black 100px, transparent 100px, transparent 300px, black 300px, black 100%);\n -webkit-mask-image: linear-gradient(to bottom, black 0, black 100px, transparent 100px, transparent 300px, black 300px, black 100%);\n }\n }\n ";
}
var u = e("readingMask", r, {
getStyles: l,
hide: a,
show: o,
toggle: s
});
//#endregion
export { u as readingMask };