Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

PHP et Unicode - quel est le truc ?

1 view
Skip to first unread message

Denis Beauregard

unread,
Jul 26, 2011, 11:59:57 AM7/26/11
to
Bonjour,

Je voudrais afficher le caractère Unicode 2533 (une sorte de T, voir
http://www.unicode.org/charts/PDF/U2500.pdf ).

J'ai suivi les instructions mais php.net est assez vague de ce côté.
J'ai essayé ce script :


<!DOCTYPE html PUBLIC "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=UTF-8">
<meta name="Author" content="Denis Beauregard">
</head>
<body >

test[\p{2533}]test

</body>
</html>


Il affiche test[\p{2533}]test et non le caractère attendu.

Idem avec \P.
\X2533 donne %33

Donc, je conclus qu'il ne s'agit ici que d'expressions régulières
pour la recherche, sans rapport avec un affichage.

&#2533; affiche un caractère bizarre qui est peut-être celui demandé.

La documentation mentionne un mode UTF-8 sans donner plus de détails.
Je n'ai pas non plus d'exemple sur l'utilisation du Unicode en PHP.

1. Comment fait-on pour afficher ce caractère 2533 en HTML ou PHP.
2. Faut-il installer quelque chose dans le navigateur pour que
l'affichage se fasse ? J'ai essayé Seamonkey, FF et IE 8.

Le caractère semble visible si je choisis UTF-16 comme affichage,
donc il me semble que le jeu requis est présent dans le navigateur.
Par contre, si je place &#2533; au début du fichier, je n'ai pas
mon fameux caractère.


Denis

Sergio

unread,
Jul 26, 2011, 12:16:19 PM7/26/11
to
Le 26/07/2011 17:59, Denis Beauregard a écrit :
> Bonjour,
>
> Je voudrais afficher le caractère Unicode 2533 (une sorte de T, voir
> http://www.unicode.org/charts/PDF/U2500.pdf ).
>
> J'ai suivi les instructions mais php.net est assez vague de ce côté.
> J'ai essayé ce script :
>
>
> <!DOCTYPE html PUBLIC "-//w3c//dtd html 4.0 transitional//en">
> <html>
> <head>
> <meta http-equiv="Content-Type"
> content="text/html; charset=UTF-8">
> <meta name="Author" content="Denis Beauregard">
> </head>
> <body>
>
> test[\p{2533}]test
>
> </body>
> </html>

Là, je ne vois pas une once de PHP !

Soit tu mets :

test &#2533; test

(qui est du HTML)

Soit si tu veux du PHP :

<?php
echo "\x2533" ;
?>


--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org

Denis Beauregard

unread,
Jul 26, 2011, 1:53:25 PM7/26/11
to
Le Tue, 26 Jul 2011 18:16:19 +0200, Sergio
<serge....@delbono.net.invalid> écrivait dans
fr.comp.infosystemes.www.auteurs:


echo "\x2533" donne le même %33 que j'obtenais.

Dans les faits, mon script va produire des dessins avec les caractères
de la série 2500-257F, quelque chose comme $a="----+----", le tout
suivi d'un echo a$.b$;

Je vois 3 difficultés:

1- affichage en html des caractères Unicode. Si cela passe sans
problème, les autres difficultés sont résolues.
2- manipuler les chaînes Unicode que je veux utiliser en PHP
3- affichage par le navigateur s'il faut ajouter quelque chose.


Denis

SAM

unread,
Jul 26, 2011, 1:55:02 PM7/26/11
to
Le 26/07/11 18:16, Sergio a écrit :

> Le 26/07/2011 17:59, Denis Beauregard a écrit :
>> Bonjour,
>>
>> Je voudrais afficher le caractère Unicode 2533 (une sorte de T, voir
>> http://www.unicode.org/charts/PDF/U2500.pdf ).
>
> Soit si tu veux du PHP :
>
> <?php
> echo "\x2533" ;
> ?>

et si on le veut en JavaScript :
hop! :
alert('\u2533');


On pourra préférer : &#252C; ( \x252C \u252C )
<http://www.miakinen.net/vrac/charsets/?hv=h&o6=CP437&or=5&pr=194>
qui est un peu plus gras

--
Stéphane Moriaux avec/with iMac-intel

SAM

unread,
Jul 26, 2011, 2:03:35 PM7/26/11
to
Le 26/07/11 19:53, Denis Beauregard a écrit :

>> Le 26/07/2011 17:59, Denis Beauregard a écrit :
>>> Bonjour,
>>>
>>> Je voudrais afficher le caractère Unicode 2533 (une sorte de T, voir
>>> http://www.unicode.org/charts/PDF/U2500.pdf ).
>
>

> echo "\x2533" donne le même %33 que j'obtenais.

essayer avec :
echo '\u2533';
?

> Dans les faits, mon script va produire des dessins avec les caractères
> de la série 2500-257F, quelque chose comme $a="----+----", le tout

$a = '&#9472;&#9472;&#9472;&#9516;&#9472;&#9472;&#9472;';

peut-être ?

ou directement en utf-8 ?

───┬───


Du lien donné précédemment on pourra s'inspirer du tableau du CP437

Denis Beauregard

unread,
Jul 26, 2011, 2:03:39 PM7/26/11
to
Le Tue, 26 Jul 2011 11:59:57 -0400, Denis Beauregard
<denis.b-at-franc...@nospam.com.invalid> écrivait dans
fr.comp.infosystemes.www.auteurs:

>Je voudrais afficher le caractère Unicode 2533 (une sorte de T, voir
>http://www.unicode.org/charts/PDF/U2500.pdf ).
>

J'ai fini par découvrir l'astuce. Il suffit de faire par exemple :


&#x2533;

Curieusement, ma page est détectée comme latin1 par le navigateur mais
ce caractère est affiché en unicode.


Denis

Denis Beauregard

unread,
Jul 26, 2011, 2:12:25 PM7/26/11
to
Le Tue, 26 Jul 2011 20:03:35 +0200, SAM
<stephanemor...@wanadoo.fr.invalid> écrivait dans
fr.comp.infosystemes.www.auteurs:

>Le 26/07/11 19:53, Denis Beauregard a écrit :
>
>>> Le 26/07/2011 17:59, Denis Beauregard a écrit :
>>>> Bonjour,
>>>>
>>>> Je voudrais afficher le caractère Unicode 2533 (une sorte de T, voir
>>>> http://www.unicode.org/charts/PDF/U2500.pdf ).
>>
>>
>> echo "\x2533" donne le même %33 que j'obtenais.
>
>essayer avec :
> echo '\u2533';
>?

Avec

$dessin = "-+-&#x2501;&#x2533;&#x2501;\u2501\u2533\u2501";

seul le &#x donne le bonne résultat. \u est affiché tel quel.


>> Dans les faits, mon script va produire des dessins avec les caractères
>> de la série 2500-257F, quelque chose comme $a="----+----", le tout
>
>$a = '&#9472;&#9472;&#9472;&#9516;&#9472;&#9472;&#9472;';
>
>peut-être ?
>
>ou directement en utf-8 ?
>

> ???????


>
>
>Du lien donné précédemment on pourra s'inspirer du tableau du CP437

Le tableau est intéressant. Je dois recycler du code écrit pour DOS
à l'époque, en CP850 et variations, et je sais que j'utilisais ces
caractères. En fait, je ré-écris en PHP un éditeur qui était en ASM
8086 pour DOS et je dois sans doute prévoir la conversion des accents.

L'affichage à l'écran est vraiment autre chose.


Denis

SAM

unread,
Jul 26, 2011, 2:39:56 PM7/26/11
to
Le 26/07/11 20:12, Denis Beauregard a écrit :

> Le Tue, 26 Jul 2011 20:03:35 +0200, SAM
> <stephanemor...@wanadoo.fr.invalid> écrivait dans
> fr.comp.infosystemes.www.auteurs:
>>
>> ou directement en utf-8 ?
>>
>> ???????

heu ...

ou directement en utf-8 ?

───┬───


si le news-reader ne le fait pas tout seul, passer en affichage UTF-8

Olivier Miakinen

unread,
Jul 26, 2011, 3:57:04 PM7/26/11
to
Le 26/07/2011 19:53, Denis Beauregard a écrit :
>>>
>>> Je voudrais afficher le caractère Unicode 2533 (une sorte de T, voir
>>> http://www.unicode.org/charts/PDF/U2500.pdf ).
>
> echo "\x2533" donne le même %33 que j'obtenais.

Oui, cela correspond à ce que l'on peut lire ici :

http://www.php.net/manual/fr/language.types.string.php#language.types.string.syntax.double
<cit.>
\x[0-9A-Fa-f]{1,2} La séquence de caractères correspondant à une
expression régulière est un caractère, en notation hexadécimale
</cit.>

Le « {1,2} » veut dire qu'il ne prend en compte que deux chiffres hexa
au maximum, donc "\x25" suivi de "3" et encore de "3" : "%33".


Tiens, voici une page en or à mettre dans tes marque-pages :
http://people.w3.org/rishida/scripts/uniview.fr/conversion.html

Tu mets 2533 dans le cadre « Numéros de caractères en hex », puis tu
cliques dans un autre cadre, et tu obtiens :

========================================================
2533 (Numéros de caractères en hex)
┳ (Caractères)
E2 94 B3 (Unités de code UTF-8)
2533 (Unités de code UTF-16)
&#x2533; (Appels de caractère numériques hex)
&#9523; (Appels de caractère numériques décimaux)
========================================================

Les différentes possibilités sont donc :
=====================================================================
┳ (si le codage de ton fichier admet Unicode, par exemple UTF-8)
<?php echo "\xE2\x94\xB3"; ?> (si le codage *est* UTF-8)
&#x2533; (si le codage est compatible Ascii, tel Latin1 ou UTF-8)
&#9523; (si le codage est compatible Ascii, tel Latin1 ou UTF-8)
=====================================================================

Attention dans les deux derniers cas à ne pas oublier le point-virgule !


Cordialement,
--
Olivier Miakinen

Olivier Miakinen

unread,
Jul 26, 2011, 4:08:38 PM7/26/11
to
Le 26/07/2011 20:03, Denis Beauregard a écrit :
>
> J'ai fini par découvrir l'astuce. Il suffit de faire par exemple :
>
> &#x2533;

Oui, c'est une référence de caractère numérique (hexadécimale) et c'est
défini dans HTML :
http://www.la-grange.net/w3c/html4.01/charset.html#h-5.3.1

> Curieusement, ma page est détectée comme latin1 par le navigateur

C'est sûrement que l'entête HTTP déclare du Latin1, puisque le meta
http-equiv déclare UTF-8. Pour que les deux soient corrects à la fois,
il faut que la page ne contienne que de l'US-ASCII, ce qui est assez
restrictif. ;-) Il vaudrait mieux que tu choisisses l'un ou l'autre
(Latin1 ou UTF-8) et que tu changes la déclaration qui affirme le
contraire.

> mais ce caractère est affiché en unicode.

Par définition, une référence de caractère numérique donne le numéro
Unicode du caractère, quel que soit le charset du document. Mais cela
fonctionne parce que tous les caractères réellement utilisés pour cette
référence, à savoir '&', '#', 'x', '2', '5', '3', '3' et ';', sont de
l'US-ASCII, et que US-ASCII est compatible à la fois avec Latin1 et
avec UTF-8. J'espère que tu me comprends, parce que c'est une notion
assez importante à bien saisir. Si tu n'as pas compris, demande !

Cordialement,
--
Olivier Miakinen

Denis Beauregard

unread,
Jul 26, 2011, 9:04:14 PM7/26/11
to
Bonjour,


Pour les curieux qui voudraient voir le résultat, c'est sur
http://www.francogene.com/SE/index.php

J'ai encore quelques problèmes à résoudre. Tout d'abord, remplacer le
X par quelque chose qui ressemble plus à une astérisque mais qui
soit de la même largeur que les autres caractères.

Voir colonnes puis P(08) strtrim

Avec d'autres caractères que le X, la ligne au-dessus de "NUL Ne rien
faire", n'est pas à sa place. Le X fait partie de la page 25xx. C'est
comme si Seamonkey (que j'ai utilisé pour mes tests) gardait la même
largeur que le caractère précédent quand on en utilise un plus étroit.


Un autre problème est l'espacement des caractères. Avec Gecko/20110420
SeaMonkey/2.0.14, c'est parfait horizontalement mais les traits sont
espacés verticalement. Avec FireFox 4.01, il y a des espaces dans les
deux axes. IE 8 agit comme Seamonkey. Je n'ai pas testé avec d'autres
navigateurs... Je suppose que pour l'axe vertical, c'est une question
de CSS, mais pour l'horizontal, peut-être une valeur par défaut
différente avec FF et que je pourrais changer.


Et mon problème majeur, ce sera de modifier le texte et les schémas,
mais c'est mon problème je pense. J'ai vu qu'il y a un grand nombre
d'éditeurs de texte pour Javascript.


Denis

P.S. Pour ceux qui n'ont pas compris, c'est un éditeur de code de
programmation avec du code de C++. Dans les années 1980, j'avais
aussi des utilisateurs avec d'autres langages comme le Fortran, le
Pascal et le PL/M. Et mon premier prototype a été écrit en Basic...

Denis Beauregard

unread,
Jul 26, 2011, 11:26:55 PM7/26/11
to
Le Tue, 26 Jul 2011 21:04:14 -0400, Denis Beauregard
<denis.b-at-franc...@nospam.com.invalid> écrivait dans
fr.comp.infosystemes.www.auteurs:

>Bonjour,


>
>
>Pour les curieux qui voudraient voir le résultat, c'est sur
>http://www.francogene.com/SE/index.php

Voir en particulier ce lien qui résume les éléments principaux.

http://www.francogene.com/SE/voir.php?module=2&proc=08&raf=0


>Un autre problème est l'espacement des caractères. Avec Gecko/20110420
>SeaMonkey/2.0.14, c'est parfait horizontalement mais les traits sont
>espacés verticalement. Avec FireFox 4.01, il y a des espaces dans les
>deux axes. IE 8 agit comme Seamonkey. Je n'ai pas testé avec d'autres
>navigateurs... Je suppose que pour l'axe vertical, c'est une question
>de CSS, mais pour l'horizontal, peut-être une valeur par défaut
>différente avec FF et que je pourrais changer.

Problème résolu avec du CSS.

Mais le dessin n'est joli qu'avec Seamonkey et FF. Avec IE 8, les
lignes ont des épaisseurs qui varient ou ne sont pas alignées.
C'est comme si IE avait défini différemment cette série de
caractères.


Denis

SAM

unread,
Jul 27, 2011, 6:08:51 AM7/27/11
to
Le 27/07/11 03:04, Denis Beauregard a �crit :
> Bonjour,
>
>
> Pour les curieux qui voudraient voir le r�sultat, c'est sur
> http://www.francogene.com/SE/index.php

Firefox 5 (Mac) :
- <http://cjoint.com/?AGBkHQIGeu6>
- <http://cjoint.com/?AGBkKui1z8d>
Safari.5 (Mac) :
- <http://cjoint.com/?AGBkKU6VO82>
- <http://cjoint.com/?AGBkLl7g7zi>

> J'ai encore quelques probl�mes � r�soudre.

pourquoi j'ai un changement de taille de police ?
(pour "Description" ou "Variables")
est-ce que �a n'influe pas sur le positionnement des dessins des lignes ?

> Tout d'abord, remplacer le

> X par quelque chose qui ressemble plus � une ast�risque mais qui
> soit de la m�me largeur que les autres caract�res.

� mon id�e, tous ces caract�res (y compris ceux alphanum�riques en
fontes web de M$) sont de m�me largeur/hauteur.

> Voir colonnes puis P(08) strtrim

Ha!?
Alors avec "mon" Firefox.5 : <http://cjoint.com/?AGBlBFfURF5>


> Avec d'autres caract�res que le X, la ligne au-dessus de "NUL Ne rien
> faire", n'est pas � sa place. Le X fait partie de la page 25xx. C'est
> comme si Seamonkey (que j'ai utilis� pour mes tests) gardait la m�me
> largeur que le caract�re pr�c�dent quand on en utilise un plus �troit.
>
>
> Un autre probl�me est l'espacement des caract�res.

tout s'arrange si on fait :

.dessin {
font-size: 15px;
letter-spacing: 0; /* auto ? ou ligne supprim�e ? */
line-height: 0;
font-family: arial; /* arial est r�put� pour bien fonctionner */
}

ou carr�ment :

pre {
font-size: 15px;
line-height: 13px;
font-family: arial, georgia, verdana;
}

source :
<http://covertprestige.info/html/espaces-unicode/>

et m�me, sans doute, les espaces pourraient �tre de simples espaces
si tout est dans une balise 'pre'
ou avec une r�gle :
white-space: pre;

--
St�phane Moriaux avec/with iMac-intel

SAM

unread,
Jul 27, 2011, 7:04:23 AM7/27/11
to
Le 27/07/11 12:08, SAM a �crit :

>
> tout s'arrange si on fait :

voir :
<http://cjoint.com/?AGBnduu4DkB>
<http://cjoint.com/11ju/AGBnduu4DkB_b-ascii__.htm>

Pierre Goiffon

unread,
Jul 27, 2011, 8:24:16 AM7/27/11
to
On 26/07/2011 22:08, Olivier Miakinen wrote:
>> Curieusement, ma page est d�tect�e comme latin1 par le navigateur
>
> C'est s�rement que l'ent�te HTTP d�clare du Latin1, puisque le meta
> http-equiv d�clare UTF-8. Pour que les deux soient corrects � la fois,

> il faut que la page ne contienne que de l'US-ASCII, ce qui est assez
> restrictif. ;-) Il vaudrait mieux que tu choisisses l'un ou l'autre
> (Latin1 ou UTF-8) et que tu changes la d�claration qui affirme le
> contraire.

Et si la page est servie en UTF-8 alors pas de soucis, pas besoin
d'entit� html ! Car bien s�r tous les caract�res pr�sents dans Unicode
pourront �tre utilis�s.

Denis Beauregard

unread,
Jul 27, 2011, 9:30:23 AM7/27/11
to
Le Wed, 27 Jul 2011 12:08:51 +0200, SAM
<stephanemor...@wanadoo.fr.invalid> �crivait dans
fr.comp.infosystemes.www.auteurs:

>Le 27/07/11 03:04, Denis Beauregard a �crit :
>> Bonjour,
>>
>>
>> Pour les curieux qui voudraient voir le r�sultat, c'est sur
>> http://www.francogene.com/SE/index.php
>
>Firefox 5 (Mac) :
>- <http://cjoint.com/?AGBkHQIGeu6>
>- <http://cjoint.com/?AGBkKui1z8d>
>Safari.5 (Mac) :
>- <http://cjoint.com/?AGBkKU6VO82>
>- <http://cjoint.com/?AGBkLl7g7zi>

On dirait qu'il y a que FF et Seamonkey sur Windows qui ont un espace
em de la m�me largeur que leurs dessins de lignes�

>> J'ai encore quelques probl�mes � r�soudre.
>
>pourquoi j'ai un changement de taille de police ?
>(pour "Description" ou "Variables")

Pour que les lignes se touchent et soient continues, j'ai grossi les
caract�res des lignes. J'ai fait le changement mais il reste des
choses � corriger avant de changer la version sur Internet.

>est-ce que �a n'influe pas sur le positionnement des dessins des lignes ?

Je pense que le Mac n'a pas la m�me police. En fait, de ce que j'ai
vu, toute la s�rie 25xx a la m�me largeur, mais sur FF et Seamonkey,
c'est celle du 2003 (em sp,
http://www.unicode.org/charts/PDF/U2000.pdf ), sur IE 8, c'est un
pixel de diff�rence, et sur le Mac, il faudrait peut-�tre le 2004
(3/m sp).

>> Tout d'abord, remplacer le
>> X par quelque chose qui ressemble plus � une ast�risque mais qui
>> soit de la m�me largeur que les autres caract�res.
>
>� mon id�e, tous ces caract�res (y compris ceux alphanum�riques en
>fontes web de M$) sont de m�me largeur/hauteur.

H�las non. J'ai fait plusieurs essais et seul le X fait le travail.
Dans http://www.francogene.com/SE/voir.php?module=2&proc=08&raf=0
le r�sultat requis est assez �vident : il faut que les deux verticales
les plus � droite soit align�es, ce qui n'est pas le cas avec les
autres caract�res. Le X est 2573, donc m�me groupe que les lignes.

>> Voir colonnes puis P(08) strtrim
>
>Ha!?
>Alors avec "mon" Firefox.5 : <http://cjoint.com/?AGBlBFfURF5>

Donc, il me faudra pr�voir une version pour le Mac !

Mon vieil algorithme de 1985 fonctionne bien si les caract�res sont
tous de m�me largeur. C'est beaucoup plus compliqu� si je dois tout
refaire avec des bo�tes ou en dessinant les lignes une � une.

>> Avec d'autres caract�res que le X, la ligne au-dessus de "NUL Ne rien
>> faire", n'est pas � sa place. Le X fait partie de la page 25xx. C'est
>> comme si Seamonkey (que j'ai utilis� pour mes tests) gardait la m�me
>> largeur que le caract�re pr�c�dent quand on en utilise un plus �troit.
>>
>>
>> Un autre probl�me est l'espacement des caract�res.
>
>tout s'arrange si on fait :
>
>.dessin {
> font-size: 15px;

au moins 16px sinon le trait n'est pas continu (Seamonkey, FF et IE)

> letter-spacing: 0; /* auto ? ou ligne supprim�e ? */

Requis pour Seamonkey

> line-height: 0;
> font-family: arial; /* arial est r�put� pour bien fonctionner */

Am�liore IE, d�t�riore Seamonkey et FF

>}
>
>ou carr�ment :
>
>pre {
> font-size: 15px;

Il faut que le texte soit plus petit que le dessin, pour que les
traits se touchent.

> line-height: 13px;
> font-family: arial, georgia, verdana;
>}
>
>source :
><http://covertprestige.info/html/espaces-unicode/>
>
>et m�me, sans doute, les espaces pourraient �tre de simples espaces
>si tout est dans une balise 'pre'
>ou avec une r�gle :
> white-space: pre;

J'ai essay� arial et courrier et c'est meilleur ou pire selon le
navigateur ! J'ai l'impression que je devrai pr�voir une d�tection
du navigateur puis une correction possible. Au moins, je vois qu'en
changeant le css, on peut avoir des bons r�sultats dans tous les
cas.

Merci pour les commentaires !


Denis

Denis Beauregard

unread,
Jul 27, 2011, 9:37:59 AM7/27/11
to
Le Wed, 27 Jul 2011 13:04:23 +0200, SAM
<stephanemor...@wanadoo.fr.invalid> �crivait dans
fr.comp.infosystemes.www.auteurs:

>Le 27/07/11 12:08, SAM a �crit :

Malheureusement, cela ne passe pas sur Windows !

Seamonkey : espace trop large, 1 pixel de blanc en horizontal
et 1 pixel en vertical � 2 endroits.

Firefox : l'espace a la bonne largeur, mais 3 pixels de
blanc en horizontal (les traits ne se touchent pas)

IE 8 : 1 pixel de blanc en horizontal, X de largeur
diff�rente et les div ne fonctionnent pas du tou !

Conclusion : laisser � l'usager le choix de son CSS (et
un �diteur de CSS en ligne, en utilisant des cookies)


Denis

SAM

unread,
Jul 27, 2011, 2:36:46 PM7/27/11
to
Le 27/07/11 14:24, Pierre Goiffon a �crit :

>
> Et si la page est servie en UTF-8 alors pas de soucis, pas besoin
> d'entit� html !

Tien ? Mais c'est une bonne id�e !
Hop! j'ajoute l'utf-8 � ma d�mo : <http://cjoint.com/?AGBuI6GsMrw>

SAM

unread,
Jul 27, 2011, 3:52:21 PM7/27/11
to
Le 27/07/11 15:37, Denis Beauregard a �crit :

>
> Conclusion : laisser � l'usager le choix de son CSS (et
> un �diteur de CSS en ligne, en utilisant des cookies)

Boudiou !
Non !
Il doit bien il y avoir moyen � moyenner ! !

VT100 ?

Denis Beauregard

unread,
Jul 27, 2011, 4:38:29 PM7/27/11
to
Le Wed, 27 Jul 2011 21:52:21 +0200, SAM
<stephanemor...@wanadoo.fr.invalid> �crivait dans
fr.comp.infosystemes.www.auteurs:

>Le 27/07/11 15:37, Denis Beauregard a �crit :


>>
>> Conclusion : laisser � l'usager le choix de son CSS (et
>> un �diteur de CSS en ligne, en utilisant des cookies)
>
>Boudiou !
>Non !
>Il doit bien il y avoir moyen � moyenner ! !
>
>VT100 ?

J'ai d�velopp� cette application de 1984 � 1988.

En janvier 1984, 1er prototype �crit en Basic sur Apple ][
En 84-85, 2e prototype en Fortran et ASM sur PC
En 85-86, version finale en ASM sur PC.
En 85-88, traducteurs pour diff�rents langages, C++, Fortran, etc.

Les versions sur PC �crivaient directement dans la m�moire de
l'ordi, donc tout �tait parfaitement align�. Les seuls
inconv�nients : 1- certains caract�res ont disparu de la
page CP850 (ou CP835 ou 37 ?) utilis�e, et 2- cela ne marche
plus dans Windows 7 parce que je n'arrive pas � installer
VirtualBox ou VMWare. � cause de 2, j'ai d�cid� de refaire
mon �diteur. Cela aurait l'avantage de donner plus de
facilit�s pour un minimum fonctionnel et une �ventuelle relance
�conomique (mais j'ai �chou� en 86-88 et je ne vois pas pourquoi
je r�ussirais en 2011). Par contre, j'ai un grand nombre
d'applications en C++ �crites avec cet outil et je voudrais
pouvoir les modifier.

Pour refaire mon �diteur, j'ai, je pense, 2 choix : un �cran
graphique fixe (un tableau 25/43/50/? x 80 qui �mulerait la vieille
carte graphique du PC), avec la possibilit� de dessiner les
caract�res graphiques si ceux de la s�rie 25xx sont trop
diff�rents; ou bien continuer sur ma lanc�e et avoir des CSS
diff�rents selon le navigateur (et je pense que c'est plus
simple d'avoir 3 ou 4 CSS et de les choisir via un cookie).
Pour le moment, je pr�f�re la 2e solution. Je peux afficher le
minimum sur ma page d'accueil pour qu'on choisisse le meilleur
CSS en fonction de son navigateur. Cela enregistrerait un cookie
avec le CSS en question, et les pages seraient ensuite affich�es
avec ce CSS. En fait, je pourrais avoir 1 CSS Seamonkey/FF puisque
cela marche d�j�, 1 CSS IE 8 que je peux mettre au point, 1 CSS
Mac en supposant que celui de St�phane marchera avec les navigateurs
Mac (o� il y a peut-�tre le m�me jeu de caract�res pour tous les
navigateurs), et 1 CSS pour Linux (j'ai une vieille Debian que je
pourrai utiliser dans quelques jours).

Donc, pour le moment, je vais avoir plusieurs CSS et laisser le
visiteur choisir. Je pense que c'est plus simple que de refaire
un �diteur en javascript qui fonctionnerait comme une grille de
mots crois�s.


Denis

Denis Beauregard

unread,
Jul 27, 2011, 5:53:53 PM7/27/11
to
Bonjour,


Nouvel essai.

http://www.francogene.com/SE/exemple.html

J'ai utilis� 3 feuilles diff�rentes selon le navigateur. Le code
est le m�me, sauf que la classe change selon la section.

Le premier dessin est bien affich� dans Seamonkey et Firefox.

Le second dessin est bien affich� dans Firefox et presque bien dans
IE 8 (probl�me avec le X qui n'a pas la bonne largeur).

Le troisi�re dessin contient le CSS utilis� par SAM sur son Mac
et devrait donc �tre lisible sur le Mac.


Ce que je pourrais faire, c'est que si on n'a pas de cookie d�j�
d�fini, on doit choisir entre les trois, et que si c'est d�fini,
alors on affiche en fonction du cookie.

J'aimerais bien r�gler le probl�me du X (ou une �toile ou autre chose
similaire) qui soit de la m�me largeur que les dessins. Parmi tous
les �l�ments disponibles pour les polices, aucun ne semble faire
l'affaire pour corriger ce probl�me.


Denis

SAM

unread,
Jul 28, 2011, 5:36:14 AM7/28/11
to
Le 27/07/11 23:53, Denis Beauregard a écrit :
> Bonjour,
>
>
> Nouvel essai.

Haaaaaaa ! ;-)

> http://www.francogene.com/SE/exemple.html

Je vois que l'option UTF-8 n'a pas eu tes honneurs.

> J'ai utilisé 3 feuilles différentes selon le navigateur. Le code
> est le même, sauf que la classe change selon la section.

à noter que tu ne dois pas avoir besoin de faire :

<pre>
<span class="dessinfirefox">
<span class="dessinfirefox">
<span class="dessinfirefox">

mais que devrait suffire :

<pre class="dessinfirefox">
<span>...
<span>...
<span>...

ou même :

<pre class="dessinfirefox">
...
...
...

à mon idée, sauf pour les trucs en surbrillance, il n'y a besoin d'aucun
'span'

> Le premier dessin est bien affiché dans Seamonkey et Firefox.

Arrrghhhh !
Mais qu'ont donc tes Firefox et Seamonkey ?
Ils sont de quel siècle ?
Je doute qu'il y ait une telle différence d'affichage pour
Firefox Win <--> Mac ? ! ? !
Ça doit venir de :
- la façon dont ils sont réglés (polices et tailles)
- leurs versions ?

> Le second dessin est bien affiché dans Firefox et presque bien dans
> IE 8 (problème avec le X qui n'a pas la bonne largeur).
>
> Le troisière dessin contient le CSS utilisé par SAM sur son Mac
> et devrait donc être lisible sur le Mac.

Alors voici comment ça passe dans mes
- Firefox.5.0.1
- Safari.5.0.5
- et Chrome.12.0.742.122 :
<http://cjoint.com/?AGCkzWELZSD>
(à gauche affichage zoomé de l'affichage normal présenté à droite et tel
que mon navigateur est réglé)

Dans Opera.11.50 ça donne ça :
<http://cjoint.com/?AGCkCA5NiNn>
... Opera s'annonce comme :
Opera/9.80 (Macintosh; Intel Mac OS X 10.6.8; U; fr) Presto/2.9.168
Version/11.50

Donc I8/9 passe bien sauf pour Opera ...
où l'espace semble moins large.


> Ce que je pourrais faire, c'est que si on n'a pas de cookie déjà
> défini, on doit choisir entre les trois, et que si c'est défini,


> alors on affiche en fonction du cookie.

<http://stephane.moriaux.pagesperso-orange.fr/internet/web_ssi/test_ssi.shtml>
Le menu-déroulant ne fonctionne pas (form avec action en php non géré
chez Orange) il faut se servir du zigouigoui en haut-gauche "Changer de
style", qui alors change le style et le met en cookies par JavaScript

> J'aimerais bien régler le problème du X (ou une étoile ou autre chose
> similaire) qui soit de la même largeur que les dessins.

Comme je ne comprends pas la signification à ce X ou *
je ne comprends pas non plus que tu ne mettes une "branche" normale
(quitte à prendre les croisements à double-ligne)
html-numérique : &#9580;
unicode : U+256C &#x256C;
utf-8 : E2 95 AC
soit : ╬

il y a aussi :
╪ U+256A &#x256A; E2 95 AA
ou :

et ça :
≡ U+2261 &#x2261; &#8801; E2 89 A1 &equiv;
► U+25BA &#x25BA; &#9658; E2 96 BA
• U+2022 &#x2022; &#8226; E2 80 A2 &bull;
◘ U+25D8 &#x25D8; &#9688; E2 97 98
¤ U+00A4 &#x00A4; &#164; C2 A4 &curren;

SAM

unread,
Jul 28, 2011, 7:49:15 AM7/28/11
to
Le 27/07/11 23:53, Denis Beauregard a écrit :
>
> Le second dessin est bien affiché dans Firefox et presque bien dans
> IE 8 (problème avec le X qui n'a pas la bonne largeur).

dommage, ça passe bien sur "mon" Mac (sauf Opera)

> Le troisière dessin contient le CSS utilisé par SAM sur son Mac
> et devrait donc être lisible sur le Mac.

curieusement, la police
Times New Roman y donne aussi satisfaction, mais pas la Times

à noter :

.dessinmac {
font-family: arial;
white-space: pre; /* inutile si on est déjà dans une balise 'pre' */
font-size: 15px;
line-height: 14px;
}


⊬ &#x22AC; E2 8A AC

┠ 2520 E2 94 A0

┣ 2523 E2 94 A3

├ 251c E2 94 A0


┣━━┓
┃ ┃
┃ ┠───┐test
┃ ┃ │blabla
┃ ┠───┘
┃ ┃
┃ ╞═══╗
┃ │ ║
┃ ╘═══╝

Denis Beauregard

unread,
Jul 28, 2011, 8:19:27 AM7/28/11
to
Le Thu, 28 Jul 2011 11:36:14 +0200, SAM
<stephanemor...@wanadoo.fr.invalid> écrivait dans
fr.comp.infosystemes.www.auteurs:

>Le 27/07/11 23:53, Denis Beauregard a écrit :


>> Bonjour,
>>
>>
>> Nouvel essai.
>
>Haaaaaaa ! ;-)
>
>> http://www.francogene.com/SE/exemple.html
>
>Je vois que l'option UTF-8 n'a pas eu tes honneurs.
>
>> J'ai utilisé 3 feuilles différentes selon le navigateur. Le code
>> est le même, sauf que la classe change selon la section.
>
>à noter que tu ne dois pas avoir besoin de faire :
>
><pre>
><span class="dessinfirefox">
><span class="dessinfirefox">
><span class="dessinfirefox">
>
>mais que devrait suffire :
>
><pre class="dessinfirefox">
><span>...
><span>...
><span>...

Ce n'est pas la même chose !!!

Pour que les lignes du dessin soient continues, dans au moins
Seamonkey et Firefox, il faut que la partie du dessin soit en
caractères plus gros, et que le texte à droite soit plus petit.
Donc,

<pre>
<span class="dessinfirefox">


>ou même :
>
><pre class="dessinfirefox">
>...
>...
>...
>
>à mon idée, sauf pour les trucs en surbrillance, il n'y a besoin d'aucun
>'span'

Sur un Mac, mais pas sur Windows !

>> Le premier dessin est bien affiché dans Seamonkey et Firefox.
>
>Arrrghhhh !
>Mais qu'ont donc tes Firefox et Seamonkey ?
>Ils sont de quel siècle ?
>Je doute qu'il y ait une telle différence d'affichage pour
> Firefox Win <--> Mac ? ! ? !
>Ça doit venir de :
>- la façon dont ils sont réglés (polices et tailles)
>- leurs versions ?

J'ai l'impression que sur le Mac, les polices sont fournies par
le SE alors que sur Windows, elles sont fournies par le navigateur.

>> Le second dessin est bien affiché dans Firefox et presque bien dans
>> IE 8 (problème avec le X qui n'a pas la bonne largeur).
>>
>> Le troisière dessin contient le CSS utilisé par SAM sur son Mac
>> et devrait donc être lisible sur le Mac.
>
>Alors voici comment ça passe dans mes
>- Firefox.5.0.1
>- Safari.5.0.5
>- et Chrome.12.0.742.122 :
><http://cjoint.com/?AGCkzWELZSD>
>(à gauche affichage zoomé de l'affichage normal présenté à droite et tel
>que mon navigateur est réglé)

Donc, c'est le CSS pour IE qui affiche comme il faut. Dans celui
pour Mac, les lignes ne se touchent pas.

>Dans Opera.11.50 ça donne ça :
><http://cjoint.com/?AGCkCA5NiNn>
>... Opera s'annonce comme :
>Opera/9.80 (Macintosh; Intel Mac OS X 10.6.8; U; fr) Presto/2.9.168
>Version/11.50
>
>Donc I8/9 passe bien sauf pour Opera ...
>où l'espace semble moins large.

Oui.

>
>> Ce que je pourrais faire, c'est que si on n'a pas de cookie déjà
>> défini, on doit choisir entre les trois, et que si c'est défini,
>> alors on affiche en fonction du cookie.
>
><http://stephane.moriaux.pagesperso-orange.fr/internet/web_ssi/test_ssi.shtml>
>Le menu-déroulant ne fonctionne pas (form avec action en php non géré
>chez Orange) il faut se servir du zigouigoui en haut-gauche "Changer de
>style", qui alors change le style et le met en cookies par JavaScript

En effet. Si je presse sur OK, j'ai une erreur 404. Ceci dit, pourquoi
indiquer cette page ? Quand j'ai commencé sur Facebook l'an dernier,
il détectait mon navigateur et choisissait donc automatiquement la
façon d'afficher le site. Mais j'avais un vieux Seamonkey sur Windows
98 et il concluait que j'étais sur un Mobile, peut-être parce que
c'est la valeur par défaut. Le site browsershots.org propose environ
75 navigateurs différents. Google Analytics m'indique la visite de
55 navigateurs différents sur mon site depuis janvier (le dossier SE
n'est pas inclus), 97 si on tient compte du SE. Et cela ne tient pas
compte de la version. Je ne crois pas à la détection automatique !

>> J'aimerais bien régler le problème du X (ou une étoile ou autre chose
>> similaire) qui soit de la même largeur que les dessins.
>
>Comme je ne comprends pas la signification à ce X ou *

Il s'agit d'un schéma représentant du code (en C++ dans ce que j'ai
sur mon site, mais cela a aussi servi avec du Fortran, Basic, etc.).
La ligne simple à gauche sert de référence. Chaque ligne simple
indentée est une condition (si la condition en vidéo inversée est
vraie, ce qui suit cette ligne est exécuté). Chaque ligne double est
une boucle. L'étoile (caractère utilisé dans la version 1985) est
une sortie de boucle (si la condition est vraie, on sort de la
boucle). On peut combiner la boucle et la condition, par exemple
1e condition : on exécute telle action, 2e condition (ELSE IF) on
exécute telle autre action et on quitte la boucle.

>je ne comprends pas non plus que tu ne mettes une "branche" normale
>(quitte à prendre les croisements à double-ligne)
>html-numérique : &#9580;
>unicode : U+256C &#x256C;
>utf-8 : E2 95 AC

>soit : ?
>
>il y a aussi :
> ? U+256A &#x256A; E2 95 AA
>ou :
> ?
>
>et ça :
>? U+2261 &#x2261; &#8801; E2 89 A1 &equiv;
>? U+25BA &#x25BA; &#9658; E2 96 BA


>• U+2022 &#x2022; &#8226; E2 80 A2 &bull;

>? U+25D8 &#x25D8; &#9688; E2 97 98


>¤ U+00A4 &#x00A4; &#164; C2 A4 &curren;

Il faut que les lignes verticales soient alignées, donc que le
caractère soit large de 1 em. Et je n'ai pas vu comment forcer la
largeur en CSS.


Denis

SAM

unread,
Jul 28, 2011, 8:22:40 AM7/28/11
to
Le 28/07/11 11:36, SAM a écrit :

>
> Arrrghhhh !
> Mais qu'ont donc tes Firefox et Seamonkey ?
> Ils sont de quel siècle ?
> Je doute qu'il y ait une telle différence d'affichage pour
> Firefox Win <--> Mac ? ! ? !


Firefox.3.6 brut de fonderie (pas d'extensions) Mac :
<http://cjoint.com/?AGCosEZ7CHm>
soit ... idem Fx.5 bien nourri

SAM

unread,
Jul 28, 2011, 8:12:25 PM7/28/11
to
Le 28/07/11 14:19, Denis Beauregard a écrit :

> Le Thu, 28 Jul 2011 11:36:14 +0200, SAM
> <stephanemor...@wanadoo.fr.invalid> écrivait dans
> fr.comp.infosystemes.www.auteurs:
>
>> mais que devrait suffire :
>>
>> <pre class="dessinfirefox">
>> <span>...
>> <span>...
>> <span>...
>
> Ce n'est pas la même chose !!!

N'importe quoi !

Arrrggghhh !
Mais que vois-je ?
C'est rempli de <BR> ! ! !
C'est mon navigateur qui les ajoute ?
Ou bien y sont-ils réellement ?

Ne serait-ce pas ça qui te met le bintz ?

et ces : <span></span>
ils servent à quoi ?

D'autres trucs ne vont pas,
comme :
&#9491; </span><b><span
au lieu de
&#9491;</span> <b><span

> Pour que les lignes du dessin soient continues, dans au moins
> Seamonkey et Firefox, il faut que la partie du dessin soit en
> caractères plus gros, et que le texte à droite soit plus petit.
> Donc,
>
> <pre>
> <span class="dessinfirefox">

Non, pas donc !

>> à mon idée, sauf pour les trucs en surbrillance, il n'y a besoin d'aucun
>> 'span'
>
> Sur un Mac, mais pas sur Windows !

et pourquoi ça ?
Windows est une bête si étrange ?
(peut-être un peu, mais quand même ... les trucs de base ? !)

Une page de démo et tests :
<http://cjoint.com/?AGDb3NtkiKB>
(attention! le doctype est modifié/corrigé)
donne
- Firefox.5
<http://cjoint.com/?AGDbGgkdIok>
<http://cjoint.com/?AGDbHHynkyo>
- IE.7 sous Win XP
<http://cjoint.com/?AGDbIK8sXa3>
<http://cjoint.com/?AGDbJp3OwGf>
- IE.6 ? rien ne fonctionne !
<http://cjoint.com/?AGDcbJJw2bJ>
(zigouigouis de cadrage inconnus)


>> <http://stephane.moriaux.pagesperso-orange.fr/internet/web_ssi/test_ssi.shtml>
>> Le menu-déroulant ne fonctionne pas (form avec action en php non géré
>> chez Orange) il faut se servir du zigouigoui en haut-gauche "Changer de
>> style", qui alors change le style et le met en cookies par JavaScript
>
> En effet. Si je presse sur OK, j'ai une erreur 404. Ceci dit, pourquoi
> indiquer cette page ?

C'est un exemple de mise en place de css différentes à choisir par
l'utilisateur, le choix étant sauvegardé dans un cookie
... pas plus ... (sauf que tout y est pré-mâché, pour usage ultérieur)

> Quand j'ai commencé sur Facebook l'an dernier,

Je ne sais pas ce que c'est.

> il détectait mon navigateur et choisissait donc automatiquement la
> façon d'afficher le site.

Mauvais site, changer de site !

> il concluait que j'étais sur un Mobile, peut-être parce que
> c'est la valeur par défaut.

Ben ... c'est pas d'ma faute si ils savent pas faire ! ;-)

(m'enfin ... aller sur LivreDeTronches avec un navigateur antédiluvien
faut l'faire !)

Denis Beauregard

unread,
Jul 28, 2011, 8:35:11 PM7/28/11
to
Le Fri, 29 Jul 2011 02:12:25 +0200, SAM
<stephanemor...@wanadoo.fr.invalid> �crivait dans
fr.comp.infosystemes.www.auteurs:

>Le 28/07/11 14:19, Denis Beauregard a �crit :


>> Le Thu, 28 Jul 2011 11:36:14 +0200, SAM

>> <stephanemor...@wanadoo.fr.invalid> �crivait dans


>> fr.comp.infosystemes.www.auteurs:
>>
>>> mais que devrait suffire :
>>>
>>> <pre class="dessinfirefox">
>>> <span>...
>>> <span>...
>>> <span>...
>>

>> Ce n'est pas la m�me chose !!!


>
>N'importe quoi !
>
>Arrrggghhh !
>Mais que vois-je ?
>C'est rempli de <BR> ! ! !
>C'est mon navigateur qui les ajoute ?

>Ou bien y sont-ils r�ellement ?

Oui, ils y sont. Je dois pr�voir que le texte sera �ditable plus tard
et donc utiliser autre chose que les \n pour s�parer les lignes. Mais
je me demande si je devrais plut�t utiliser un tableau pour pr�voir
quelque chose comme <td><input text>teste � �diter</td>

Je pourrai alors voir ce qui arrive si j'ai des tableaux au lieu de
<br>.

>
>Ne serait-ce pas �a qui te met le bintz ?
>
>et ces : <span></span>
>ils servent � quoi ?

� m'assurer que les dessins se touchent et que le texte est plus
petit.

>D'autres trucs ne vont pas,
>comme :
> &#9491; </span><b><span
>au lieu de
> &#9491;</span> <b><span

Pour le moment, c'est secondaire. Sans espace, certaines lignes
sont trop petites.

>> Pour que les lignes du dessin soient continues, dans au moins
>> Seamonkey et Firefox, il faut que la partie du dessin soit en

>> caract�res plus gros, et que le texte � droite soit plus petit.


>> Donc,
>>
>> <pre>
>> <span class="dessinfirefox">
>
>Non, pas donc !
>

>>> � mon id�e, sauf pour les trucs en surbrillance, il n'y a besoin d'aucun


>>> 'span'
>>
>> Sur un Mac, mais pas sur Windows !
>

>et pourquoi �a ?
>Windows est une b�te si �trange ?
>(peut-�tre un peu, mais quand m�me ... les trucs de base ? !)

Oui, Windows est bien �trange !!! Mais aussi tr�s populaire. Et
IE est le plus capricieux...

>Une page de d�mo et tests :
> <http://cjoint.com/?AGDb3NtkiKB>
> (attention! le doctype est modifi�/corrig�)


>donne
>- Firefox.5
> <http://cjoint.com/?AGDbGgkdIok>
> <http://cjoint.com/?AGDbHHynkyo>
>- IE.7 sous Win XP
> <http://cjoint.com/?AGDbIK8sXa3>
> <http://cjoint.com/?AGDbJp3OwGf>
>- IE.6 ? rien ne fonctionne !
> <http://cjoint.com/?AGDcbJJw2bJ>
> (zigouigouis de cadrage inconnus)

Avec Seamonkey, aucun n'est bon (alignement) et c'est mon
navigateur par d�faut.

>>> <http://stephane.moriaux.pagesperso-orange.fr/internet/web_ssi/test_ssi.shtml>
>>> Le menu-d�roulant ne fonctionne pas (form avec action en php non g�r�


>>> chez Orange) il faut se servir du zigouigoui en haut-gauche "Changer de
>>> style", qui alors change le style et le met en cookies par JavaScript
>>
>> En effet. Si je presse sur OK, j'ai une erreur 404. Ceci dit, pourquoi
>> indiquer cette page ?
>

>C'est un exemple de mise en place de css diff�rentes � choisir par
>l'utilisateur, le choix �tant sauvegard� dans un cookie
>... pas plus ... (sauf que tout y est pr�-m�ch�, pour usage ult�rieur)
>
>> Quand j'ai commenc� sur Facebook l'an dernier,


>
>Je ne sais pas ce que c'est.
>

>> il d�tectait mon navigateur et choisissait donc automatiquement la
>> fa�on d'afficher le site.


>
>Mauvais site, changer de site !

Pour avoir les photos de la famille, faut suivre la famille !

>> il concluait que j'�tais sur un Mobile, peut-�tre parce que
>> c'est la valeur par d�faut.


>
>Ben ... c'est pas d'ma faute si ils savent pas faire ! ;-)
>

>(m'enfin ... aller sur LivreDeTronches avec un navigateur ant�diluvien
>faut l'faire !)

Je sais... Mais apr�s un certain temps, cela marchait presque !!
M'enfin, certaines fonctions �taient disponibles...


Denis

SAM

unread,
Jul 28, 2011, 8:54:18 PM7/28/11
to
Le 29/07/11 02:35, Denis Beauregard a �crit :

> Le Fri, 29 Jul 2011 02:12:25 +0200, SAM
> <stephanemor...@wanadoo.fr.invalid> �crivait dans
> fr.comp.infosystemes.www.auteurs:
>
>> Une page de d�mo et tests :
>> <http://cjoint.com/?AGDb3NtkiKB>
>> (attention! le doctype est modifi�/corrig�)

>
> Avec Seamonkey, aucun n'est bon (alignement) et c'est mon
> navigateur par d�faut.

C'est quand m�me exasp�rant c't'histoire !
en tous cas les 4 et 5 sont bons partout chez moi
Safari, Chrome, Firefox sur Mac et IE.7 sous XP

j'm'en va t�l�charger ce singe des mers, histoire de voir ! :-(

Pas trop ni rien compris au pb du "texte" �ditable
... tu veux pouvoir �diter les | + � et autres babioles ?

Pour "mes" navigateurs,
hop! :

<pre contenteditable>


--
St�phane Moriaux avec/with iMac-intel

SAM

unread,
Jul 28, 2011, 9:06:21 PM7/28/11
to
Le 29/07/11 02:54, SAM a �crit :

>
> j'm'en va t�l�charger ce singe des mers, histoire de voir ! :-(

c'est donc la version 2.2
et ... tout est nickel
- ta page : <http://cjoint.com/?AGDddSj8L8l>
- ma page : <http://cjoint.com/?AGDdfACdIql> (le 5 aussi bon que le 4)

0 new messages