@bebranded/bb-contents 1.0.48-beta → 1.0.49-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 +70 -7
- 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.49-beta
|
|
5
5
|
* @author BeBranded
|
|
6
6
|
* @license MIT
|
|
7
7
|
* @website https://www.bebranded.xyz
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
|
|
23
23
|
// Configuration
|
|
24
24
|
const config = {
|
|
25
|
-
version: '1.0.
|
|
25
|
+
version: '1.0.49-beta',
|
|
26
26
|
debug: false, // Debug désactivé
|
|
27
27
|
prefix: 'bb-', // utilisé pour générer les sélecteurs (data-bb-*)
|
|
28
28
|
youtubeEndpoint: null, // URL du worker YouTube (à définir par l'utilisateur)
|
|
@@ -253,13 +253,31 @@
|
|
|
253
253
|
if (scope.closest && scope.closest('[data-bb-disable]')) return;
|
|
254
254
|
const elements = scope.querySelectorAll(bbContents._attrSelector('marquee'));
|
|
255
255
|
|
|
256
|
-
|
|
256
|
+
// Debug: Log du nombre d'éléments marquee trouvés
|
|
257
|
+
console.log(`[bb-contents] Marquee init: ${elements.length} éléments trouvés`);
|
|
258
|
+
|
|
259
|
+
elements.forEach(function(element, index) {
|
|
260
|
+
// Debug: Log de chaque élément
|
|
261
|
+
console.log(`[bb-contents] Marquee ${index + 1}:`, {
|
|
262
|
+
element: element,
|
|
263
|
+
alreadyProcessed: element.bbProcessed,
|
|
264
|
+
hasYouTubeProcessed: element.hasAttribute('data-bb-youtube-processed'),
|
|
265
|
+
hasMarqueeProcessed: element.hasAttribute('data-bb-marquee-processed'),
|
|
266
|
+
attributes: {
|
|
267
|
+
speed: element.getAttribute('bb-marquee-speed'),
|
|
268
|
+
direction: element.getAttribute('bb-marquee-direction'),
|
|
269
|
+
orientation: element.getAttribute('bb-marquee-orientation'),
|
|
270
|
+
height: element.getAttribute('bb-marquee-height')
|
|
271
|
+
}
|
|
272
|
+
});
|
|
257
273
|
// Vérifier si l'élément a déjà été traité par un autre module
|
|
258
274
|
if (element.bbProcessed || element.hasAttribute('data-bb-youtube-processed')) {
|
|
259
275
|
// Élément marquee déjà traité par un autre module, ignoré
|
|
276
|
+
console.log(`[bb-contents] Marquee ${index + 1}: IGNORÉ (déjà traité)`);
|
|
260
277
|
return;
|
|
261
278
|
}
|
|
262
279
|
element.bbProcessed = true;
|
|
280
|
+
console.log(`[bb-contents] Marquee ${index + 1}: TRAITEMENT EN COURS`);
|
|
263
281
|
|
|
264
282
|
// Récupérer les options
|
|
265
283
|
const speed = bbContents._getAttr(element, 'bb-marquee-speed') || '100';
|
|
@@ -336,10 +354,14 @@
|
|
|
336
354
|
|
|
337
355
|
// Fonction pour initialiser l'animation avec vérification robuste des dimensions
|
|
338
356
|
const initAnimation = (retryCount = 0) => {
|
|
357
|
+
console.log(`[bb-contents] Marquee ${index + 1}: initAnimation tentative ${retryCount + 1}`);
|
|
358
|
+
|
|
339
359
|
// Vérifier que les images sont chargées
|
|
340
360
|
const images = mainBlock.querySelectorAll('img');
|
|
341
361
|
const imagesLoaded = Array.from(images).every(img => img.complete && img.naturalHeight > 0);
|
|
342
362
|
|
|
363
|
+
console.log(`[bb-contents] Marquee ${index + 1}: Images chargées: ${imagesLoaded} (${images.length} images)`);
|
|
364
|
+
|
|
343
365
|
// Attendre que le contenu soit dans le DOM et que les images soient chargées
|
|
344
366
|
requestAnimationFrame(() => {
|
|
345
367
|
// Calcul plus robuste des dimensions
|
|
@@ -347,6 +369,13 @@
|
|
|
347
369
|
const contentWidth = rect.width || mainBlock.offsetWidth;
|
|
348
370
|
const contentHeight = rect.height || mainBlock.offsetHeight;
|
|
349
371
|
|
|
372
|
+
console.log(`[bb-contents] Marquee ${index + 1}: Dimensions calculées:`, {
|
|
373
|
+
rect: rect,
|
|
374
|
+
contentWidth: contentWidth,
|
|
375
|
+
contentHeight: contentHeight,
|
|
376
|
+
isVertical: isVertical
|
|
377
|
+
});
|
|
378
|
+
|
|
350
379
|
// Pour les marquees verticaux, utiliser la largeur du parent si nécessaire
|
|
351
380
|
let finalWidth = contentWidth;
|
|
352
381
|
let finalHeight = contentHeight;
|
|
@@ -362,21 +391,49 @@
|
|
|
362
391
|
|
|
363
392
|
// Vérifications robustes avant initialisation
|
|
364
393
|
const hasValidDimensions = (isVertical && finalHeight > 50) || (!isVertical && finalWidth > 50);
|
|
394
|
+
const hasContent = mainBlock.innerHTML.trim().length > 0;
|
|
365
395
|
const maxRetries = 8; // Plus de tentatives pour attendre les images
|
|
366
396
|
|
|
367
|
-
//
|
|
368
|
-
|
|
397
|
+
// Fallback: si pas de dimensions valides mais qu'il y a du contenu, forcer l'initialisation
|
|
398
|
+
const shouldForceInit = !hasValidDimensions && hasContent && retryCount >= 3;
|
|
399
|
+
|
|
400
|
+
console.log(`[bb-contents] Marquee ${index + 1}: Vérifications:`, {
|
|
401
|
+
hasValidDimensions: hasValidDimensions,
|
|
402
|
+
hasContent: hasContent,
|
|
403
|
+
imagesLoaded: imagesLoaded,
|
|
404
|
+
retryCount: retryCount,
|
|
405
|
+
maxRetries: maxRetries,
|
|
406
|
+
shouldForceInit: shouldForceInit
|
|
407
|
+
});
|
|
408
|
+
|
|
409
|
+
// Si pas de contenu valide ou images pas chargées, réessayer (sauf si on force)
|
|
410
|
+
if ((!hasValidDimensions || !imagesLoaded) && !shouldForceInit) {
|
|
369
411
|
if (retryCount < maxRetries) {
|
|
370
412
|
const delay = 300 + retryCount * 200; // Délais plus longs pour attendre les images
|
|
413
|
+
console.log(`[bb-contents] Marquee ${index + 1}: RETRY dans ${delay}ms (dimensions: ${hasValidDimensions}, images: ${imagesLoaded})`);
|
|
371
414
|
// Contenu/images non prêts, nouvelle tentative
|
|
372
415
|
setTimeout(() => initAnimation(retryCount + 1), delay);
|
|
373
416
|
return;
|
|
374
417
|
} else {
|
|
375
418
|
// Échec d'initialisation après plusieurs tentatives
|
|
419
|
+
console.log(`[bb-contents] Marquee ${index + 1}: ÉCHEC après ${maxRetries} tentatives`);
|
|
376
420
|
return;
|
|
377
421
|
}
|
|
378
422
|
}
|
|
379
423
|
|
|
424
|
+
if (shouldForceInit) {
|
|
425
|
+
console.log(`[bb-contents] Marquee ${index + 1}: FORÇAGE DE L'INITIALISATION (fallback)`);
|
|
426
|
+
// Utiliser des dimensions par défaut si les vraies dimensions ne sont pas disponibles
|
|
427
|
+
if (isVertical && finalHeight <= 50) {
|
|
428
|
+
finalHeight = 200; // Hauteur par défaut pour vertical
|
|
429
|
+
}
|
|
430
|
+
if (!isVertical && finalWidth <= 50) {
|
|
431
|
+
finalWidth = 300; // Largeur par défaut pour horizontal
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
|
|
435
|
+
console.log(`[bb-contents] Marquee ${index + 1}: INITIALISATION DE L'ANIMATION`);
|
|
436
|
+
|
|
380
437
|
if (isVertical) {
|
|
381
438
|
// Animation JavaScript pour le vertical
|
|
382
439
|
const contentSize = finalHeight;
|
|
@@ -553,11 +610,17 @@
|
|
|
553
610
|
if (document.readyState !== 'complete') {
|
|
554
611
|
// Attente de window.load pour initialiser le marquee
|
|
555
612
|
window.addEventListener('load', () => {
|
|
556
|
-
setTimeout(() =>
|
|
613
|
+
setTimeout(() => {
|
|
614
|
+
initAnimation(0);
|
|
615
|
+
console.log(`[bb-contents] Marquee ${index + 1}: Animation démarrée`);
|
|
616
|
+
}, initDelay);
|
|
557
617
|
});
|
|
558
618
|
} else {
|
|
559
619
|
// window.load déjà déclenché, initialiser directement
|
|
560
|
-
setTimeout(() =>
|
|
620
|
+
setTimeout(() => {
|
|
621
|
+
initAnimation(0);
|
|
622
|
+
console.log(`[bb-contents] Marquee ${index + 1}: Animation démarrée`);
|
|
623
|
+
}, initDelay);
|
|
561
624
|
}
|
|
562
625
|
});
|
|
563
626
|
|