Projet:Scripts et gadgets/Notices/Suggest

PROJET SCRIPTS ET GADGETS

Centraliser les fonctions JavaScript, Vue et CSS pour éviter la dispersion du code.

Suggest est un code JavaScript contenant des fonctions génériques destinées à créer des zones de suggestion pour un champ de saisie (<input type="text" />).

Fonction principale

L'ajout d’une liste de suggestion se fait par la syntaxe suivante :

Suggest_AddPageSuggestion({
   "InputNode"       : champTexte, 
   "NSFilter"        : espaceDeNom, 
   "StripNS"         : afficherLespaceDeNom, 
   "SuggestLimit"    : maxSuggestions, 
   "SuggestListSize" : tailleListe, 
   "AddExist"        : avecIcône, 
   "ListDown"        : enDessous, 
   "Prefix"          : préfixe,
   "Suffix"          : suffixe,
   "RedirectFilter"  : filtreRedirect
});

On peut insérer autant de liste de suggestions que l'on souhaite, chacune pouvant être paramétrée différemment.

Hormis "InputNode", tous les paramètres sont facultatifs.

Paramètres

champTexte: Type : Nœud DOM

Ce paramètre est obligatoire. Il doit correspondre à un élément <input type="text" /> existant, soit dans le DOM de la page soit inséré dans un autre élément

L'id de cette balise est généré automatiquement. Si une balise a déjà une id, la fonction recherche un <label> associé et met à jour son attribut "for". Cette id est renvoyée par la fonction (voir plus bas)

espaceDeNom: Type : false ou nombre entier positif

Ce paramètre permet de spécifier un espace de noms pour filtrer la requête.

Mis à "false", les suggestions intègrent toutes les pages. Pour rechercher une page avec espace de noms, il est nécessaire de rentrer l'espace de noms dans le champ de saisie, par exemple Projet:Scripts et gadgets/Notices/Suggest.

Si paramétré selon un espace de noms (qui existe), Seules les pages de cet espace de noms sont recherchées. Il n'est pas nécessaire de rentrer l'espace de noms pour débuter la recherche.

afficherLespaceDeNom: Type : booléen

Si paramétré à "true", l'espace de noms est masqué dans les suggestions et est automatiquement retiré du champ de saisie si espaceDeNom est différent de "false"

Ce paramètre est obligatoirement à "false" si espaceDeNom est à "false", et obligatoirement à "true" si préfixe est défini.

maxSuggestions: Type : nombre entier positif non nul

Ce paramètre permet de préciser la limite de la requête, et donc le nombre maximum de pages qui seront suggérées.

tailleListe: Type : nombre entier positif non nul

Ce paramètre permet de préciser la taille de la liste de suggestion, c'est-à-dire le nombre de suggestions visibles dans la liste déroulante.

avecIcône: Type : booléen

Ce paramètre permet de préciser si l'icône marquant l'existence ou non de la page saisie doit être affichée ou non.

Note aux développeurs : l'existence ou non de la page saisie est également indiquée via l'attribut "value" d’une <input type="hidden" /> : 0 si la page n'existe pas, 1 si elle existe.

enDessous: Type : booléen

Ce paramètre permet d'afficher le liste de suggestion en dessous de la zone de saisie plutôt qu'au-dessus.

préfixe: Type : texte

Ce paramètre permet de préciser un préfixe pour la recherche de pages.

suffixe: Type : texte

Ce paramètre permet de préciser un suffixe pour la recherche de pages.

Le filtrage s'effectuant après la requête, il est conseiller d'élever la limite de cette dernière (paramètre maxSuggestions)

filtreRedirect: Type = texte

Ce paramètre permet de préciser les options de filtrage des redirection.

Il peut prendre trois valeurs :

"all" : pas de filtrage (valeur par défaut)
"redirects" : redirections uniquement
"nonredirects" : pages normales uniquement

Autres fonctions

Récupération n° d'index

Cette fonction permet de récupérer le numéro d'index des éléments créés par la fonction principale avec la syntaxe suivante :

    var Index = Suggest_GetSuggestionIndex(Element);

Ce numéro correspond au nombre accolé à l'ID des éléments. Ces id on les valeurs suivantes :

"InputWithSuggestion_x" : champ de saisie (<input type="text" />)
"SuggestionForInput_x" : liste de suggestions (<select />)
"ThisPageExist_x" : champ caché renseignant l'existence ou non de la page saisie (<input type="hidden" />)
"ThisPageExistIMG_x" : icône renseignant l'existence ou non de la page saisie (<img />)

Le n° récupéré par cette fonction correspond à la valeur de x. Il est identique pour tous les éléments d'un même set. Le connaître permet donc de récupérer les autres éléments du set, ainsi que ses paramètres de configuration, contenus dans un tableau :

Éléments
- Suggest_Params["Input"][x] : champ de saisie (<input type="text" />)
- Suggest_Params["Suggest"][x] : liste de suggestions (<select />)
- Suggest_Params["ExistInput"][x] : champ caché renseignant l'existence ou non de la page saisie (<input type="hidden" />)
- Suggest_Params["ExistImg"][x] : icône renseignant l'existence ou non de la page saisie (<img />)
Variables
- Suggest_Params["IsRunning"][x] : état de la requête de suggestions
- Suggest_Params["NSFilter"][x] : option de filtrage par espace de noms
- Suggest_Params["StripNS"][x] : option d'affichage de l'espace de noms
- Suggest_Params["SuggestLimit"][x] : option de limite des suggestions
- Suggest_Params["SuggestSelectLimit"][x] : option de taille de la liste de suggestions
- Suggest_Params["ListDown"][x] : option d'affichage de la liste de suggestions en bas
- Suggest_Params["Prefix"][x] : option de filtrage par préfixe
- Suggest_Params["Suffix"][x] : option de filtrage par suffixe
- Suggest_Params["RedirectFilter"][x] : option de filtrage des redirections

