Deux nouvelles colorations syntaxiques et quelques améliorations apportées à la balise CODE [Nouveauté]

**Médinoc** · 28/09/2011, 09h36

Oups.

Edit: ↓ Merci!

**tomlev** · 28/09/2011, 10h27

Envoyé par Médinoc

Bonjour,
Serait-il possible d'avoir un bouton pour la balise CODEINLINE ? Elle est plus longue à taper que la plupart des autres balises...

Perso je me suis fait un "marque-page script" pour ça. Voilà le code :

Code Javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

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();})();

Tu mets ça dans un marque-page que tu appelles [CODEINLINE], et tu as ton bouton... Ca fonctionne sous Firefox, pour les autres navigateurs je sais pas.

(ouais, c'est moche... en clair ça donne ça : )

Code Javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
		        (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();
		        })();

**tumoo** · 28/09/2011, 10h30

TestImpec

**Bisûnûrs** · 28/09/2011, 12h21

Hop, j'ai dev une extension Chrome qui ajoute un bouton à l'éditeur standard. J'ai pas testé les autres éditeurs. La version Firefox va arriver prochainement.

Extension Chrome :
http://j-willette.developpez.com/dev...codeinline.crx

**Bisûnûrs** · 28/09/2011, 16h20

Et voici l'extension Firefox :
http://j-willette.developpez.com/dev...codeinline.xpi

J'ai mis la validité de l'extension jusqu'à la version 8 incluse, je devrais être tranquille pendant 12 petites semaines. Au pire, vous pouvez toujours modifier le XPI vous-même pour augmenter la validité de l'extension sur les futures versions de Firefox.

**tomlev** · 28/09/2011, 16h54

Envoyé par Bisûnûrs

Et voici l'extension Firefox :
http://j-willette.developpez.com/dev...codeinline.xpi

Excellent, merci !
Juste un léger bug : après avoir cliqué sur le bouton, la zone de texte perd le focus. Il faudrait que ça fasse comme le bouton de la balise CODE : ça sélectionne le contenu de la balise et ça laisse le focus sur la zone de texte.

Sinon, une petite suggestion : il y a d'autres balises "cachées" pour lesquelles il n'y a pas de bouton, ce serait sympa de les inclure aussi :
- NOPARSE (empêche le parsing du BBCode dans cette balise)
- PRE (texte préformaté)
et peut-être d'autres, mais c'est les seules que je connais

**Bisûnûrs** · 28/09/2011, 17h00

Envoyé par tomlev

après avoir cliqué sur le bouton, la zone de texte perd le focus

J'avais vu ça, le problème n'est que sur l'extension Firefox, pas sur Chrome, me suis dit que ça irait très bien pour commencer, que si j'avais un peu plus de temps je regarderais de plus près.

