Omagad, il y en a tellement ... Ça devient impossible de faire la sécu d'une appli soi même... trop complexe.

Faire un lecteur audio custom en CSS+JS

Aujourd'hui, je vous passe un petit bout de code que j'ai fait autant par défi personnel qu'avec l'objectif de l'autonomie pédagogique

J'ai pas les mots

Une petit appli qui génère une grille de mots-mélés à partir du titre et de la liste de mots: on peut l'utiliser via la GUI minimale...

... ou en «API» avec les arguments GET suivants:

• title: le titre (opt.)
• mots : les mots séparés par une virgule
• size : la taille de la grille
• list : la liste de mots à trouver (ou n'importe quelle autre consigne)
• download: télécharger l'appli pour auto hébergement (télécharger )

Et ça fait des chocapics

ça donne ça :

Ce matin, en écoutant France Inter, j'entends la personne expliquer que, selon des sondages de mes couilles, Marine Lepen pourrait gagner les élections si elles avaient lieu aujourd'hui.

*: Phrase d'Haroun... https://www.youtube.com/channel/UCKeL_a8Pu3bdt251ICPV8bA

Même si je suis plutôt d'accord sur la gestion déplorable de la pandémie par notre gouvernement en particulier (plus intéressé par l'économie que par la santé), je persiste à penser qu'il faut comparer ce qui est comparable:

Nouvelle zélande:

• 4 926 551 d'habitants
• superficie 268 680 km2
• Densité 18 hab./km2

France:

• 67 848 156 d'habitants
• superficie 672 051 km2
• Densité 107,2N 4 hab./km2

Je n'ai pas pris le temps de comparer les PIB/Tx de chômage/dette publique/industries/agriculture etc qui sont également des facteurs à prendre en compte.

Mon but ici est d'éviter l'écueil du biais de confirmation... C'est difficile de ne comparer que sur la base de confine/ne confine pas... Si on se lance dans une comparaison, je pense qu'il faut prendre en compte tous les paramètres...

J'adore Bobby McFerrin... A partir de rien, il joue avec le public. <3

Omagad, c'te mine d'or...

• https://devhints.io/ pour des cheatsheets
• https://learnxinyminutes.com/ pour des rappels en une page de l'essentiel d'un langage J'ai appris qu'en Go il y a un type de variable complex128 qui permet un truc du genre c := 3 + 4i ... voilà qui serait pratique en python au lycée de ma fille [blague personnelle]
• https://htaccess.madewithlove.be/ pour tester des htaccess
• https://squoosh.app/ pour compresser les images
• https://www.photopea.com/ pour la retouche d'images vite fait quand t'es pas à la maison
• https://carbon.now.sh/ pour faire des images esthétiques de ton code (même si je ne saisis pas bien le concept d'une capture d'écran pour du code...)
• https://devdocs.io/ : connu mais toujours bon à rappeler
• https://devtools.best/ Base Converter,Base64 Encoder/Decoder, Emoji Picker Tool, HTML Entities Encoder/Decoder, Json Prettier, Lorem Ipsum, Text Comparison Tool, Text Effects tool, Text Hash Generator, Text Statistics, UUID Generator, Url Encoder/Decoder

Je partage grandement ce constat: il faudrait maîtriser docker/nodejs/React/mon cul sur la commode pour pouvoir utiliser telle ou telle appli... au fur et à mesure, les techno nécessaires se multiplient avec pour conséquence une complication POUR L'UTILISATEUR FINAL.

Tant qu'une appli est réservée à une minorité de connaisseurs techniciens, elle ne pourra jamais convaincre d'abandonner les GAFAM et sa diffusion s'en verra limitée... C'est pas demain qu'on rejoindra les Anonymous.

Je ne connaissais pas ses vidéos... j'ai ri tout le long.

«Que se passe-t-il lorsque l'on largue un Béarnais un peu taquin dans la jungle ?»

Wow... la propriété CSS Fliter, qui permet d'appliquer des filtres sur un élément (blur, grayscale etc) permet apparemment l'utilisation de filtres SVG inline... le truc de fou.

C'est tricky, pas élégant, un peu sale mais apparemment assez puissant puisqu'on peut même appliquer des filtres de déformation...