Remarques :

L'icône renseignant l'existence ou non de la page saisie peut ne pas exister selon le paramétrage de la fonction qui a créé le set.
Le numéro d’index est renvoyé lors de la création du set. On peut donc le récupérer lors de la création avec la syntaxe :

var Index = Suggest_AddPageSuggestion({
               "InputNode"       : champTexte, 
               "NSFilter"        : espaceDeNom, 
               "StripNS"         : afficherLespaceDeNom, 
               "SuggestLimit"    : maxSuggestions, 
               "SuggestListSize" : tailleListe, 
               "AddExist"        : avecIcône, 
               "ListDown"        : enDessous, 
               "Prefix"          : préfixe,
               "Suffix"          : suffixe,
               "RedirectFilter"  : filtreRedirect
            });

Menu déroulant espace de noms

Une fonction permet de créer un menu déroulant de sélection d'espace de noms avec la syntaxe suivante :

    var Menu = Suggest_AddNamespaceSuggestion(ID, CLASS);

La fonction renvoie l'élément <select>. Celui-ci reste à insérer dans le DOM.

Les deux paramètres sont facultatifs :

ID : valeur attribué aux attributs id et name du <select>
CLASS : classe attribuée au <select>

Titre de page

Différentes infos sur le titre d’une page peuvent être récupérées avec la syntaxe suivante

    var Info = Suggest_GetNamespaceInfoFormPage(Page, ToReturn);

Page

paramètre obligatoire, c’est le titre de la page que l'on souhaite analyser;

ToReturn

paramètre facultatif. peut prendre différentes valeur selon l'information recherchée :

"NamespaceName" : Nom de l'espace de noms
"PageName" : Titre de la page sans l'espace de noms
Autres valeurs : Numéro de l'espace de noms

Exemple de mise en œuvre

Exemple

if(typeof(Suggest_AddPageSuggestion)!="function") obtenir('Suggest');


addOnloadHook(function(){ 
  var Div = document.createElement('div');
  Div.innerHTML = '' 
    + '<div id="TestSuggest" style="text-align:justify;" >' 
    + '<form  style="display:block">' 
    + '<input id="SuggestNSAllNoStrip" name="Page" type="text" value="" />' 
    + '<label for="SuggestNSAllNoStrip" >NS = All ; NoStrip ; AddExist = true ; ListDown = true ; SuggestLimit = 20 ; SuggestListSize = 8</label>' 
    + '</form>' 
    + '<form  style="display:block">' 
    + '<input id="SuggestNS14Strip" name="Page" type="text" value="" />' 
    + '<label for="SuggestNS14Strip" >NS = 14 ; Strip ; AddExist = true</label>' 
    + '</form>' 
    + '<form  style="display:block">' 
    + '<input id="SuggestNS14NoStrip" name="Page" type="text" value="" />' 
    + '<label for="SuggestNS14NoStrip" >NS = 14 ; NoStrip ; AddExist = true</label>' 
    + '</form>' 
    + '<form  style="display:block">' 
    + '<input id="SuggestPortail" name="Page" type="text" value="" />' 
    + '<label for="SuggestPortail" >NS = 10 ; NoStrip ; Prefix = Portail ; AddExist = true ; ListDown = true</label>' 
    + '</form>' 
    + '<form  style="display:block">' 
    + '<input id="SuggestSuffix" name="Page" type="text" value="" />' 
    + '<label for="SuggestSuffix" >NS = 8 ; Strip ; Suffix = .js ; SuggestLimit = 50</label>' 
    + '</form>' 
    + '</div>';
  var Content = document.getElementById('bodyContent');
  Content.insertBefore(Div, Content.firstChild);
 

  Suggest_AddPageSuggestion({
           "InputNode"       : document.getElementById("SuggestNSAllNoStrip"),
           "SuggestLimit"    : 20,
           "SuggestListSize" : 8,
           "AddExist"        : true,
           "ListDown"        : true
  });
  Suggest_AddPageSuggestion({
           "InputNode"       : document.getElementById("SuggestNS14Strip"),
           "NSFilter"        : 14,
           "StripNS"         : true,
           "AddExist"        : true
  });
  Suggest_AddPageSuggestion({
           "InputNode"       : document.getElementById("SuggestNS14NoStrip"),
           "NSFilter"        : 14,
           "AddExist"        : true
  });
  Suggest_AddPageSuggestion({
           "InputNode"       : document.getElementById("SuggestPortail"),
           "NSFilter"        : 10,
           "AddExist"        : true,
           "ListDown"        : true,
           "Prefix"          : "Portail " 
  });
  Suggest_AddPageSuggestion({
           "InputNode"    : document.getElementById("SuggestSuffix"),
           "NSFilter"     : 8,
           "StripNS"      : true,
           "SuggestLimit" : 50,
           "Suffix"       : ".js"
  });

});