Deux nouvelles colorations syntaxique et quelques améliorations apportées à la balise CODE

Pour plus de confort sur les forums de Developpez.com

Le 4 avril 2011 à 12:36, par Anomaly

5PARTAGES

Deux nouvelles colorations syntaxique et quelques améliorations apportées à la balise CODE
pour plus de confort sur les forums de Developpez.com

Chers amis,

J'ai le plaisir de vous informer que la balise Code a été encore une fois améliorée !

Ajout de deux nouvelles colorations :
- Bash (en vigueur sur les forums Linux par défaut)
- Assembleur (en vigueur sur les forums Assembleur par défaut)

Code bash :

Sélectionner tout

1
2
3
4
5
#!/bin/bash 
for i in *.txt 
do 
    echo "Le répertoire contient " $i 
done

Code asm :

Sélectionner tout

1
2
3
4
message db "Vive Developpez$" 
mov ah, 09h 
mov dx, offset message 
int 21h

Autres améliorations :
- Résolution du souci de compatibilité entre Chrome et le lien "Sélectionner tout"
- Résolution de la déformation de la balise CodeInline en cas de code partiel ou incorrect
- Suppression de la bordure autour du CodeInline pour éviter la superposition disgrâcieuse de plusieurs CodeInline proches.

Excellente navigation sur nos forums à tous.

Nouveautés précédentes

Bonjour à tous,

J'ai le plaisir de vous annoncer que pas moins de huit améliorations ont été apportées à la balise CODE !

Première amélioration : La numérotation des lignes

Pour tout code d'au moins deux lignes, les lignes sont désormais numérotées ! Et rassurez-vous, copier-coller le code n'emportera pas les numéros de lignes par la même occasion.

Exemple :

Code c :

Sélectionner tout

1
2
3
4
5
6
7
#include <stdio.h> 
#include <stdlib.h> 
  
int main() { 
    puts("Bonjour, monde !"); 
    return EXIT_SUCCESS; 
}

Deuxième amélioration : Possibilité de visualiser le code seul sur une fenêtre à part

Désormais, chaque code est accompagné d'un lien "Visualiser le code dans une fenêtre à part" qui permet, en un clic, d'ouvrir un nouvel onglet contenant le code seul avec ses numéros de ligne pour une consultation plus facile !

Troisième amélioration : Le code Inline

