@bebranded/bb-contents 1.0.63-beta → 1.0.64-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 +61 -17
  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.63-beta
4
+ * @version 1.0.64-beta
5
5
  * @author BeBranded
6
6
  * @license MIT
7
7
  * @website https://www.bebranded.xyz
@@ -34,8 +34,8 @@
34
34
 
35
35
  // Configuration
36
36
  const config = {
37
- version: '1.0.63-beta',
38
- debug: false, // Debug désactivé
37
+ version: '1.0.64-beta',
38
+ debug: true, // Debug activé pour diagnostic
39
39
  prefix: 'bb-', // utilisé pour générer les sélecteurs (data-bb-*)
40
40
  youtubeEndpoint: null, // URL du worker YouTube (à définir par l'utilisateur)
41
41
  i18n: {
@@ -265,26 +265,36 @@
265
265
  if (scope.closest && scope.closest('[data-bb-disable]')) return;
266
266
  const elements = scope.querySelectorAll(bbContents._attrSelector('marquee'));
267
267
 
268
+ console.log('🔍 [DEBUG MARQUEE] DÉBUT INITIALISATION');
269
+ console.log('🔍 [DEBUG MARQUEE] Éléments trouvés:', elements.length);
270
+ console.log('🔍 [DEBUG MARQUEE] Éléments:', elements);
271
+
268
272
  // Initialisation séquentielle de haut en bas - Hero en priorité
269
273
  let currentIndex = 0;
270
274
 
271
275
  const initNextMarquee = () => {
276
+ console.log(`🔍 [DEBUG MARQUEE] initNextMarquee appelé - currentIndex: ${currentIndex}/${elements.length}`);
277
+
272
278
  if (currentIndex >= elements.length) {
273
- bbContents.utils.log('Tous les marquees initialisés:', elements.length, 'éléments');
279
+ console.log('✅ [DEBUG MARQUEE] TOUS LES MARQUEES INITIALISÉS:', elements.length, 'éléments');
274
280
  return;
275
281
  }
276
282
 
277
283
  const element = elements[currentIndex];
284
+ console.log(`🔍 [DEBUG MARQUEE] Traitement marquee ${currentIndex + 1}:`, element);
285
+ console.log(`🔍 [DEBUG MARQUEE] bbProcessed:`, element.bbProcessed);
286
+ console.log(`🔍 [DEBUG MARQUEE] data-bb-youtube-processed:`, element.hasAttribute('data-bb-youtube-processed'));
278
287
  currentIndex++;
279
288
 
280
289
  // Vérifier si l'élément a déjà été traité par un autre module
281
290
  if (element.bbProcessed || element.hasAttribute('data-bb-youtube-processed')) {
282
- bbContents.utils.log('Élément marquee déjà traité par un autre module, ignoré:', element);
291
+ console.log('⚠️ [DEBUG MARQUEE] Élément déjà traité, passage au suivant');
283
292
  // Passer au suivant immédiatement
284
293
  setTimeout(initNextMarquee, 0);
285
294
  return;
286
295
  }
287
296
  element.bbProcessed = true;
297
+ console.log('✅ [DEBUG MARQUEE] Élément marqué comme traité');
288
298
 
289
299
  // Récupérer les options
290
300
  const speed = bbContents._getAttr(element, 'bb-marquee-speed') || '100';
@@ -294,6 +304,10 @@
294
304
  const orientation = bbContents._getAttr(element, 'bb-marquee-orientation') || 'horizontal';
295
305
  const height = bbContents._getAttr(element, 'bb-marquee-height') || '300';
296
306
  const minHeight = bbContents._getAttr(element, 'bb-marquee-min-height');
307
+
308
+ console.log(`🔍 [DEBUG MARQUEE] Options récupérées:`, {
309
+ speed, direction, pauseOnHover, gap, orientation, height, minHeight
310
+ });
297
311
 
298
312
  // Sauvegarder le contenu original
299
313
  const originalHTML = element.innerHTML;
@@ -360,26 +374,41 @@
360
374
 
361
375
  // Fonction pour initialiser l'animation avec retry amélioré - Version 1.0.37-beta robuste
362
376
  const initAnimation = (retryCount = 0) => {
377
+ console.log(`🔍 [DEBUG MARQUEE] initAnimation appelé - retryCount: ${retryCount}`);
363
378
  // Attendre que le contenu soit dans le DOM
364
379
  requestAnimationFrame(() => {
365
380
  const contentWidth = mainBlock.offsetWidth;
366
381
  const contentHeight = mainBlock.offsetHeight;
367
382
 
368
- // Debug amélioré
369
- bbContents.utils.log('Debug - Largeur du contenu:', contentWidth, 'px', 'Hauteur:', contentHeight, 'px', 'Enfants:', mainBlock.children.length, 'Vertical:', isVertical, 'Direction:', direction, 'Tentative:', retryCount + 1);
383
+ console.log(`🔍 [DEBUG MARQUEE] Dimensions calculées:`, {
384
+ contentWidth, contentHeight,
385
+ children: mainBlock.children.length,
386
+ isVertical, direction,
387
+ retryCount: retryCount + 1
388
+ });
370
389
 
371
390
  // Vérifier que les images sont chargées
372
391
  const images = mainBlock.querySelectorAll('img');
373
392
  const imagesLoaded = Array.from(images).every(img => img.complete && img.naturalHeight > 0);
374
393
 
394
+ console.log(`🔍 [DEBUG MARQUEE] Images:`, {
395
+ total: images.length,
396
+ loaded: imagesLoaded,
397
+ images: Array.from(images).map(img => ({
398
+ complete: img.complete,
399
+ naturalHeight: img.naturalHeight,
400
+ src: img.src
401
+ }))
402
+ });
403
+
375
404
  // Si pas de contenu, réessayer avec délai progressif
376
405
  if ((isVertical && contentHeight === 0) || (!isVertical && contentWidth === 0)) {
377
406
  if (retryCount < 8) { // Plus de tentatives
378
- bbContents.utils.log('Contenu non prêt, nouvelle tentative dans', (200 + retryCount * 100), 'ms');
407
+ console.log(`⚠️ [DEBUG MARQUEE] Contenu non prêt, retry ${retryCount + 1}/8 dans ${200 + retryCount * 100}ms`);
379
408
  setTimeout(() => initAnimation(retryCount + 1), 200 + retryCount * 100);
380
409
  return;
381
410
  } else {
382
- bbContents.utils.log('Échec d\'initialisation après 8 tentatives');
411
+ console.log('❌ [DEBUG MARQUEE] Échec d\'initialisation après 8 tentatives');
383
412
  return;
384
413
  }
385
414
  }
@@ -387,11 +416,11 @@
387
416
  // Pour le vertical, s'assurer qu'on a une hauteur minimale
388
417
  if (isVertical && contentHeight < 50) {
389
418
  if (retryCount < 8) { // Plus de tentatives
390
- bbContents.utils.log('Hauteur insuffisante pour le marquee vertical (' + contentHeight + 'px), nouvelle tentative dans', (200 + retryCount * 100), 'ms');
419
+ console.log(`⚠️ [DEBUG MARQUEE] Hauteur insuffisante (${contentHeight}px), retry ${retryCount + 1}/8`);
391
420
  setTimeout(() => initAnimation(retryCount + 1), 200 + retryCount * 100);
392
421
  return;
393
422
  } else {
394
- bbContents.utils.log('Échec d\'initialisation - hauteur insuffisante après 8 tentatives');
423
+ console.log('❌ [DEBUG MARQUEE] Échec - hauteur insuffisante après 8 tentatives');
395
424
  return;
396
425
  }
397
426
  }
@@ -399,20 +428,23 @@
399
428
  // Vérifier que les images sont chargées
400
429
  if (!imagesLoaded && images.length > 0) {
401
430
  if (retryCount < 8) { // Plus de tentatives
402
- bbContents.utils.log('Images non chargées, nouvelle tentative dans', (200 + retryCount * 100), 'ms');
431
+ console.log(`⚠️ [DEBUG MARQUEE] Images non chargées, retry ${retryCount + 1}/8`);
403
432
  setTimeout(() => initAnimation(retryCount + 1), 200 + retryCount * 100);
404
433
  return;
405
434
  } else {
406
- bbContents.utils.log('Échec d\'initialisation - images non chargées après 8 tentatives');
435
+ console.log('❌ [DEBUG MARQUEE] Échec - images non chargées après 8 tentatives');
407
436
  return;
408
437
  }
409
438
  }
410
439
 
411
440
  if (isVertical) {
441
+ console.log('✅ [DEBUG MARQUEE] INITIALISATION VERTICALE');
412
442
  // Animation JavaScript pour le vertical
413
443
  const contentSize = contentHeight;
414
444
  const totalSize = contentSize * 4 + parseInt(gap) * 3; // 4 copies au lieu de 3
415
445
 
446
+ console.log(`🔍 [DEBUG MARQUEE] Vertical - contentSize: ${contentSize}px, totalSize: ${totalSize}px`);
447
+
416
448
  // Ajuster la hauteur du scrollContainer seulement si pas en mode auto
417
449
  if (!useAutoHeight) {
418
450
  scrollContainer.style.height = totalSize + 'px';
@@ -422,6 +454,8 @@
422
454
  const step = (parseFloat(speed) * 2) / 60; // Vitesse différente
423
455
  let isPaused = false;
424
456
 
457
+ console.log(`🔍 [DEBUG MARQUEE] Vertical - currentPosition: ${currentPosition}, step: ${step}, direction: ${direction}`);
458
+
425
459
  // Fonction d'animation JavaScript
426
460
  const animate = () => {
427
461
  if (!isPaused) {
@@ -445,7 +479,7 @@
445
479
  // Démarrer l'animation
446
480
  animate();
447
481
 
448
- bbContents.utils.log('Marquee vertical créé avec animation JS - direction:', direction, 'taille:', contentSize + 'px', 'total:', totalSize + 'px', 'hauteur-wrapper:', height + 'px');
482
+ console.log('✅ [DEBUG MARQUEE] Marquee vertical créé avec animation JS');
449
483
 
450
484
  // Pause au survol
451
485
  if (pauseOnHover === 'true') {
@@ -459,15 +493,20 @@
459
493
 
460
494
  // Marquee vertical créé avec animation JS
461
495
  } else {
496
+ console.log('✅ [DEBUG MARQUEE] INITIALISATION HORIZONTALE');
462
497
  // Animation JavaScript pour l'horizontal (comme le vertical pour éviter les saccades)
463
498
  const contentSize = contentWidth;
464
499
  const totalSize = contentSize * 4 + parseInt(gap) * 3;
465
500
  scrollContainer.style.width = totalSize + 'px';
466
501
 
502
+ console.log(`🔍 [DEBUG MARQUEE] Horizontal - contentSize: ${contentSize}px, totalSize: ${totalSize}px`);
503
+
467
504
  let currentPosition = direction === 'right' ? -contentSize - parseInt(gap) : 0;
468
505
  const step = (parseFloat(speed) * 0.5) / 60; // Vitesse réduite pour l'horizontal
469
506
  let isPaused = false;
470
507
 
508
+ console.log(`🔍 [DEBUG MARQUEE] Horizontal - currentPosition: ${currentPosition}, step: ${step}, direction: ${direction}`);
509
+
471
510
  // Fonction d'animation JavaScript
472
511
  const animate = () => {
473
512
  if (!isPaused) {
@@ -491,7 +530,7 @@
491
530
  // Démarrer l'animation
492
531
  animate();
493
532
 
494
- bbContents.utils.log('Marquee horizontal créé avec animation JS - direction:', direction, 'taille:', contentSize + 'px', 'total:', totalSize + 'px');
533
+ console.log('✅ [DEBUG MARQUEE] Marquee horizontal créé avec animation JS');
495
534
 
496
535
  // Pause au survol
497
536
  if (pauseOnHover === 'true') {
@@ -511,15 +550,20 @@
511
550
  // Démarrer l'initialisation avec délai adaptatif - Initialisation séquentielle
512
551
  const baseDelay = isVertical ? 800 : 400; // Délais fixes selon le type
513
552
 
514
- bbContents.utils.log(`Marquee ${currentIndex} (${isVertical ? 'vertical' : 'horizontal'}) initialisé dans ${baseDelay}ms`);
553
+ console.log(`🔍 [DEBUG MARQUEE] Marquee ${currentIndex} (${isVertical ? 'vertical' : 'horizontal'}) initialisé dans ${baseDelay}ms`);
515
554
  setTimeout(() => {
555
+ console.log(`🔍 [DEBUG MARQUEE] Démarrage initAnimation pour marquee ${currentIndex}`);
516
556
  initAnimation(0);
517
557
  // Après initialisation, passer au marquee suivant
518
- setTimeout(initNextMarquee, 100); // Petit délai entre les marquees
558
+ setTimeout(() => {
559
+ console.log(`🔍 [DEBUG MARQUEE] Passage au marquee suivant après ${currentIndex}`);
560
+ initNextMarquee();
561
+ }, 100); // Petit délai entre les marquees
519
562
  }, baseDelay);
520
563
  };
521
564
 
522
565
  // Démarrer l'initialisation séquentielle
566
+ console.log('🔍 [DEBUG MARQUEE] Démarrage de l\'initialisation séquentielle');
523
567
  initNextMarquee();
524
568
  }
525
569
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bebranded/bb-contents",
3
- "version": "1.0.63-beta",
3
+ "version": "1.0.64-beta",
4
4
  "description": "Contenus additionnels français pour Webflow",
5
5
  "main": "bb-contents.js",
6
6
  "scripts": {