[Problème] Éditeur JCE... GRrrr !

[PhilJ]

Bonjour,


Je rencontre 2 problèmes avec JCE, l'un concernant l'affichage en mode code colorisé (icône <>), l'autre concernant l'insertion d'espaces dans un texte déjà enregistré.

_________________

1 – Premier souci : en mode code colorisé, JCE tronçonne visuellement les blocs (typiquement : les paragraphes), rendant laborieux le contrôle du code. Bien entendu (et heureusement !), les blocs ne sont que visuellement découpés en sous-ensembles : en réalité, le code est intact. C'est seulement très perturbant lorsqu'on a à intervenir dans le code.

Copies d'écran :

a) WYSIWYG :




b) Mode code colorisé (les coupures de lignes sont marquées d'une croix X) :




c) Le code brut (Toggle editor) par défaut est normal...




d) ... sauf si, préalablement, on est passé en mode code colorisé : on retrouve alors le problème d'affichage évoqué :



Les coupures ont toujours lieu aux alentours de 250 à 260 signes, ce qui, par exemple, découpera un paragraphe de 650 caractères en 3.

Regardées avec Firebug, on comprend un peu mieux les coupures, mais sans pour autant les expliquer.

Voici par exemple le code de l'un des paragraphes tronçonné, en l'occurrence en 2 sous-blocs visuels :
—

<div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="position: absolute; left: -29px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 20px;">8</div></div><pre class=""><span><span class="cm-tag cm-bracket">&lt;</span><span class="cm-tag">p</span><span class="cm-tag cm-bracket">&gt;</span>Nunc placerat egestas vehicula. Fusce eu risus sit amet metus sagittis volutpat vehicula porttitor elit. Sed fringilla purus sed mi scelerisque scelerisque. Donec vel enim ligula. Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus,</span></pre></div>

<div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="position: absolute; left: -29px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 20px;">9</div></div><pre class=""><span><span class="cm-tab"> </span>sed gravida arcu. Aliquam erat volutpat. Cras eu quam vitae magna cursus adipiscing. Etiam quis mi lacus. Proin fermentum velit non ligula malesuada imperdiet. Sed sapien enim, porta vel tempus sed, suscipit quis nisl. In vestibulum ut massa eu feugiat.<span class="cm-tag cm-bracket">&lt;/</span><span class="cm-tag">p</span><span class="cm-tag cm-bracket">&gt;</span></span></pre></div>

Je précise que ce problème existe sous Firefox et Chrome, avec des écrans de tailles différentes, mais qu'il est apparu récemment, sur des sites sous Joomla 3.x et sous Joomla 2.5. En revanche, il ne se manifeste pas du tout sur un site sous J! 3 pour lequel ni JCE ni Joomla n'ont été mis à jour depuis plusieurs mois.

...Vous devinez sûrement mes questions :
—

1. Observez-vous le même phénomène ?
2. Si oui, avez-vous trouvé une solution ?

_________________

