tenkuma/web
tenkuma/web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add metro notification system in JS with styling, fix audio playback before first volume change, change tip.js to export function to register new element with hint.

Browse source
This commit is contained in:
天クマ 2026-04-23 20:31:35 -03:00
commit e31bb2b40e
8 changed files with 164 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

70
static/scripts/tips.js
View file

@ -1,8 +1,4 @@
const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (isMobile) {
return;
}
const body = document.querySelector('body');
const elements = document.querySelectorAll('[data-tip]');
const hint = document.querySelector("#headerSubtitle");
@ -10,36 +6,11 @@ const hintPanelDefaultText = hint.innerHTML;
let fixedHint;
let currentObserver;
elements.forEach(el => {
el.addEventListener('mouseenter', function() {
cleanup();
if (currentObserver) {
currentObserver.disconnect();
}
currentObserver = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (!entry.isIntersecting) {
fixedHint = document.createElement('p');
fixedHint.id = "fixedHint";
fixedHint.innerHTML = el.dataset.tip;
fixedHint.setAttribute('aria-hidden', 'true');
body.appendChild(fixedHint);
} else {
hint.innerHTML = el.dataset.tip;
}
})
});
hint.innerHTML = el.dataset.tip;
currentObserver.observe(hint);
});
el.addEventListener('mouseleave', function() {
cleanup();
});
})
if (!isMobile) {
elements.forEach(el => {
registerElementHint(el);
})
}
function cleanup() {
hint.innerHTML = hintPanelDefaultText;
@ -52,3 +23,34 @@ function cleanup() {
currentObserver = null;
}
}
export function registerElementHint(el) {
el.addEventListener('mouseenter', function() {
cleanup();
if (currentObserver) {
currentObserver.disconnect();
}
currentObserver = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (!entry.isIntersecting) {
fixedHint = document.createElement('p');
fixedHint.id = "fixedHint";
fixedHint.innerHTML = el.dataset.tip;
fixedHint.setAttribute('aria-hidden', 'true');
body.appendChild(fixedHint);
} else {
hint.innerHTML = el.dataset.tip;
}
})
});
hint.innerHTML = el.dataset.tip;
currentObserver.observe(hint);
});
el.addEventListener('mouseleave', function() {
cleanup();
});
}