Voilà ça fait un bout de temps que j'en ai marre de cliquer sur de liens Twitter sur ce forum, et j'aimerais faire un script qui les affiche automatiquement
J'ai déjà Tampermonkey sur mon navigateur, et une ou deux extensions qui ne marchent pas trop mal (risibank et jvchat) alors je me suis dit que c'était probablement la bonne solution
Le problème, c'est que je n'ai aucune idée de comment marche le dev web, j'ai déjà fait une page HTML avec un fichier CSS pour changer la police et un fichier JavaScript pour dessiner sur un canevas au centre, mais au-delà de ça rien du tout
Je ne trouve pas non plus de bons tutos sur le web tous partent du principe que je comprends parfaitement leur code et écrive 8 ligne par 8 lignes en disant "et là ça fait un bouton", "et hop vous avez changé la couleur" sans jamais expliquer en détail
Quelqu'un pour m'expliquer comment ça marche ou au pire quel langage je dois apprendre pour y piger quelque chose?

Apprends javascript, tu pourras rien faire sans ça

Et apprends à reconnaître les class ou les id des éléments html; essaye de comprendre comment s'article le DOM, comprends que y'a des notions "d'hérédité" des éléments les uns aux autres

C'est pas compliqué mais il faut avoir de bonnes notions de la structure d'une page html complexe (pas juste head body blabla, faut comprendre comment situer et cibler les éléments d'une page)

Le mieux c'est de te fixer des défis concrets pour apprendre

Enfin, perso, j'ai toujours trouvé qu'on apprenait mieux sur le tas que dans la théorie

Genre essaye de changer la couleur de tels ou tels trucs sur une page, par exemple

Je veux juste un truc qui fasse comme pour les vidéos Youtube
Dès que le script détecte un lien Twitter, il affiche le tweet
Sauf que je sais pas comment scanner le site, je sais pas comment aller chercher le contenu du tweet sur Twitter et je sais pas comment afficher un truc
Mais sinon je peux faire un bouton grâce aux tutos que j'ai trouvés

Au mieux, tu peux tricher un peu avec jQuery qui simplifie un peu mais rien de mieux que d'apprendre le JS pur pour comprendre comment ça marche

Le 28 février 2022 à 09:25:04 :
Apprends javascript, tu pourras rien faire sans ça

Et apprends à reconnaître les class ou les id des éléments html; essaye de comprendre comment s'article le DOM, comprends que y'a des notions "d'hérédité" des éléments les uns aux autres

C'est pas compliqué mais il faut avoir de bonnes notions de la structure d'une page html complexe (pas juste head body blabla, faut comprendre comment situer et cibler les éléments d'une page)

Le mieux c'est de te fixer des défis concrets pour apprendre

Enfin, perso, j'ai toujours trouvé qu'on apprenait mieux sur le tas que dans la théorie

Genre essaye de changer la couleur de tels ou tels trucs sur une page, par exemple

OK merci je vais déjà essayer ça

Le 28 février 2022 à 09:25:40 Raghenfred a écrit :
Je veux juste un truc qui fasse comme pour les vidéos Youtube
Dès que le script détecte un lien Twitter, il affiche le tweet
Sauf que je sais pas comment scanner le site, je sais pas comment aller chercher le contenu du tweet sur Twitter et je sais pas comment afficher un truc
Mais sinon je peux faire un bouton grâce aux tutos que j'ai trouvés

Faut faire une regex qui va trouver le lien, chopper le code youtube de la vidéo et l'intégrer dans une iframe

Renseigne toi sur les regex, c'est un truc qui te servira dans tous les langages, c'est universel

Ca permet de reconnaître des liens selon un pattern (par exemple les liens qui commencent par youtube blabla) et d'isoler dans le lien un élément que tu veux conserver comme variable (le code de la vidéo)

Pour twitter, je me suis pas penché dessus, mais ça doit être à peu près la même logique

Si tu veux tester tes regex, ce site est top :

https://regex101.com/

Le 28 février 2022 à 09:28:33 CuSO4_5H2O a écrit :

Le 28 février 2022 à 09:25:40 Raghenfred a écrit :
Je veux juste un truc qui fasse comme pour les vidéos Youtube
Dès que le script détecte un lien Twitter, il affiche le tweet
Sauf que je sais pas comment scanner le site, je sais pas comment aller chercher le contenu du tweet sur Twitter et je sais pas comment afficher un truc
Mais sinon je peux faire un bouton grâce aux tutos que j'ai trouvés

Faut faire une regex qui va trouver le lien, chopper le code youtube de la vidéo et l'intégrer dans une iframe

Renseigne toi sur les regex, c'est un truc qui te servira dans tous les langages, c'est universel

Ca permet de reconnaître des liens selon un pattern (par exemple les liens qui commencent par youtube blabla) et d'isoler dans le lien un élément que tu veux conserver comme variable (le code de la vidéo)

Ok merci, je comprends rien du message pour l'instant, mais je sens que tu me mets sur la bonne voie
Je vais tapper tout ça sur Google et lire de la doc du coup

GetElementByTagname

Le 28 février 2022 à 09:32:35 Kronos91 a écrit :
GetElementByTagname

Et le Tagname du coup, c'est le regex des liens Twitter?
Genre "https://twitter.com/*"?

Le 28 février 2022 à 09:34:26 Raghenfred a écrit :

Le 28 février 2022 à 09:32:35 Kronos91 a écrit :
GetElementByTagname

Et le Tagname du coup, c'est le regex des liens Twitter?
Genre "https://twitter.com/*"?

Non, le tagname c'est pour des balises html

Pour chopper des https://twitter blabla, il te faudra des regex , entraîne toi à les scanner (et à les décomposer en plusieurs variables) avec le site que je t'ai filé (enfin, quand tu auras assimilé la théorie)

Le 28 février 2022 à 09:38:20 CuSO4_5H2O a écrit :

Le 28 février 2022 à 09:34:26 Raghenfred a écrit :

Le 28 février 2022 à 09:32:35 Kronos91 a écrit :
GetElementByTagname

Et le Tagname du coup, c'est le regex des liens Twitter?
Genre "https://twitter.com/*"?

Non, le tagname c'est pour des balises html

Pour chopper des https://twitter/ blabla, il te faudra des regex , entraîne toi à les scanner (et à les décomposer en plusieurs variables) avec le site que je t'ai filé (enfin, quand tu auras assimilé la théorie)

D'accord, je vais bosser dessus de mon côté pour bien tout comprendre
Merci beaucoup pour ton aide

Regarde ici, je t'ai fait un exemple à l'arrache pour chopper le code vidéo d'un lien youtube :

https://regex101.com/r/AFkJR4/1

Tu peux affiner avec le timer et d'autres trucs, mais ça te permet de comprendre l'idée

En gros, tu mets un pattern qui va chopper tous les liens YT et qui va conserver uniquement le code intéressant dans une variable, celle du groupe 1 (code de la vidéo)

Une fois que tu récupères cette variable, tu peux facilement créer un élement qui l'utilise pour faire un player

La même logique doit être adaptable à un truc twitter (je connais pas leur structure, mais ça doit fonctionner sur la même logique)