Extension:CodeMirror

From mediawiki.org
This page is a translated version of the page Extension:CodeMirror and the translation is 86% complete.
Manuel des extensions MediaWiki
OOjs UI icon advanced-invert.svg
CodeMirror
État de la version : stable
Pride and codemirror.png
Implémentation Interface utilisateur
Description Fournit la mise en évidence de la syntaxe dans l’éditeur de wikicode.
Auteur(s) Pavel Astakhov (pastakhovdiscussion)
Dernière version 4.0.0
Politique de compatibilité Versions ponctuelles alignées avec MediaWiki. Le master n'est pas compatible arrière.
MediaWiki 1.32+
PHP 5.3+
Modifie la base
de données
Non
Licence Licence publique générale GNU v2.0 ou supérieur
Téléchargement
  • $wgCodeMirrorLineNumberingNamespaces
Traduire l’extension CodeMirror sur translatewiki.net si elle y est disponible
Rôle Vagrant codemirror
Problèmes Tâches ouvertes · Signaler un bogue

L’extension CodeMirror fournit la mise en évidence de la syntaxe dans l’éditeur de wikicode de MediaWiki. Elle ajoute un bouton avec l’icône Codemirror-icon.png dans la barre d’outils de modification, ce qui permet d’activer ou de désactiver cette mise en évidence. Elle prend en charge la barre d’outils de l’éditeur de wikicode 2010 ainsi que la barre d’outils de l’éditeur visuel.

Par défaut la fonctionnalité est désactivée. Lorsqu’elle est activée, elle remplacera la zone de texte standard gérée par le navigateur par l’éditeur fourni par la bibliothèque CodeMirror. Lorsqu’elle est désactivée, on réutilisera la zone de texte standard du navigateur.

Les couleurs utilisées dans cette extension ont été optimisées pour offrir un contraste plus élevé, une accessibilité et une lisibilité améliorée, pour se conformer maintenant aux Recommandations pour l’accessibilité du contenu sur le web (WCAG 1.4.3 AA). Les couleurs offrent une meilleure accessibilité aux personnes ayant une vision limitée et aux utilisateurs travaillant dans des conditions de forte luminosité du jour. (autres informations)

Fonctionnalités

Appariement des parenthèses, crochets et accolades

Cette fonctionnalité met en évidence la paire englobante la plus interne de parenthèses, crochets ou accolades, lorsque le curseur est placé à l’intérieur d’une paire de signes. Quand le curseur est placé juste avant un signe ouvrant ou juste après un signe fermant, la fonctionnalité met également en évidence le signe associé correspondant. L’appariement des parenthèses, crochets ou accolades est actif dans les deux éditeurs quand la mise en évidence de la syntaxe est activée dans tout espace de nom utilisant ces éditeurs.

Numérotation des lignes

Dans le mode de modification du wikicode, les numéros de ligne sont automatiquement affichés dans les deux éditeurs.

Cette fonctionnalité est activée pour l’espace de noms des modèles sur la plupart des wikis et dans tous les espaces de noms de certains wikis (voir la feuille de route et la configuration).

Colorblind mode

For users who have difficulty distinguishing between colors, CodeMirror offers a colorblind-friendly mode. This feature can be activated on wikis with CodeMirror enabled by navigating to the Special:Preferences page.

New preference colorblind syntax highlighting.png


With the colorblind-friendly scheme active, the colors of the following page elements change:

Headings, symbols, signatures, section names, magic words #E4A400
Templates #9C3A00
HTML tags, references, mathematical expressions #56B4E9
Variables #009E73

In addition, background highlights and colors are removed from all text and objects. Bolding and underlining behavior remains unaffected.


Navigateurs pris en charge

Tous les navigateurs pris en charge par MediaWiki sont également pris en charge dans CodeMirror.

Installation

  • Installez l’extension WikiEditor ou l’extension VisualEditor , en suivant les instructions données sur leurs pages dédiées : au moins l'une des deux est nécessaire pour que cette extension fonctionne.
  • Téléchargez et placez le(s) fichier(s) dans un répertoire appelé CodeMirror dans votre dossier extensions/.
  • Ajoutez le code suivant à la fin de votre fichier LocalSettings.php  :
    wfLoadExtension( 'CodeMirror' );
    
  • Configurer si nécessaire.
  • Yes Fait – Accédez à Special:Version sur votre wiki pour vérifier que l'extension a bien été installée.


Installation Vagrant :

  • Si vous utilisez Vagrant , installez avec vagrant roles enable codemirror --provision

Configuration

Pour la personnalisation des couleurs et des styles, consultez la page d’aide sur Méta-Wiki. Vous pouvez utiliser vos propre styles pour la mise en évidence du wikicode. Les styles utilisés sont disponibles ici. Vous pouvez placer vos propres styles dans common.css .

Ajouter le code ci-dessus en bas de votre LocalSettings.php .

# Active l’utilisation de CodeMirror par défaut mais il est encore possible aux utilisateurs de le désactiver dans leurs préférences
$wgDefaultUserOptions['usecodemirror'] = 1;

Pour essayer les nouvelles fonctionnalités mentionnées ci-dessus dans votre installation locale, ajoutez également les lignes suivantes. Note : ces fonctionnalités sont destinées à devenir des fonctionnalités par défaut. Une fois activés par défaut, ces paramètres pourraient alors ne plus avoir d’effet.

# Activer l’appariement des parenthèses, crochets ou accolades dans CodeMirror
$wgCodeMirrorEnableBracketMatching = true;

# Activer l'accès aux couleurs dans CodeMirror
$wgCodeMirrorAccessibilityColors = true;

# Activer la numérotation des lignes dans CodeMirror
# par défaut dans l’espace de noms des modèles [ NS_TEMPLATE ]
# null l’active pour tous les espaces de noms
# [] pour le désactiver partout
$wgCodeMirrorLineNumberingNamespaces = null;

Intégration aux autres extensions

Si votre extension MediaWiki ajoute une nouvelle balise et si vous voulez vous assurer que CodeMirror met correctement en évidence le contenu qu’elle contient, vous pouvez ajouter la prise en charge de CodeMirror à votre extension. En voici deux exemples : extension Cite et extension PhpTags.

Intégration de JavaScript

Les crochets frontaux sont utilisés dans cette extension :

Accroche Paramètres
Type Description
ext.CodeMirror.switch booléen Indique que l’éditeur CodeMirror est maintenant affiché
objet jQuery L’« éditeur » actuel, qui est soit l’‎<textarea /> normal ou l’élément .CodeMirror.

À faire

  • mise en évidence des listes de définitions ( ;foo :bar ) (tâche T170042)
  • complétion automatique (phab:T95100)
  • repli du code (tâche T166098)
  • mise en évidence à l’intérieur de la balise de galerie (<gallery> foo | bar </gallery>)

Voir aussi