Lorsqu’on charge des images dans un script p5.js, ça se passe de façon asynchrone. C’est souvent une bonne chose car ça évite d’attendre. Mais parfois ça pose beaucoup de problèmes. Alors je cherchais depuis longtemps un moyen efficace d’être certaine que les images seraient entièrement chargées avant que la suite du script ne les utilise.
J’ai trouvé la solution grace à Perplexity, le moteur de recherche avec AI. Je lui ai demandé « what are the solutions which work for loading a lot of images in an array using p5js? », il m’a répondu avec des solutions banales (qui ne fonctionnent pas lorsque les images mettent du temps à charger). J’ai insisté en « lui disant » : « this doesn’t ensure that all images in the array are fully loaded. are there more robust solutions? ». Et là il m’a apporté la réponse que je ne trouvais pas ! Merci Perplexity !
J’utilise loadImage et une fonction « call back » qui incrémente un compteur (imagesLoaded) à chaque fois qu’une image est correctement chargée. Lorsque le compteur imagesLoaded contient la valeur indiquée au début dans imagesToLoad, c’est qu’on a chargé autant d’images qu’on en avait prévu. On est donc prêts à la suite !
La nouvelle extension Site Kit, de Google, permet enfin de connecter, rapidement et facilement, un site WordPress et les services Google tels que Google Analytics, Google Search Console, Speed Test. Elle intégre également Google Optimize, Google Tag Manager et Google Ads que je n’utilises pas.
J’ai découvert récemment l’intérêt de créer un site avec Google sites dans des circonstances où l’on souhaite partager simplement des documents avec un groupe de personnes. Et aujourd’hui, je viens de regarder la vidéo d’Olivier Margerand, de Digital Collab, qui nous explique comment créer un site web en 5 minutes avec Google Sites :
J’en retiens que c’est extraordinairement simple et rapide ! Il est possible de mettre en ligne des éléments de Google Suite de manière très simple. Mais aussi qu’on peut imaginer une infinité d’utilisations, comme par exemple la création d’un site pour une machine, afin de déclarer des opérations de maintenance ou suivre des fonctionnement simplement en scannant le QR code affiché sur la machine !
J’ai beaucoup apprécié les propos d’Olivier Margerand, toujours aussi percutant et juste. Par exemple :
Ce qui compte maintenant c’est l’intelligence qu’on va mettre derrière tout ça : qu’est-ce que ça peut apporter ? Qu’est-ce que ça peut aider à simplifier dans une entreprise, dans une équipe, dans un processus, avec nos clients, avec nos prospects avec nos fournisseurs ?
J’ai découvert l’application SnapCamera par une vidéo de l’excellent Cyrille CARTERET, dont la chaine FastLearner Academy recèle d’excellents tutoriels sur l’environnement Google.
Les instructions de Cyrille CARTERET sont très claires. Il faut tout simplement sélectionner la webcam SnapCamera plutôt que la webcam elle-même. C’est vrai dans google Meet, dans zoom et probablement d’autres applications.
La seule difficulté que j’ai eu est qu’il m’a fallu redémarrer windows deux fois avant que la webcam snapCamera devienne accessible.
Nous voyons ici, dans ce sixème article de la série p5.js mes "briques" de connaissance, comment créer un fichier et proposer à l’utilisateur de l’enregistrer. Nous recueillons des données (sur la base de la brique 5) et nous créons deux fichier texte au clic de la souris dans le canevas.
un fichier avec toutes les chaines de caractères de l’array (tableau) croppedUrl. Ce fichier est nommé croppedURLs.txt.
un fichier avec toutes les chaines de caractères de l’array (tableau) imgUrl. Ce fichier est nommé fullURLs.txt.
On utilise ici la fonction saveStrings() de p5.js. J’aurais également pu utiliser la fonction save(), de la même manière exactement. Dans d’autres circonstances on pourra s’intéresser aux fonctions : saveJSON(), saveTable(), voire saveCanvas() ou saveFrames().
Et maintenant ?
Et voilà nous avons une cinquième brique ! Les autres briques sont et seront publiées dans cette même série, p5.js mes "briques" de connaissance.
Commentaires récents