Auteur(s) : Louis Ouellet

DokuWiki est un outil fantastique pour créer et gérer du contenu collaborativement. Cependant, travailler avec le markdown personnalisé peut parfois poser problème, en particulier pour les utilisateurs qui ne sont pas familiers avec ses subtilités. Par exemple, lors de la gestion des entrées dans les formulaires, les utilisateurs de DokuWiki rencontrent souvent des problèmes pour conserver les sauts de ligne (\n) lors de la soumission. Pour simplifier cela, j’ai développé une solution en JavaScript qui convertit automatiquement \n en \, garantissant ainsi que les formulaires fonctionnent sans problème avec la syntaxe markdown de DokuWiki.

Ce script améliore non seulement l’expérience utilisateur en gérant les transformations markdown, mais il facilite également l’affichage correct des entrées de formulaire. Il est particulièrement utile lorsque les formulaires sont utilisés dans des espaces de noms nécessitant une conformité stricte avec le markdown. Dans ce tutoriel, je vais vous montrer comment configurer et utiliser ce script dans votre instance DokuWiki.

Suivez ces étapes pour améliorer vos formulaires DokuWiki avec ce script personnalisé :

Accédez à votre instance DokuWiki avec des privilèges administrateur.

Naviguez vers la page Admin depuis votre site DokuWiki.

Dans le menu Admin, trouvez et sélectionnez Configurations avancées.

Allez dans la section Configurations du Table des matières et sélectionnez l'onglet JavaScript utilisateur.

Copiez le script suivant et collez-le dans le champ JavaScript utilisateur :

userscript.js

// Exécutez le script une fois que le document est prêt
jQuery(document).ready(function(){
 
    // Liste des espaces de noms où appliquer le script
    var namespaces = ["namespace:page"];
 
    // Restreindre à un espace de noms spécifique
    if (namespaces.indexOf(JSINFO['id']) > -1) {
 
        // Vérifier si "?do=" & "&do=" sont présents dans l'URL
        if (window.location.search.indexOf("?do=") === -1 && window.location.search.indexOf("&do=") === -1) {
 
            // Trouver toutes les zones de texte et remplacer " \ " par des sauts de ligne
            jQuery(this).find('textarea').each(function() {
 
                // Vérifier si la zone de texte est visible
                if (jQuery(this).is(":visible")) {
 
                    // Remplacer " \ " par des sauts de ligne
                    jQuery(this).val(jQuery(this).val().replace(/ \\ /gm, "\n"));
                }
            });
 
            // Remplacer la soumission de formulaire par défaut par une fonction personnalisée
            jQuery("form").on("submit", function(event) {
 
                // Empêcher le formulaire de se soumettre immédiatement
                event.preventDefault();
 
                // Trouver toutes les zones de texte et remplacer les sauts de ligne par " \ "
                jQuery(this).find('textarea').each(function() {
 
                    // Vérifier si la zone de texte est visible
                    if (jQuery(this).is(":visible")) {
 
                        // Remplacer les sauts de ligne par " \ "
                        jQuery(this).val(jQuery(this).val().replace(/\n/gm, ' \\ '));
                    }
                });
 
                // Après l'exécution de la fonction, déclencher manuellement la soumission du formulaire
                this.submit();
            });
        }
    }
});

Cliquez sur Enregistrer pour appliquer les modifications.

Effacez le cache JavaScript de DokuWiki pour vous assurer que les modifications prennent effet. Vous pouvez le faire en ajoutant ?purge=true à l’URL ou en appuyant sur Vider le cache JS.

Visitez un espace de noms spécifié dans le script et testez vos formulaires. Entrez du texte sur plusieurs lignes, soumettez le formulaire, et vérifiez que la soumission conserve les sauts de ligne au format souhaité.

Voici un exemple de fonctionnement du script :

bureaucracy.txt

<form>
action mail username@domain.com
 
fieldset "1."
textarea "Tester plusieurs lignes"
 
fieldset "2."
textarea "Tester les lignes sautées"
 
fieldset "3."
textarea "Tester aucune valeur" !
 
fieldset "Soumettre"
Submit submit
</form>

Résultat:

The following data was submitted on 2024/12/20 10:53.
 
1.
Test multiple lines asdf \\ asdf \\ asdf
2.
Test skipping lines asdf \\ \\ asdf \\ \\ asdf
3.
Submit

Votre instance DokuWiki est maintenant équipée d’un script amélioré pour la gestion des formulaires, ce qui améliore l’utilisabilité et garantit la conformité avec le markdown.

Avec ce script, vous pouvez considérablement améliorer la gestion des entrées sur plusieurs lignes dans les formulaires DokuWiki. En automatisant la conversion de \n (saut de ligne) en
(markdown), vous éliminez la nécessité pour les utilisateurs d’ajuster manuellement leurs entrées pour la syntaxe markdown de DokuWiki. Cela simplifie non seulement l’expérience utilisateur, mais garantit également que vos formulaires conservent un formatage cohérent lors des soumissions.

N’hésitez pas à ajuster les espaces de noms dans le script pour l’adapter à votre cas d’utilisation. Si vous rencontrez des problèmes ou avez des suggestions d’améliorations, laissez un commentaire !