2 - Deuxième souci : l'insertion d'espaces (barre d'espace) en mode WYSIWYG se traduit parfois par l'insertion d'espaces insécables (code &nbsp;).

Je dirais, sans pouvoir le certifier, que cela se produit surtout lorsque le texte comporte des styles inline (= <span>) ou des valorisations typographiques (= <strong>, <em>...), mais le résultat est qu'un petit article plusieurs fois édité peut vite se trouver totalement envahi de &nbsp; intempestifs, ce qui ne manque pas de perturber l'affichage / la mise en page, notamment sur smartphones.

Seule solution trouvée : passer en mode code () et remplacer un à un les &nbsp; surnuméraires par des espaces normales — en tâchant de garder ceux qui sont vraiment utiles.


=> Mêmes questions que ci-dessus.


D'avance merci si vous avez des pistes, sinon je tâcherai de contacter le développeur.



Bonne soirée,

[lomart]

Re : Éditeur JCE... GRrrr !

Bonjour PhilJ,

Pour ton souci n° 2, je l'ai également remarqué. Sur le coup, n'ayant pas le temps d'en comprendre la raison, j'ai effacé les &nbsp; en trop. Après tests, JCE remplace les espaces supplémentaires entre les mots par ces fameux espaces insécables lors de l'enregistrement. Cela se règle à l'aide du paramètre "Conversion des espaces" dans la configuration globale de JCE.

Pour ton souci n°1, je ne peux pas te répondre, car j'utilise CodeMirror plus Emmet Editor qui en plus de générer une structure HTML permet de ré-indenter le code et met en évidence l'appairage des balises. Rokpad reformate également le code, mais a la fâcheuse habitude de supprimer les espaces après les balises fermantes. Je l'utilise surtout pour la clarté de ses infos lors de recherche-remplacements.

[marcopolo29]

Re : Éditeur JCE... GRrrr !

Bonjour,

Hé,oui ! Le langage de programmation évolue, donc les outils se mettent à jour ! Voilà pourquoi tu trouves des erreurs.

Je précise que ce problème existe sous Firefox et Chrome, avec des écrans de tailles différentes, mais qu'il est apparu récemment, sur des sites sous Joomla 3.x et sous Joomla 2.5. En revanche, il ne se manifeste pas du tout sur un site sous J! 3 pour lequel ni JCE ni Joomla n'ont été mis à jour depuis plusieurs mois.

La balise <pre></pre> est utilisé pour afficher des blocs de code ! Donc elle joue son rôle.
Après je vois un paragraphe dans une balise <span> ? Pourquoi ne pas l'insérer dans <p> ? Il y a beaucoup de balise <span> dans ton code ! Crois-tu qu'un programme informatique arrive à s'y retrouver dans tout les <span> ?

Ensuite, je vois la balise <div> un peu partout, elle est utilisé normalement pour une mise en forme du code css (elle sert de conteneur).
Après je vois plusieurs class dans différentes balises ?
Tu peux insérer plusieurs class dans une seule balise <balise class="1" class="2" class="3"> ça fonctionne, il suffit juste de laisser un espace entre.

[PhilJ]

Re : Éditeur JCE... GRrrr !

Bonjour Marcopolo,

[...] La balise <pre></pre> est utilisé pour afficher des blocs de code ! Donc elle joue son rôle. Après je vois un paragraphe dans une balise <span> ? Pourquoi ne pas l'insérer dans <p> ? Il y a beaucoup de balise <span> dans ton code ! [...]

Merci de me relire plus attentivement et surtout de regarder les captures d'écran de (plus) près : il n'y a aucun <span> et aucun <div> dans mon code, seulement des paragraphes (= <p>...</p>).

Le code reproduit est celui qui est visible avec Firebug, et ce n'est absolument pas le mien : c'est celui de CodeMirror.

En un sens, il est normal que le code en mode code diffère du mien puisque nous sommes alors en mode code colorisé (CodeMirror) : il y a des numéros de lignes (qui ne sont évidemment pas de mon fait), les tags et les classes sont colorisés, etc. Ce qui, en revanche, me paraît anormalement perturbant (et nouveau), c'est le tronçonnage systématique des paragraphes, même les plus simples (= (= <p>...</p> sans aucun style inline ajouté) quand on passe dans ce mode.


Merci tout de même de ton intervention.



Cordialement,

[PhilJ]

Re : Éditeur JCE... GRrrr !

Bonjour,

Pour ton souci n° 2, je l'ai également remarqué. Sur le coup, n'ayant pas le temps d'en comprendre la raison, j'ai effacé les * en trop. Après tests, JCE remplace les espaces supplémentaires entre les mots par ces fameux espaces insécables lors de l'enregistrement. Cela se règle à l'aide du paramètre "Conversion des espaces" dans la configuration globale de JCE.

Merci. Je viens d'appliquer cette modification sur un site. Je ne manquerai pas de revenir dire dans quelques temps si elle s'avère efficace.

Pour ton souci n°1, je ne peux pas te répondre, car j'utilise CodeMirror plus Emmet Editor qui en plus de générer une structure HTML permet de ré-indenter le code et met en évidence l'appairage des balises.

J'avais déjà repéré cette extension et je me suis déjà demandé si elle pourrait servir de solution à ce problème. Je crois comprendre qu'elle est prise en charge par JCE en mode code colorisé, mais peux-tu me le confirmer ?


D'avance merci.

[PieceOfCake]

Re : Éditeur JCE... GRrrr !

Crois-tu qu'un programme informatique arrive à s'y retrouver dans tout les <span> ?

Le problème est que c'est bien souvent JCE lui-même qui les rajoute ces balises <span> et (avis personnel), lesmises à jours successives récentes ont déstabilisé un code qui était plutôt bon. Il n'est qu'à voir quelques problèmes spécieux très énervant récemment introduits comme par exemple
* un bloc commenté <!-- blabla --> marche très bien, mais en placer deux à se suivre fait que tout disparaît corps et bien
* ou les style="text-align:justify (ou left ou autre)" qui depuis peu ne sont plus reproduit lors du passage au paragraphe suivant, mais qui reviennent si au lieu d'un paragraphe on crée un en-tête (h2 style="text-align: justify" n'est pas forcément juste dans l'esprit

enfin bref, je pense que JCE a subi trop de changements récemment et s'est pas mal déstabilisé (il reste tout de même (encore) le meilleur à mon sens ... pourvu que ça dure)

Cordialement

[lomart]

Re : Éditeur JCE... GRrrr !

Je ne manquerai pas de revenir dire dans quelques temps si elle s'avère efficace.

En ce qui me concerne, cela évite l'ajout des espaces durs lors de la sauvegarde

Je crois comprendre qu'elle est prise en charge par JCE en mode code colorisé, mais peux-tu me le confirmer ?

Non, c'est un éditeur autonome. Je bascule de l'un à l'autre avec Editor Switcher
J'ai adapté le fichier d'aide au français. Tu trouveras le fichier sur ce post http://forum.joomla.fr/showthread.ph...=1#post1040625 ainsi que la petite adaptation CSS à faire pour que l'éditeur remplisse la zone prévue

[PhilJ]

Re : Éditeur JCE... GRrrr !

@PieceOfCake :

Merci du soutien .

__________________

Concernant le 1^er problème évoqué, il est important de comprendre que mon code est on ne peut plus simple et propre :
—

<p>Nunc placerat egestas vehicula. Fusce eu risus sit amet metus sagittis volutpat vehicula porttitor elit. Sed fringilla purus sed mi scelerisque scelerisque. Donec vel enim ligula. Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Cras eu quam vitae magna cursus adipiscing. Etiam quis mi lacus. Proin fermentum velit non ligula malesuada imperdiet. Sed sapien enim, porta vel tempus sed, suscipit quis nisl. In vestibulum ut massa eu feugiat.</p>

Pas de <span> ni même de <strong> ou <em>. Juste un paragraphe, mais qui a le tort d'excéder 250 caractères, « d'où » sa division en blocs visuels quand on regarde le code (icône <>), en l'occurrence en 2 blocs :
—

<div style="position: relative;">...</div>

<div style="position: relative;">...</div>

...Et c'est cela qui ne va pas, et que je parviens pas à empêcher.

Soit il s'agit d'un bug, soit il s'agit d'un mauvais réglage chez moi.

On peut ajouter que, dans un cas comme dans l'autre, il est difficile de déterminer l'origine du souci, car JCE s'appuie sur TinyMCE... et sur CodeMirror. La faute ou le mauvais réglage n'est donc pas forcément à rechercher dans JCE...

[PhilJ]

Re : Éditeur JCE... GRrrr !

A propos de Emmet :

Non, c'est un éditeur autonome. Je bascule de l'un à l'autre avec Editor Switcher
J'ai adapté le fichier d'aide au français. Tu trouveras le fichier sur ce post http://forum.joomla.fr/showthread.ph...=1#post1040625 ainsi que la petite adaptation CSS à faire pour que l'éditeur remplisse la zone prévue

Aïe. Donc ça peut encore aller pour moi (et il m'arrive à moi aussi d'installer 'Editor Switcher' — ou équivalent — pour pouvoir changer d'éditeur), mais pas pour les clients :-\

[lomart]

Re : Éditeur JCE... GRrrr !

La faute ou le mauvais réglage n'est donc pas forcément dans JCE...

Si je me base sur ton souci n°2. Si j'écris du texte en mode code avec plusieurs espaces, JCE ajoute les espaces insécables au moment de l'enregistrement avant de rebasculer en wysiwyg. Cela prouve qu'il agit bien sur le formatage des autres éditeurs.

[PhilJ]

Re : Éditeur JCE... GRrrr !

Si je me base sur ton souci n°2. Si j'écris du texte en mode code avec plusieurs espaces, JCE ajoute les espaces insécables au moment de l'enregistrement avant de rebasculer en wysiwyg. [...]

En mode code, cela me paraît assez normal / justifié — du moins dans le cas de l'insertion de plusieurs espaces consécutives. Le problème est l'ajout de &nbsp; quand on utilise la barre d'espace en mode WYSIWYG. Il suffit parfois de supprimer une espace (= espace normale) puis d'utiliser la barre d'espace pour la réintroduire, et zou, on a droit à un &nbsp; indésirable dans le code :-\

[lomart]

Re : Éditeur JCE... GRrrr !

En mode code, cela me paraît assez normal / justifié

Ce n'était pas le sens de mon propos. Je m'appuyais sur cet exemple pour montrer que JCE modifie/adapte le texte même en mode code.

cela me paraît assez normal / justifié — du moins dans le cas de l'insertion de plusieurs espaces consécutives.

Non, pour moi la saisie de code ne doit pas être modifiée. On passe justement dans ce mode pour pouvoir faire ce que l'on veut. Qu'un éditeur fasse de l'autocomplétion et de l'assistance à la saisie, je suis entièrement d'accord, mais on valide sa suggestion. Ensuite, il ne doit plus y toucher !

[PhilJ]

Re : Éditeur JCE... GRrrr !

...Je comprends, et même en un sens j'approuve (= en mode code, on devrait pouvoir faire exactement ce que l'on veut sans que l'éditeur utilisé ne vienne s'en mêler), mais d'un autre côté, le cas de plusieurs espaces consécutives est assez typiquement défectueux puisque, sauf erreur, les navigateurs les ramènent spontanément à une seule.

[lomart]

Re : Éditeur JCE... GRrrr !

mais d'un autre côté, le cas de plusieurs espaces consécutives est assez typiquement défectueux puisque, sauf erreur, les navigateurs les ramènent spontanément à une seule.

Pas si tu utilises une balise PRE ou la propriété CSS white-space
En mode code, c'est moi qui décide de tout .. ou du moins j'en ai le désir

[PhilJ]

Re : Éditeur JCE... GRrrr !

Oui, bien d'accord, mais là on s'éloigne de l'usage basique de la barre d'espace. De plus, ces balises s'ajoutent en mode code, alors que le problème pointé survient en mode WYSIWIG.