Fonctionnalité souvent demandée, il vous est maintenant possible de donner un simple mini-bloc de code d'une ligne au milieu d'une phrase sans que ceci impose un retour à la ligne avant et après le bloc. Il faut maintenant utiliser la nouvelle balise CODEINLINE (qui, à l'instar de la balise CODE, peut prendre un paramètre) pour profiter de cette nouvelle fonctionalité.

Exemple, voici un exemple de code C inline : const char* pseudo = "Anomaly"; /* Responsable technique */ que j'ai inséré au milieu d'une phrase.

Une nouvelle balise a été introduite pour résoudre les problèmes de formatage des anciens messages avec le précédent comportement de mode inline automatique avec la balise CODE. Mettre plusieurs lignes de code dans une balise CODEINLINE génère du code classique.

Quatrième amélioration : Coloration Ruby

Le langage Ruby est maintenant supporté par la coloration syntaxique ! Automatiquement sur le forum Ruby et manuellement en faisant [code=ruby]

Exemple (extrait de Wikipédia) :

Code ruby :

Sélectionner tout

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
class Bibliotheque 
  
   # Accès direct au tableau de livres 
   attr_reader :livres 
  
   # Méthode appelée à la création d'un objet bibliothèque qui initialise le tableau de livres 
   def initialize 
     @livres = [] 
   end 
  
   # Ajoute un livre à la bibliothèque, s'il n'y est pas déjà 
   def ajouter livre 
     raise "Le livre #{livre} est déjà dans la bibliothèque" if @livres.include? livre 
     @livres << livre 
   end 
  
   # Retourne le nombre de livres dans la bibliothèque 
   def taille 
     @livres.length 
   end 
  
   # Retourne la liste des auteurs ayant écrit ou co-écrit au moins un livre dans la bibliothèque 
   def auteurs 
     @livres.map { |livre| livre.auteurs }.flatten.uniq 
   end 
 end

Cinquième amélioration : Bloc de code aussi large que la fenêtre

Désormais, les blocs de code sont aussi larges que la fenêtre le permet. Profitez enfin des capacités de votre écran Wide pour visualiser le code confortablement.

Sixième amélioration : Suppression de la ligne vide en-dessous des codes courts

Une amélioration esthétique : le bloc d'un code court est désormais de la bonne hauteur au lieu de faire une ligne de trop, ce qui prenait de la place en hauteur pour rien, et on sait que la place en hauteur est précieuse à l'époque des écrans 16/9.

Septième amélioration : Possibilité de sélectionner le code d'un seul clic (prêt à être copié dans le presse-papiers)

Chaque code est maintenant accompagné d'un lien "Sélectionner tout" qui... sélectionne tout le code, sans les numéros de lignes, prêt ainsi à être copié dans le presse-papiers.

Note : il n'y a pas de méthode portable pour automatiser la copie vers le presse-papiers du code, à moins de passer par une applet en Flash, ce que vous conviendrez serait lourd et sale.

Huitième amélioration : Nouvelle balise PRE pour générer un bloc en taille fixe sans numéros de ligne

Nouveau ! Nous avons pensé à ceux qui utilisaient la balise CODE pour autre chose que du code, notamment profiter des facilités de présentation que permet une police en taille fixe, et qui étaient gênés par les nouvelles fonctionnalités. Nous avons alors introduit la nouvelle balise PRE qui génère un simple bloc de police en taille fixe sans fonctionnalités superflues.

Important : si le lien pour sélectionner tout et/ou pour voir le code sur une nouvelle fenêtre ne semblent pas fonctionner ou si les blocs de code ne sont pas élargis, faites F5 une fois sur la discussion pour mettre à jour le code Javascript qui est en cache afin d'activer ces fonctionnalités.

Excellente navigation sur les forums de Developpez.com !

Mises à jour :

01/07/2011:
- Deux nouvelles colorations syntaxiques : Assembleur et Bash
- Lien "Sélectionner tout" fonctionnel sous Chrome
- Correction du défaut de rendu du CodeInline avec le code incomplet ou incorrect
- Amélioration de la présentation du CodeInline pour mieux gérer la superposition possible de CodeInlines.

16/05/2011:
- Le langage choisi est à nouveau affiché au début du bloc de code comme c'était à l'origine.
- La coloration C# a été mise à jour pour supporter les nombreuses évolutions du langage depuis la mise en place de la coloration syntaxique.
- XAML est désormais un synonyme de XML au niveau de la coloration.

26/04/2011:
- Nouvelle balise PRE pour générer un bloc en police fixe sans numéros de lignes ni liens spéciaux.
- Nouvelle balise CODEINLINE (avec ou sans paramètre de coloration) pour générer du code inline.
- Plus de retour à la ligne à la fin d'un code inline.
- Mettre plusieurs lignes dans un CODEINLINE est équivalent à utiliser la balise CODE normale.
- La balise CODE standard ne génère plus de code inline par défaut.

20/04/2011:
- Cliquer sur le lien "Visualiser dans une fenêtre à part" affiche une erreur plutôt qu'un code incomplet si le code est trop long.
- Les balises CODE situées à l'intérieur de balises QUOTE sont désormais correctement dimensionnées et donc ne déforment plus le forum.

08/04/2011:
- Nouveau lien "Sélectionner tout" : pour sélectionner le code en un seul clic sans risquer de sélectionner les numéros de ligne avec.
- Le problème de la barre de défilement horizontale qui mangeait la dernière ligne d'un code devrait être résolu dans la majorité des cas.
- Le code inline est désormais toujours suivi d'un retour à la ligne pour résoudre les soucis de présentation avec les anciens messages.

Une erreur dans cette actualité ? Signalez-nous-la !

Votre nom : Votre e-mail :

Décrivez l'erreur que vous souhaitez porter à notre connaissance :

javascript:(function(){%20var%20textarea%20=%20document.activeElement;%20var%20scrollTop%20=%20textarea.scrollTop;%20var%20len%20=%20textarea.value.length;%20var%20start%20=%20textarea.selectionStart;%20var%20end%20=%20textarea.selectionEnd;%20var%20sel%20=%20textarea.value.substring(start,%20end);%20var%20prefix%20=%20%22[CODEINLINE]%22;%20var%20suffix%20=%20%22[/CODEINLINE]%22;%20var%20replace%20=%20prefix%20+%20sel%20+%20suffix;%20textarea.value%20=%20textarea.value.substring(0,%20start)%20+%20replace%20+%20textarea.value.substring(end,%20len);%20textarea.setSelectionRange(start%20+%20prefix.length,%20start%20+%20prefix.length%20+%20sel.length);%20textarea.scrollTop%20=%20scrollTop;%20textarea.focus();})();

		        (function() { 
		            var textarea = document.activeElement; 
		            var scrollTop = textarea.scrollTop; 
		            var len = textarea.value.length; 
		            var start = textarea.selectionStart; 
		            var end = textarea.selectionEnd; 
		            var sel = textarea.value.substring(start, end); 
		            var prefix = "[CODEINLINE]";  
		            var suffix = "[/CODEINLINE]"; 
		            var replace = prefix + sel + suffix; 
		            textarea.value = textarea.value.substring(0, start) + replace + textarea.value.substring(end, len); 
		            textarea.setSelectionRange(start + prefix.length, start + prefix.length + sel.length); 
		            textarea.scrollTop = scrollTop; 
		            textarea.focus(); 
		        })();

Identifiez-vous

Créer un compte

Deux nouvelles colorations syntaxique et quelques améliorations apportées à la balise CODE

Pour plus de confort sur les forums de Developpez.com

Identifiant
Mot de passe

Mot de passe oublié ?

Identifiez-vous

Créer un compte

Deux nouvelles colorations syntaxique et quelques améliorations apportées à la balise CODE Pour plus de confort sur les forums de Developpez.com

Deux nouvelles colorations syntaxique et quelques améliorations apportées à la balise CODE

Pour plus de confort sur les forums de Developpez.com