« Fonctionnement technique de Jeuxvideo.com » : différence entre les versions

m
 
(12 versions intermédiaires par 2 utilisateurs non affichées)
Ligne 160 : Ligne 160 :
==== JavaScript ====
==== JavaScript ====


  function jvCake(classe) {
  function jvCare(classe) {
   const base16 = '0A12B34C56D78E9F';
   const base16 = '0A12B34C56D78E9F';
   let lien = <nowiki>''</nowiki>;
   let lien = <nowiki>''</nowiki>;
Ligne 246 : Ligne 246 :
<s>messageTextArea.value = message;</s>
<s>messageTextArea.value = message;</s>


Il faut simuler le changement pour React, Il existe pour cela '''une fonction très utilisée''' sur le web :  
Heureusement, il existe pour cela '''une fonction très utilisée''' sur le web :  


  function fonctionreact(textarea, value) {
  function fonctionreact(textarea, value) {
Ligne 255 : Ligne 255 :
  }
  }


Ensuite il faut faire appel à cette fonction :
Ensuite, il suffit simplement de faire appel à cette fonction quand on doit remplir une zone de texte :


  fonctionreact(messageTextArea, message);
  fonctionreact(messageTextArea, message);
 
En 1er on donne l'ID de la zone de texte et en 2nd le texte à insérer.
En 1er on donne la zone de texte ciblée et en 2nd le texte à insérer.


Pour simplifier, <code><span style="color:red;">messageTextArea</span>.value = <span style="color:green;">message</span>;</code> devient <code>fonctionreact(<span style="color:red;">messageTextArea</span>, <span style="color:green;">message</span>);</code> avec cette fonction.
Pour simplifier, <code><span style="color:red;">messageTextArea</span>.value = <span style="color:green;">message</span>;</code> devient <code>fonctionreact(<span style="color:red;">messageTextArea</span>, <span style="color:green;">message</span>);</code> avec cette fonction.
Ligne 265 : Ligne 265 :
=== Fonction officielle JVC ===
=== Fonction officielle JVC ===


Par ailleurs, en dehors de cette méthode, JVC a proposé une entrée native pour interagir directement avec REACT.<br>
Par ailleurs, en dehors de cette méthode, JVC a proposé une entrée native pour interagir directement avec REACT :<br>
<code>jvc.getMessageEditor()</code>
<code>jvc.getMessageEditor();</code> (C'est une entrée partielle, pour réaliser des fonctions officielles du site.)


https://www.jeuxvideo.com/forums/message/1286112457
https://www.jeuxvideo.com/forums/message/1286112457


  let editor = jvc.getMessageEditor('#bloc-formulaire-forum #message_topic'); //selectionner la zone de texte
  jvc.getMessageEditor(".class").insertText(`mon texte`); // Place du texte à l'endroit sur le focus
if (null !== editor) {
jvc.getMessageEditor(".class").insertStartLine(`mon texte`); // Place du texte en début de ligne.
    editor.insertText(`mon texte`); //pour insérer du texte à un endroit précis.
  jvc.getMessageEditor(".class").selectedText; // Récupérer la sélection utilisateur.
    editor.insertStartLine(`mon texte`); //insérer du texte en debut de ligne.
  }


Important il faut retirer la variable "windows" devant la fonction "jvc" .
PS : Pour garantir le bon fonctionnement, utilisez simplement jvc.getMessageEditor(); '''sans le préfixe "window"'''<ref>Les userscripts sont exécutés dans un environnement isolé (appelé sandbox), ce qui empêche parfois l’accès direct aux objets définis dans le contexte global de la page, comme "window" .</ref>. <br>


Cette fonction prend directement en compte des sélecteurs CSS, exemple :
Il est nécessaire de faire appel à <code>jvc.getMessageEditor();</code> à chaque modification, sinon vous travaillerez avec une version antérieure de la zone de texte.


let selector = document.getElementById("message_topic")
Cette fonction prend directement en compte des sélecteurs CSS et pas des éléments, exemple :
jvc.getMessageEditor(selector).insertText('text'); //❌ Ne marche pas


  let selector = "#message_topic"
  let selector = "#message_topic"
  jvc.getMessageEditor(selector).insertText('text'); //✅ Marche
  jvc.getMessageEditor(selector).insertText('text'); //✅ Marche


L'approche de getMessageEditor(...) diffère des fonctions classiques :<br>
let selector = document.getElementById("message_topic")
Elle ne peut être stockée dans une variable, il faut faire appel à la fonction à chaque utilisation.<br>
jvc.getMessageEditor(selector).insertText('text'); //❌ Ne marche pas


Cette fonction présente de nombreux avantages : native à JVC, gestion automatique du Focus (curseur), gestion des espaces.


Elle est très pratique pour de l'insertion de texte à un endroit localisé, c'est d'ailleurs la fonction officielle pour l'intégration des smileys.
Cependant, cette fonction présente plusieurs avantages notables : elle est à la fois native à JVC et intégrée au fonctionnement de React.


En revanche, pour manipuler le champ entièrement (suppression, remplacement) :d) la fonction à moins d'intérêt.
De plus, contrairement à une modification directe du champ texte via JavaScript, cette fonction ne nécessite aucune gestion manuelle du curseur, de la sélection ou des espaces, tout est automatiquement pris en charge par la fonction elle-même.


Pour simplifier : <code>jvc.getMessageEditor(<span style="color:red;">"AreaIDClasse"</span>).insertText(<span style="color:green;">message</span>);</code> avec cette fonction.
En revanche, pour manipuler le champ entièrement (suppression, remplacement) {{fleched}} la fonction a moins d'intérêt.<br>
De plus, elle ne fonctionne que sur JVC, et ce n'est pas une fonction JavaScript universelle, contrairement à la précédente.


== Liens externes ==
== Liens externes ==
Kheys
2 109

modifications