img {
  filter: url('data:image/svg+xml,
    <svg xmlns="http://www.w3.org/2000/svg">
      <filter id="waves" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="linearRGB">
        <feTurbulence type="turbulence" baseFrequency="0.01 0.01" numOctaves="1" seed="1" stitchTiles="noStitch" result="turbulence" />
        <feDisplacementMap in="SourceGraphic" in2="turbulence" scale="20" xChannelSelector="G" yChannelSelector="A" result="displacementMap" />
      </filter>
    </svg>#waves')
  ;
}

Très intéressant, ça: une appli opensource et autohébergeable (à base de React) pour réaliser des graphiques dans un style fait main du meilleur effet... En plus, il semblerait qu'on puisse travailler en mode collaboratif.

En plus, il y a plein de packs de graphismes à ajouter depuis le dépôt https://libraries.excalidraw.com/

Il y a quelques jours, le lustre de la salle à manger à pété (le transfo) et du coup, on s'est dit que je pouvais faire le frère de celui que j'avais mis dans le salon... (https://warriordudimanche.net/article1363/et-lumiere-fut-gag)

Toujours à base de branche de saule coupé dans le petit bois près de chez moi.

Une alternative à Waifux2 dont j'avais parlé ici (http://waifu2x.udp.jp/) SPOILER: Waifu est mieux. Test ci-dessous

(...)

@SammyFisher : C'est exactement ce que j'en ai pensé: il faut le prendre comme une pure fiction, voire une uchronie idéaliste. Ça ne me semble ni bien ni mal en soi... tant que le postulat de départ est bien clair pour tout le monde.

Sans compter que j'ai trouvé le tout assez fade et sans charme.

Donner un style NES à un site ou une appli web ? Voilà une feuille de style toute prête...

J'ai beau essayer plein de jeux différents, rien n'y fait: ça ne vaut pas les elder scrolls à mes yeux.

Les autres jeux sont soit trop dirigistes, soit trop narratifs, soit mal foutus du point de vue ergonomique... je ne retrouve jamais le plaisir de jeu, l'immédiateté, la simplicité, la liberté de Skyrim, Oblivion ou Morrowind...

Bon, on ne m'enlèvera pas de la tête que c'est pas super intuitif, ni super simple, mais bon, je n'ai trouvé que ça qui fonctionne...

Mon souci

1. Je crée une image côté navigateur avec canvas
2. je veux l'envoyer à mon serveur pour stockage

On pourrait croire que c'est simple, hein... ben j'ai pas trouvé, personnellement.

J'ai essayé

1. de transformer le canvas en blob et de l'envoyer via un formdata
2. de transformer le canvas en blob et de l'envoyer comme un objet simple
3. de transformer le canvas en DataURL et de l'envoyer via un formdata
4. de transformer le canvas en DataURL et de l'envoyer comme un objet simple

Mais à chaque fois, j'ai pas été foutu de récupérer les données côté PHP (bon, je me doute qu'il doit y avoir un pacson de trucs que j'ignore encore, hein...)

Ensuite, j'ai pensé

«et si je passais les données au format base64, je devrais pouvoir les récupérer facilement...» car je pratique couramment un optimisme ridicule au sujet duquel il m'arrive encore de sombrer dans la stupéfaction à grand fracas...

Dont acte: je recommence à farfouiller avec des fetch, des posts pis tout mais sans succès: les données décodées font une image invalide.

en désespoir de cause

Je décide de procéder moins élégamment: je copie les données vers un formulaire caché que je poste en target blank pour pas perdre ma page de travail... Oui, je sais, c'est sale, c'est moche, c'est pas secure, j'en ai conscience, c'est pas la peine de m'enfoncer, j'ai déjà assez honte comme ça...

Je reçois bien de la base 64, je décode... Et l'image n'est toujours pas valide. Puis une recherche m'apprend qu'il faut virer l'en-tête base64 côté serveur avant de décoder pour que ça fonctionne...

Je teste et... ça marche.

SUPER INTUITIF MERCI

Oui, j'avais posté il y a super longtemps un billet sur des astuces pour les accents espagnols sous ubuntu/int ( https://www.warriordudimanche.net/article691/59b41f3ca6ec8 ) puis je me suis rendu compte que la méthode la plus simple (mais VRAIMENT plus simple) est de trouver une disposition de clavier adéquate...

Pour les accents espagnols, le meilleur clavier azerty est le clavier Occitan:

• il est AZERTY
• il est compatible avec les claviers AZERTY les plus répandus
• les caractères espagnols sont accessibles en pressant simplement la touche ATL en même temps: ALT+a = á etc.

Je n'utilise plus jamais le clavier français.

Un excellent article, très simple d'accès. Résumé pour mémoire mais je vous conseille d'aller lire le tout tant c'est clair et bien documenté:

1.Tout typer

... pour pouvoir compter sur le type des données

• Les paramètres des fonctions function moncul(string $str) pour éviter de vérifier les paramètres puisqu'un type erroné provoquera une erreur
• Les valeurs de retour des fonctions function moncul(string $str): int car en cas de retour d'un autre type, il y aura erreur. (pour les fonctions ne retournant rien, :void )
• Les propriétés de classe : private int $mon_cul; pour qu'une erreur se déclenche en cas d'initialisation d'un type erroné.

2.Protéger ses classes par défaut

• ajouter «final» à la déclaration de classe final class monCul(){ pour éviter tout héritage, même fortuit.
• laisser ses propriétés en private par défaut
• laisser ses méthodes en private par défaut jusqu'à ce qu'on ait besoin de les appeler de l'extérieur

3.Utiliser les comparaisons strictes

... pour éviter les confusions false/0 etc

4.Se passer des «if»

En utilisant l'opérateur ternaire condition ? valeur retournée si true : valeur retournée si false;

Pourquoi ? Parce que c'est plus court mais aussi parce qu'on peut placer la condition directement dans une assignation ou à la place d'un paramètre: $count += ($value === CONTROL_VALUE) ? 1 : 0;

Par contre, je trouve qu'on y perd BEAUCOUP en lisibilité et en organisation.

5.La fonction « sscanf »

Pour analyser une chaîne selon un format (et à la place d'un explode plus lourd). C'est l'inverse de printf(). ( https://www.php.net/manual/fr/function.sscanf.php )

6.L'inversion de valeurs en une ligne

et avec autant de valeurs qu'on veut

[$var1, $var2, $var3, $var4] = [$var4, $var3, $var2, $var1];

7. L’opérateur de décomposition « … »

$intersection = array_intersect(...$bigArray); au lieu de $intersection = array_intersect($bigArray[0], $bigArray[1], $bigArray[2]); // Etc.

8. Toujours ajouter un compteur de boucle pour sortir des while

Ça m'a rappelé un épisode de BigBang Theory dans lequel Sheldon est prisonnier d'une boucle dans son algorithme HowToMakeANewFriend... (c'est Howard qui l'en sort en implémentant un compteur comme condition de sortie).

$block++;
    if ($block > 1000) {
        break;
    }

9.Utiliser les fonctions liées aux tableaux

Je plussoie vigoureusement ce point particulier

Avant de se lancer dans un traitement de tableau en créant une fonction ou une méthode exprès, relisez la doc de toutes les fonctions commençant par Array_ ... histoire de ne pas réinventer la roue.

10.Manipuler les tableaux avec les callbacks et les Collections

Pour manipuler un tableau, penser à utiliser array_map plutôt que foreach si c'est possible:

• utilisation simple array_map('trim',$tableau)
• fonction anonyme ```array_map(function($k){ code de traitement },$tableau);
• avec une méthode array_map(array($instance, 'methode'), $tableau)

ooh ! Une lib Python pour faire **facilement** des GUI **jolies** !

Genre

from dearpygui import core, simple

def save_callback(sender, data):
    print("Save Clicked")

with simple.window("Example Window"):
    core.add_text("Hello world")
    core.add_button("Save", callback=save_callback)
    core.add_input_text("string")
    core.add_slider_float("float")

core.start_dearpygui()

donne

J'ai pas creusé mais ça me semble intéressant tant je trouve rebutant cet aspect sous python...