Problème chargement de page Flickr

[BaguetteAgile]

Voici le lien vers le site
https://justfriends.netlify.com/
au chargement de la page Diaporama, le container HTML reste blanc...
il faut Recharger la page manuellement pour voir les photos.

une idée pour résoudre ce petit problème ?

Merci

@lexoyo

---

Here is the link to the site
https://justfriends.netlify.com/
when loading the Slideshow page, the HTML container remains blank ...
you have to reload the page manually to see the pictures.

an idea to solve this little problem?

Thank you

[lexoyo]

Ok, il se passe un truc étrange, qui doit etre fait par le diaporama que tu utilises
Il rajoute plein de <script async="" src="https://widgets.flickr.com/embedr/embedr-4110feef4aefd18270192d8aeba3ff41.js"></script>
Tu peux en dire plus sur le diaporama que tu utilises?

[BaguetteAgile]

Ben en faite j'ai suivis le tuto que tu as fait via Webinar ... je copie coller le code et voila le résultat.. rien de plus...
a mon avis le site Flickr ajoute des demandes via le css...
(je ne suis pas développeur ...)

[lexoyo]

ah :-/
tu ne veux pas utiliser le composant diaporama inclus dans silex ? (menu +)

[BaguetteAgile]

Oui oui, j'y ai jeter un œil, mais j'ai environ 50 photos à diffuser sur le site et certainement d'autre qui vont suivre, et il me semble que l'on doit sélectionner les photos une par une ?
Existe t'il une solution pour sélectionner mon dossier directement sur Flickr, comme cela je n'alourdis pas trop mon site...
ou alors inclure un lien vers mon dossier Flickr aprés quelques clics par exemple...

Je me penche sur le sujet demain, et je reviens vers toi @lexoyo

[lexoyo]

Ah ok je comprends
Je vais debuguer ton code alors

[lexoyo]

Quelques remarques et questions:

• La photo "photogroupe" de l'accueil, il faut la mettre en "background image" plutot qu'une "image", pour que ca se redimmentionne correctement quand tu l'étires en css. Et la photo contient des caracteres chelous que tu devrais enlever, car visiblement silex n'aime pas (c'est un bug, je le note). Tu peux tester avec la preview "responsize"
  

• tu n'as pas utilisé de sections, tu as tout fait a la main, j'aimerais savoir si c'etait galère et pourquoi ne pas utiliser de sections? Peut etre est-ce mal documentéo ou pas pratique?

[lexoyo]

J'ai fix un probleme dans silex qui changeait l'iframe en partant du principe qu'elle avait un src
2ccc59f

Et j'ai changé ton code pour que le script de flickr soit ajouté uniquement quand on arrive sur la bonne page, et pas 2 fois, et seulement quand on est en "silex-runtime" (en dehors de l'éditeur) :

            <script>
                // remove useless scripts previously created by flickr (last time the file was opened)
                $('script[src^="https://widgets.flickr.com/"]').remove();
                $('script[src^="https://embedr.flickr.com/assets/embedr-loader.js"]').remove();
              var pagedContainer = document.currentScript.closest('.paged-element');
              var flickrDone = false;
              $('body.silex-runtime').on('pageChanged', function (event, pageName) {
                if(!flickrDone && (!pagedContainer || $(pagedContainer).hasClass(pageName))) {
                  $('body.silex-runtime').append('<script async="" src="//embedr.flickr.com/assets/client-code.js" charset="utf-8"></scr' + 'ipt>');
                  flickrDone = true;
                }
              });
            </script>
            <p>Diaporama Just-Friends 2017</p>
            <a data-flickr-embed="true" href="https://www.flickr.com/photos/141930347@N02/albums/72157688805882072" title="Just-Friends en 2017">
                <img src="https://farm5.staticflickr.com/4735/39350048281_bd20945d13_z.jpg" alt="Just-Friends en 2017" width="100%">
            </a>

Par contre toutes plein d'images sont introuvables car silex les cherche dans "Images" alors qu'elles sont a la racine du site... Tu as du les déplacer, je te suggere de les remettre dans "./Images/"

N'hésites pas si tu as des questions

PS: ca serait bien de mettre ce nouveau code ou un lien vers cette issue là ou tu as trouvé un tuto?

[BaguetteAgile]

Bonjour Mr Alex ;) J'ai commencer le projet sur page blanche et ainsi de suite le site c'est construit , car j'avais pas trop envie de commencer le site via une Template. Pour la mise en page du site pas de problème majeur avec Silex, en suivant tes tutos sa passe pour les codes CSS ;) par contre, je rencontre des soucis sur la mise en page pour les Tablettes ( pour les Smartphones via Silex OK ) donc je regarde sur le net les "Medias Query" , ben là, je n'arrive pas avec les "Points de ruptures" ( différents écrans ) ... je rencontre également des soucis avec les ( z-index: ... ; ) Ton Débugage pour le diaporama fonctionne super Merci. ( Si dans l'avenir je remets un diaporama via Flickr est-ce que je dois faire appel a toi ? ) Tu m'as conseillé, de mettre la "photogroupe" en Container, ce que j'ai fait ( j'ai du retravaillé la photo ... ) mais il me semble que lors de la "Réduction d'écran pour simuler le "Responsive" , le bloc Container ne s'adapte pas a la page, arrivé un moment donné, la photo reste fixe et je perds un partie de l'image. Encore Merci pour ton engagement, c'est cool ;) A bientôt pour la suite du développement du projet. BaguetteAgile ;) Sent with [ProtonMail](https://protonmail.com) Secure Email.

…

-------- Original Message --------

On 3 février 2018 5:21 PM, Alex Hoyau ***@***.***> wrote: J'ai fix un probleme dans silex qui changeait l'iframe en partant du principe qu'elle avait un src 2ccc59f Et j'ai changé ton code pour que le script de flickr soit ajouté uniquement quand on arrive sur la bonne page, et pas 2 fois, et seulement quand on est en "silex-runtime" (en dehors de l'éditeur) : <script> // remove useless scripts previously created by flickr (last time the file was opened) $('script[src^="https://widgets.flickr.com/"]').remove(); $('script[src^="https://embedr.flickr.com/assets/embedr-loader.js"]').remove(); var pagedContainer = document.currentScript.closest('.paged-element'); var flickrDone = false; $('body.silex-runtime').on('pageChanged', function (event, pageName) { if(!flickrDone && (!pagedContainer || $(pagedContainer).hasClass(pageName))) { $('body.silex-runtime').append('<script async="" src="//embedr.flickr.com/assets/client-code.js" charset="utf-8"></scr' + 'ipt>'); flickrDone = true; } }); </script> <p>Diaporama Just-Friends 2017</p> <a data-flickr-embed="true" ***@***.***/albums/72157688805882072" title="Just-Friends en 2017"> <img src="https://farm5.staticflickr.com/4735/39350048281_bd20945d13_z.jpg" alt="Just-Friends en 2017" width="100%"> </a> Par contre toutes plein d'images sont introuvables car silex les cherche dans "Images" alors qu'elles sont a la racine du site... Tu as du les déplacer, je te suggere de les remettre dans "./Images/" N'hésites pas si tu as des questions PS: ca serait bien de mettre ce nouveau code ou un lien vers cette issue là ou tu as trouvé un tuto? — You are receiving this because you authored the thread. Reply to this email directly, [view it on GitHub](#682 (comment)), or [mute the thread](https://github.com/notifications/unsubscribe-auth/Ah8uH4e6LrMO1yiXwAnsyEU769gnK9F5ks5tRId8gaJpZM4RvqI-).