integrated evenements in drupal and front

This commit is contained in:
2026-09-11 19:14:00 +02:00
parent 32319f19bd
commit 4efafd0e22
22 changed files with 1457 additions and 274 deletions
+19 -10
View File
@@ -91,7 +91,16 @@ gsap.registerPlugin(ScrollTrigger);
};
function initTitles() {
const titles = document.querySelectorAll('#block-leshed-identitedusite>a, article.node-type-projet>header>h2, article.node-type-projet>.cols>.left>h2, article.node-type-projet.view-mode-full h2.node-title');
const titles = document.querySelectorAll('\
#block-leshed-identitedusite>a, \
article.node-type-projet>header>h2,\
article.node-type-projet>.cols>.left>h2,\
article.node-type-projet.view-mode-full h2.node-title,\
article.node-type-evenement>header>h2,\
article.node-type-evenement>header>.field_dates>time,\
article.node-type-evenement.view-mode-full h2.node-title,\
article.node-type-evenement.view-mode-full .field_dates.digit-dates span.date-part\
');
for (const txt of titles) {
txt.classList.add("variable-title");
const splitted = Splitting({ target: txt, by: 'chars' });
@@ -313,23 +322,23 @@ gsap.registerPlugin(ScrollTrigger);
console.log('initPageFull');
// PAGE TITLE SCALING DOWN
const pageTitle = document.querySelector('article.node-type-projet.view-mode-full h2.node-title');
console.log('pageTitle', pageTitle);
const pageHeader = document.querySelector('article.node-type-projet.view-mode-full .cols>.col.left>header, article.node-type-evenement.view-mode-full>.cols>.col.left>header');
console.log('pageHeader', pageHeader);
if (pageTitle) {
if (pageHeader) {
// needs requestAnimationFrame to get the real titleHeight after splitting
requestAnimationFrame(() => {
requestAnimationFrame(() => {
const initTitleH = pageTitle.offsetHeight;
// console.log(`initTitleH: ${initTitleH}`);
const titleScaleTarget = 0.4;
const end = initTitleH - initTitleH * titleScaleTarget;
const initheaderH = pageHeader.offsetHeight;
// console.log(`initheaderH: ${initheaderH}`);
const headerScaleTarget = 0.4;
const end = initheaderH - initheaderH * headerScaleTarget;
// console.log(`end: ${end}`);
gsap_mm.add('(min-width: 768px)', () => {
gsap.to(pageTitle, {
scale: titleScaleTarget,
gsap.to(pageHeader, {
scale: headerScaleTarget,
y: end,
ease: 'none',
scrollTrigger: {