@bebranded/bb-contents 1.0.53-beta → 1.0.54-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.
Files changed (2) hide show
  1. package/bb-contents.js +62 -57
  2. 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.53-beta
4
+ * @version 1.0.54-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.53-beta',
31
+ version: '1.0.54-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)
@@ -456,86 +456,91 @@
456
456
  console.log(`[bb-contents] Marquee ${index + 1}: INITIALISATION DE L'ANIMATION`);
457
457
 
458
458
  if (isVertical) {
459
- // Animation JavaScript pour le vertical - défilement infini smooth
459
+ // Animation JavaScript pour le vertical - version 1.0.33-beta
460
460
  const contentSize = finalHeight;
461
- const gapSize = parseInt(gap);
462
- const totalSize = contentSize + gapSize; // Taille d'un cycle complet
461
+ const totalSize = contentSize * 4 + parseInt(gap) * 3; // 4 copies au lieu de 3
463
462
 
464
463
  // Ajuster la hauteur du scrollContainer seulement si pas en mode auto
465
464
  if (!useAutoHeight) {
466
465
  scrollContainer.style.height = totalSize + 'px';
467
466
  }
468
467
 
469
- let currentPosition = direction === 'bottom' ? -totalSize : 0;
470
- const baseStep = (parseFloat(speed) * 2) / 60; // Vitesse de base
471
- let currentStep = baseStep;
472
- let isPaused = false;
473
- let animationId = null;
474
- let lastTime = 0;
468
+ let currentPosition = direction === 'bottom' ? -contentSize - parseInt(gap) : 0;
469
+ const step = (parseFloat(speed) * 2) / 60; // Vitesse différente
470
+ let isPaused = false;
475
471
 
476
- // Fonction d'animation JavaScript optimisée pour défilement infini
477
- const animate = (currentTime) => {
478
- if (!lastTime) lastTime = currentTime;
479
- const deltaTime = currentTime - lastTime;
480
- lastTime = currentTime;
481
-
482
- if (direction === 'bottom') {
483
- currentPosition += currentStep * (deltaTime / 16.67); // Normaliser à 60fps
484
- if (currentPosition >= 0) {
485
- currentPosition = -totalSize; // Reset smooth
486
- }
487
- } else {
488
- currentPosition -= currentStep * (deltaTime / 16.67);
489
- if (currentPosition <= -totalSize) {
490
- currentPosition = 0; // Reset smooth
472
+ // Fonction d'animation JavaScript
473
+ const animate = () => {
474
+ if (!isPaused) {
475
+ if (direction === 'bottom') {
476
+ currentPosition += step;
477
+ if (currentPosition >= 0) {
478
+ currentPosition = -contentSize - parseInt(gap);
479
+ }
480
+ } else {
481
+ currentPosition -= step;
482
+ if (currentPosition <= -contentSize - parseInt(gap)) {
483
+ currentPosition = 0;
484
+ }
491
485
  }
486
+
487
+ scrollContainer.style.transform = `translate3d(0px, ${currentPosition}px, 0px)`;
492
488
  }
493
-
494
- scrollContainer.style.transform = `translate3d(0px, ${currentPosition}px, 0px)`;
495
- animationId = requestAnimationFrame(animate);
496
- };
497
-
498
- // Démarrer l'animation
499
- animationId = requestAnimationFrame(animate);
489
+ requestAnimationFrame(animate);
490
+ };
491
+
492
+ // Démarrer l'animation
493
+ animate();
494
+
495
+ // Pause au survol simple
496
+ element.addEventListener('mouseenter', function() {
497
+ isPaused = true;
498
+ });
499
+ element.addEventListener('mouseleave', function() {
500
+ isPaused = false;
501
+ });
500
502
 
501
503
  // Marquee vertical créé avec animation JS
502
504
  } else {
503
- // Animation JavaScript pour l'horizontal (comme le vertical pour éviter les saccades)
505
+ // Animation JavaScript pour l'horizontal - version 1.0.33-beta
504
506
  const contentSize = finalWidth;
505
507
  const totalSize = contentSize * 4 + parseInt(gap) * 3;
506
508
  scrollContainer.style.width = totalSize + 'px';
507
509
 
508
510
  let currentPosition = direction === 'right' ? -contentSize - parseInt(gap) : 0;
509
- const baseStep = (parseFloat(speed) * 0.5) / 60; // Vitesse de base
510
- let currentStep = baseStep;
511
+ const step = (parseFloat(speed) * 0.5) / 60; // Vitesse réduite pour l'horizontal
511
512
  let isPaused = false;
512
- let animationId = null;
513
- let lastTime = 0;
514
513
 
515
- // Fonction d'animation JavaScript optimisée
516
- const animate = (currentTime) => {
517
- if (!lastTime) lastTime = currentTime;
518
- const deltaTime = currentTime - lastTime;
519
- lastTime = currentTime;
520
-
521
- if (direction === 'right') {
522
- currentPosition += currentStep * (deltaTime / 16.67); // Normaliser à 60fps
523
- if (currentPosition >= 0) {
524
- currentPosition = -contentSize - parseInt(gap);
525
- }
526
- } else {
527
- currentPosition -= currentStep * (deltaTime / 16.67);
528
- if (currentPosition <= -contentSize - parseInt(gap)) {
529
- currentPosition = 0;
514
+ // Fonction d'animation JavaScript
515
+ const animate = () => {
516
+ if (!isPaused) {
517
+ if (direction === 'right') {
518
+ currentPosition += step;
519
+ if (currentPosition >= 0) {
520
+ currentPosition = -contentSize - parseInt(gap);
521
+ }
522
+ } else {
523
+ currentPosition -= step;
524
+ if (currentPosition <= -contentSize - parseInt(gap)) {
525
+ currentPosition = 0;
526
+ }
530
527
  }
528
+
529
+ scrollContainer.style.transform = `translate3d(${currentPosition}px, 0px, 0px)`;
531
530
  }
532
-
533
- scrollContainer.style.transform = `translate3d(${currentPosition}px, 0px, 0px)`;
534
- animationId = requestAnimationFrame(animate);
531
+ requestAnimationFrame(animate);
535
532
  };
536
533
 
537
534
  // Démarrer l'animation
538
- animationId = requestAnimationFrame(animate);
535
+ animate();
536
+
537
+ // Pause au survol simple
538
+ element.addEventListener('mouseenter', function() {
539
+ isPaused = true;
540
+ });
541
+ element.addEventListener('mouseleave', function() {
542
+ isPaused = false;
543
+ });
539
544
 
540
545
  // Marquee horizontal créé avec animation JS
541
546
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bebranded/bb-contents",
3
- "version": "1.0.53-beta",
3
+ "version": "1.0.54-beta",
4
4
  "description": "Contenus additionnels français pour Webflow",
5
5
  "main": "bb-contents.js",
6
6
  "scripts": {