@bebranded/bb-contents 1.0.52-beta → 1.0.53-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bb-contents.js +2 -83
- package/package.json +1 -1
package/bb-contents.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* BeBranded Contents
|
|
3
3
|
* Contenus additionnels français pour Webflow
|
|
4
|
-
* @version 1.0.
|
|
4
|
+
* @version 1.0.53-beta
|
|
5
5
|
* @author BeBranded
|
|
6
6
|
* @license MIT
|
|
7
7
|
* @website https://www.bebranded.xyz
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
|
|
29
29
|
// Configuration
|
|
30
30
|
const config = {
|
|
31
|
-
version: '1.0.
|
|
31
|
+
version: '1.0.53-beta',
|
|
32
32
|
debug: false, // Debug désactivé
|
|
33
33
|
prefix: 'bb-', // utilisé pour générer les sélecteurs (data-bb-*)
|
|
34
34
|
youtubeEndpoint: null, // URL du worker YouTube (à définir par l'utilisateur)
|
|
@@ -288,7 +288,6 @@
|
|
|
288
288
|
// Récupérer les options
|
|
289
289
|
const speed = bbContents._getAttr(element, 'bb-marquee-speed') || '100';
|
|
290
290
|
const direction = bbContents._getAttr(element, 'bb-marquee-direction') || 'left';
|
|
291
|
-
const pauseOnHover = bbContents._getAttr(element, 'bb-marquee-pause');
|
|
292
291
|
const gap = bbContents._getAttr(element, 'bb-marquee-gap') || '50';
|
|
293
292
|
const orientation = bbContents._getAttr(element, 'bb-marquee-orientation') || 'horizontal';
|
|
294
293
|
const height = bbContents._getAttr(element, 'bb-marquee-height') || '300';
|
|
@@ -500,46 +499,6 @@
|
|
|
500
499
|
animationId = requestAnimationFrame(animate);
|
|
501
500
|
|
|
502
501
|
// Marquee vertical créé avec animation JS
|
|
503
|
-
|
|
504
|
-
// Pause au survol avec transition fluide CSS + JS
|
|
505
|
-
if (pauseOnHover === 'true') {
|
|
506
|
-
// Transition fluide avec easing naturel
|
|
507
|
-
const transitionSpeed = (targetSpeed, duration = 300) => {
|
|
508
|
-
const startSpeed = currentStep;
|
|
509
|
-
const speedDiff = targetSpeed - startSpeed;
|
|
510
|
-
const startTime = performance.now();
|
|
511
|
-
|
|
512
|
-
// Easing naturel
|
|
513
|
-
const easeOutCubic = (t) => 1 - Math.pow(1 - t, 3);
|
|
514
|
-
const easeInCubic = (t) => t * t * t;
|
|
515
|
-
|
|
516
|
-
const animateTransition = (currentTime) => {
|
|
517
|
-
const elapsed = currentTime - startTime;
|
|
518
|
-
const progress = Math.min(elapsed / duration, 1);
|
|
519
|
-
|
|
520
|
-
// Easing différent selon la direction
|
|
521
|
-
const easedProgress = targetSpeed === 0 ?
|
|
522
|
-
easeOutCubic(progress) : easeInCubic(progress);
|
|
523
|
-
|
|
524
|
-
currentStep = startSpeed + speedDiff * easedProgress;
|
|
525
|
-
|
|
526
|
-
if (progress < 1) {
|
|
527
|
-
requestAnimationFrame(animateTransition);
|
|
528
|
-
} else {
|
|
529
|
-
currentStep = targetSpeed;
|
|
530
|
-
}
|
|
531
|
-
};
|
|
532
|
-
|
|
533
|
-
requestAnimationFrame(animateTransition);
|
|
534
|
-
};
|
|
535
|
-
|
|
536
|
-
element.addEventListener('mouseenter', function() {
|
|
537
|
-
transitionSpeed(0); // Ralentir jusqu'à 0
|
|
538
|
-
});
|
|
539
|
-
element.addEventListener('mouseleave', function() {
|
|
540
|
-
transitionSpeed(baseStep); // Revenir à la vitesse normale
|
|
541
|
-
});
|
|
542
|
-
}
|
|
543
502
|
} else {
|
|
544
503
|
// Animation JavaScript pour l'horizontal (comme le vertical pour éviter les saccades)
|
|
545
504
|
const contentSize = finalWidth;
|
|
@@ -579,46 +538,6 @@
|
|
|
579
538
|
animationId = requestAnimationFrame(animate);
|
|
580
539
|
|
|
581
540
|
// Marquee horizontal créé avec animation JS
|
|
582
|
-
|
|
583
|
-
// Pause au survol avec transition fluide CSS + JS
|
|
584
|
-
if (pauseOnHover === 'true') {
|
|
585
|
-
// Transition fluide avec easing naturel
|
|
586
|
-
const transitionSpeed = (targetSpeed, duration = 300) => {
|
|
587
|
-
const startSpeed = currentStep;
|
|
588
|
-
const speedDiff = targetSpeed - startSpeed;
|
|
589
|
-
const startTime = performance.now();
|
|
590
|
-
|
|
591
|
-
// Easing naturel
|
|
592
|
-
const easeOutCubic = (t) => 1 - Math.pow(1 - t, 3);
|
|
593
|
-
const easeInCubic = (t) => t * t * t;
|
|
594
|
-
|
|
595
|
-
const animateTransition = (currentTime) => {
|
|
596
|
-
const elapsed = currentTime - startTime;
|
|
597
|
-
const progress = Math.min(elapsed / duration, 1);
|
|
598
|
-
|
|
599
|
-
// Easing différent selon la direction
|
|
600
|
-
const easedProgress = targetSpeed === 0 ?
|
|
601
|
-
easeOutCubic(progress) : easeInCubic(progress);
|
|
602
|
-
|
|
603
|
-
currentStep = startSpeed + speedDiff * easedProgress;
|
|
604
|
-
|
|
605
|
-
if (progress < 1) {
|
|
606
|
-
requestAnimationFrame(animateTransition);
|
|
607
|
-
} else {
|
|
608
|
-
currentStep = targetSpeed;
|
|
609
|
-
}
|
|
610
|
-
};
|
|
611
|
-
|
|
612
|
-
requestAnimationFrame(animateTransition);
|
|
613
|
-
};
|
|
614
|
-
|
|
615
|
-
element.addEventListener('mouseenter', function() {
|
|
616
|
-
transitionSpeed(0); // Ralentir jusqu'à 0
|
|
617
|
-
});
|
|
618
|
-
element.addEventListener('mouseleave', function() {
|
|
619
|
-
transitionSpeed(baseStep); // Revenir à la vitesse normale
|
|
620
|
-
});
|
|
621
|
-
}
|
|
622
541
|
}
|
|
623
542
|
});
|
|
624
543
|
};
|