D'ailleurs, j'ai pris ton code pour faire les deux extensions (que j'ai adapté pour jQuery), tu ne m'en voudras pas.

Envoyé par tomlev

il y a d'autres balises "cachées" pour lesquelles il n'y a pas de bouton, ce serait sympa de les inclure aussi :
- NOPARSE (empêche le parsing du BBCode dans cette balise)
- PRE (texte préformaté)

La base est faite, inclure des boutons serait très facile désormais. Je regarde ça aussi dès que j'ai un peu de temps.

**danielhagnoul** · 28/09/2011, 17h49

Envoyé par Bisûnûrs

Et voici l'extension Firefox :
http://j-willette.developpez.com/dev...codeinline.xpi

J'ai mis la validité de l'extension jusqu'à la version 8 incluse, je devrais être tranquille pendant 12 petites semaines. Au pire, vous pouvez toujours modifier le XPI vous-même pour augmenter la validité de l'extension sur les futures versions de Firefox.

Bonjour

Intéressant, mais j'aimerais voir ces boutons pour DVP dans la "Barre d'outils pour Firefox" de http://www.developpez.net/forums/u120985/beekeep/.

Vous pourriez sans doute travailler ensemble sur ce point, ce qui permettrait de centraliser tout sur une seule barre d'outils.

**tomlev** · 28/09/2011, 18h13

Envoyé par danielhagnoul

Intéressant, mais j'aimerais voir ces boutons pour DVP dans la "Barre d'outils pour Firefox" de http://www.developpez.net/forums/u120985/beekeep/.

Vous pourriez sans doute travailler ensemble sur ce point, ce qui permettrait de centraliser tout sur une seule barre d'outils.

Bah c'est plus pratique d'avoir le bouton directement au niveau de l'éditeur que dans une barre d'outils... Perso j'aime pas les barres d'outils, ça encombre l'écran.

**Bisûnûrs** · 28/09/2011, 18h53

Après rien n'empêche de voir avec beekeep pour intégrer ça dans sa barre d'outils, mais de garder une version standalone. D'ailleurs je suis de l'avis de tomlev en ce qui concerne les barres d'outils.

**beekeep** · 28/09/2011, 20h01

Envoyé par Bisûnûrs

Après rien n'empêche de voir avec beekeep pour intégrer ça dans sa barre d'outils, mais de garder une version standalone.

oui ça serait bien, et ça permettrai aux utilisateur actuels (150) d'en bénéficier sans aller chercher quoi que ce soit.

par contre est-ce qu'il existe une version du code qui n'utilise pas de framework ?

Envoyé par tomlev

Bah c'est plus pratique d'avoir le bouton directement au niveau de l'éditeur que dans une barre d'outils... Perso j'aime pas les barres d'outils, ça encombre l'écran.

pourquoi est-ce le fonctionnement serait différent une fois intégré dans un autre module ?

et au passage de nombreuses fonctionnalités de FireDVP sont accessibles sans afficher de barre d'outils, les boutons peuvent être intégrés n'importe où dans l'interface de Firefox.

**tomlev** · 28/09/2011, 20h15

Envoyé par beekeep

pourquoi est-ce le fonctionnement serait différent une fois intégré dans un autre module ?

En fait j'avais cru comprendre que danielhagnoul suggérait de mettre ces boutons sur la barre DVP...

Envoyé par beekeep

et au passage de nombreuses fonctionnalités de FireDVP sont accessibles sans afficher de barre d'outils, les boutons peuvent être intégrés n'importe où dans l'interface de Firefox.

Ah ok, j'aime déjà mieux

**Bisûnûrs** · 28/09/2011, 22h02

Envoyé par beekeep

par contre est-ce qu'il existe une version du code qui n'utilise pas de framework ?

Pour le moment, non, vu que je manipule pas mal le DOM j'ai trouvé beaucoup plus aisé d'utiliser un framework.

Je peux toujours essayer de te donner une version qui fonctionne sans framework, mais ça sera pas pour tout de suite du coup ..

Autre chose, pour afficher la nouvelle icône dans l'éditeur, je n'utilise pas un fichier image, mais une image encodée directement en base64, est-ce que ça te poserait un problème particulier ?

**beekeep** · 29/09/2011, 00h30

Envoyé par Bisûnûrs

Pour le moment, non, vu que je manipule pas mal le DOM j'ai trouvé beaucoup plus aisé d'utiliser un framework.

Je peux toujours essayer de te donner une version qui fonctionne sans framework, mais ça sera pas pour tout de suite du coup ..

ok merci

je regarderai ça plus tard si tu n'as pas le temps.

Envoyé par Bisûnûrs

Autre chose, pour afficher la nouvelle icône dans l'éditeur, je n'utilise pas un fichier image, mais une image encodée directement en base64, est-ce que ça te poserait un problème particulier ?

non pas de soucis.

par la suite vaut mieux ne pas trop polluer cette discussion. >ICI

**tomlev** · 27/10/2011, 16h00

Envoyé par Bisûnûrs

J'avais vu ça, le problème n'est que sur l'extension Firefox, pas sur Chrome, me suis dit que ça irait très bien pour commencer, que si j'avais un peu plus de temps je regarderais de plus près.

D'ailleurs, j'ai pris ton code pour faire les deux extensions (que j'ai adapté pour jQuery), tu ne m'en voudras pas.

La base est faite, inclure des boutons serait très facile désormais. Je regarde ça aussi dès que j'ai un peu de temps.

Salut, est-ce que tu as trouvé le temps de faire la modif ? J'utilise tout le temps ce bouton, donc ce serait cool si tu pouvais corriger

**Anomaly** · 10/01/2012, 17h47

Petite mise à jour effectuée aujourd'hui qui devrait, je l'espère, régler le problème de ceux qui constataient que les numéros de lignes n'étaient pas alignés avec le code dans la fenêtre "Visualiser le code dans une fenêtre à part".

**andry.aime** · 11/01/2012, 12h21

.

**Richard_35** · 11/01/2012, 19h13

Bonjour à tous (et bonne année 2012, bonne santé, aux mêmes),

Je me réveille un peu tard, mais bon

Envoyé par Bisûnûrs

Hop, j'ai dev une extension Chrome qui ajoute un bouton à l'éditeur standard. J'ai pas testé les autres éditeurs. La version Firefox va arriver prochainement.

Extension Chrome :
http://j-willette.developpez.com/dev...codeinline.crx

Excellent ! ...

... et encore ...

**Anomaly** · 11/01/2012, 19h17

Si tout le monde trouve indispensable d'installer une extension pour disposer du bouton CodeInline, alors il faudrait donc que je change d'avis et que je le mette en standard.

Qu'en pensez-vous ?

Ou alors pensez-vous que je devrais abréger le nom de cette balise en [C] tout simplement ?

Que pensez-vous du risque de confusion ?

Quelle type d'icône suggérez-vous pour ce bouton ?

**Domi2** · 11/01/2012, 19h25

Bonsoir,

Personnellement, j'utilise la barre d'outils FireDVP et effectivement, je trouve très pratique.

C'est facilement entré dans mes habitudes, je n'y fais même plus attention, en plus il tellement bien fait que j'en suis à me demander si ce n'est pas du vBulletin standard.

Donc oui, je pense que ce serait une bonne chose de l'intégrer.

L'icône est identique à celui du code, avec un "2" en indice. Pourquoi pas simplement le même icône que le code avec un "i" en indice ?

Domi2

Deux nouvelles colorations syntaxiques et quelques améliorations apportées à la balise CODE [Nouveauté]

Discussions similaires

Partager

Partager