e6e89d4ebc
- Enhanced tests to ensure consistent messageId generation for legacy inbox rows lacking a messageId. - Updated test descriptions for better clarity regarding the new messageId handling. - Adjusted test expectations to align with the updated behavior of relaying legacy inbox rows with generated messageIds.
60 lines
1.7 KiB
TypeScript
60 lines
1.7 KiB
TypeScript
import { ref, onMounted, onUnmounted, nextTick } from "vue";
|
||
|
||
/**
|
||
* Параллакс-эффект для фоновых орбов через одну секцию.
|
||
* На мобилке отключён — мешает touch-скроллу и жрёт батарею.
|
||
*/
|
||
export const useParallaxSections = (speed = 0.1) => {
|
||
const containerRef = ref<HTMLElement | null>(null);
|
||
let ticking = false;
|
||
let targets: { bg: HTMLElement; section: HTMLElement }[] = [];
|
||
|
||
function collect() {
|
||
if (!containerRef.value) return;
|
||
targets = [];
|
||
const sections = containerRef.value.querySelectorAll(".section");
|
||
sections.forEach((section, i) => {
|
||
if (i % 2 === 0) return;
|
||
const bg = section.querySelector<HTMLElement>('[class*="__bg"]');
|
||
if (!bg) return;
|
||
bg.style.willChange = "transform";
|
||
targets.push({ bg, section: section as HTMLElement });
|
||
});
|
||
}
|
||
|
||
function update() {
|
||
for (const { bg, section } of targets) {
|
||
const rect = section.getBoundingClientRect();
|
||
const offset = rect.top * speed;
|
||
bg.style.transform = `translateY(${offset}px)`;
|
||
}
|
||
}
|
||
|
||
function onScroll() {
|
||
if (ticking) return;
|
||
ticking = true;
|
||
requestAnimationFrame(() => {
|
||
update();
|
||
ticking = false;
|
||
});
|
||
}
|
||
|
||
onMounted(async () => {
|
||
if (window.innerWidth < 768) return;
|
||
|
||
await nextTick();
|
||
// Ждём пока lazy-компоненты прогрузятся
|
||
setTimeout(() => {
|
||
collect();
|
||
update();
|
||
}, 600);
|
||
window.addEventListener("scroll", onScroll, { passive: true });
|
||
});
|
||
|
||
onUnmounted(() => {
|
||
window.removeEventListener("scroll", onScroll);
|
||
targets = [];
|
||
});
|
||
|
||
return { containerRef };
|
||
};
|