Un petit éditeur html

Sujet: Un petit éditeur html Mer 3 Sep 2014 - 22:14

Très simple, avec à gauche le code, à droite la page résultante.
Pour faire des fichiers htm simples, un exemple d'utilisation: fichier à insérer dans un email, avec des mises en forme amusantes de textes ou d'images ('Insertion', 'Texte du fichier...', 'HTML').
Dans l'aide, un aide-mémoire des principales balises, et un lien vers un tutoriel plus étoffé sur le web.
Pas de ressources externes nécessaires, tout en Panoramic pur et dur.

Code:: ' EditHtml éditeur html wysiwyg
LABEL Ouvrir,Enr,Enrs,QEdit,Couper,Copier,Coller,Actuel,Balises,Tuto, Redim
DIM wc%,wh%,i%,mm%,hv%,mf%,me%,mv%,ma%,mh%,od%,sd%,h0%,hh%,a$,q$,f$,pas%,as%
f$ = ""
q$ = CHR$(34)

wc% = 700: wh% = 700
h0% = 900
h0%=SCREEN_Y-200
WIDTH 0,wc%+wh%+20: HEIGHT 0,h0%: BORDER_SMALL 0: CAPTION 0," Éditeur HTML"

i% = 10: MAIN_MENU i%
mf%=11: SUB_MENU mf%: PARENT mf%,i%: CAPTION mf%,"Fichier"
i%=mf%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Ouvrir...": ON_CLICK i%,Ouvrir
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Enregistrer": ON_CLICK i%,Enr
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Enregistrer sous...": ON_CLICK i%,Enrs
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Quitter": ON_CLICK i%,QEdit
me%=21: SUB_MENU me%: PARENT me%,OBJECT_PARENT(mf%): CAPTION me%,"Edit"
i%=me%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Couper": ON_CLICK i%,Couper
i%=i%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Copier": ON_CLICK i%,Copier
i%=i%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Coller": ON_CLICK i%,Coller
mv%=i%+1: SUB_MENU mv%: PARENT mv%,OBJECT_PARENT(mf%): CAPTION mv%,"Fenêtre"
i%=mv%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Plus large"
i%=i%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Plus haute"
i%=i%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Moins large"
i%=i%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Moins haute"
FOR i% = 1 TO 4: ON_CLICK mv%+i%,Redim: NEXT i%
ma%=35: SUB_MENU ma%: PARENT ma%,OBJECT_PARENT(mf%): CAPTION ma%,"Actualiser"
ON_CLICK ma%,Actuel
mh%=41: SUB_MENU mh%: PARENT mh%,OBJECT_PARENT(mf%): CAPTION mh%,"Aide"
i%=mh%+1: SUB_MENU i%: PARENT i%,mh%: CAPTION i%,"Balises Html": ON_CLICK i%,Balises
i%=i%+1: SUB_MENU i%: PARENT i%,mh%: CAPTION i%,"Tutoriel (Web)": ON_CLICK i%,Tuto

i%=i%+1: ALPHA i%: TOP i%,0: LEFT i%,wc%/2-40: CAPTION i%," SOURCE ": as% = i%
COLOR i%,255,255,0
i%=i%+1: ALPHA i%: TOP i%,0: LEFT i%,wc%+wh%/2-40: CAPTION i%," RÉSULTAT "
COLOR i%,255,255,0

mm%=50: MEMO mm%: TOP mm%,15: LEFT mm%,0: WIDTH mm%,wc%: HEIGHT mm%,h0%-75
COLOR mm%,255,255,200: BAR_BOTH mm%
FONT_NAME mm%,"Lucida Console"
hv%=mm%+1: HVIEWER hv%: TOP hv%,TOP(mm%): LEFT hv%,wc%: WIDTH hv%,wh%
HEIGHT hv%,HEIGHT(mm%)

od%=60: OPEN_DIALOG od%: FILTER od%,"Fichiers HTML|*.htm"
sd%=od%+1: SAVE_DIALOG sd%: FILTER sd%,"Fichiers HTML|*.htm"

hh% = 80: FORM hh%: TOP hh%,0: LEFT hh%,200: WIDTH hh%,720: HEIGHT hh%,SCREEN_Y-80
HIDE hh%: CAPTION hh%," - PRINCIPALES BALISES HTML -
i%=hh%+1: LIST i%: PARENT i%,hh%: FULL_SPACE i%: FONT_NAME i%,"Lucida Console"
READ a$: WHILE a$<>"Balises": READ a$: END_WHILE
READ a$: WHILE a$<>"FBalises": ITEM_ADD i%,a$: READ a$: END_WHILE

ITEM_ADD mm%,"<HTML>": ITEM_ADD mm%," <HEAD>"
ITEM_ADD mm%," <TITLE>...</TITLE>": ITEM_ADD mm%," </HEAD>"
ITEM_ADD mm%," <BODY>": ITEM_ADD mm%,"": ITEM_ADD mm%," </BODY>"
ITEM_ADD mm%,"</HTML>"

END
' ==============================================================================
Ouvrir:
a$ = FILE_NAME$(od%): IF LEN(a$)<4 THEN RETURN
f$ = a$: CAPTION 0," Fichier : "+f$
FILE_LOAD mm%,f$: ' Ouvrir
FILE_LOAD hv%,f$
RETURN
' ==============================================================================
Enr:
IF f$ = "" THEN RETURN
FILE_SAVE mm%,f$: ' Enregistrer
RETURN
' ==============================================================================
Enrs:
a$ = FILE_NAME$(sd%): IF LEN(a$)<4 THEN RETURN
f$ = a$: CAPTION 0,f$
FILE_SAVE mm%,f$: ' Enregistrer sous...
RETURN
' ==============================================================================
QEdit:

TERMINATE
' ==============================================================================
Couper:
CLIPBOARD_CUT mm%
RETURN
' ==============================================================================
Copier:
CLIPBOARD_COPY mm%
RETURN
' ==============================================================================
Coller:
CLIPBOARD_PASTE mm%
RETURN
' ==============================================================================
Actuel:
' Actualiser l'image à droite en fonction du source à gauche
FILE_SAVE mm%,fm$
FILE_LOAD hv%,fm$
RETURN
' ==============================================================================
Balises:
SHOW hh%
RETURN
' ==============================================================================
Tuto:
' Tutoriel Html en ligne
EXECUTE_WAIT "http://www.ukonline.be/programmation/html/tutoriel/"
RETURN
' ==============================================================================
Redim:
' Redimensionner la fenêtre
pas% = 100: ' pixels, pas d'agrandissement ou réduction total
IF CLICKED(mv%+1) = 1: ' agrandir la fenêtre en largeur
wc% = wc%+pas%/2: wh% = wh%+pas%/2
ELSE
IF CLICKED(mv%+2) = 1: ' agrandir en hauteur
h0% = h0%+pas%
ELSE
IF CLICKED(mv%+3) = 1: ' réduire en largeur
wc% = wc%-pas%/2: wh% = wh%-pas%/2
ELSE
h0% = h0%-pas%: ' réduire en hauteur
END_IF
END_IF
END_IF
WIDTH 0,wc%+wh%+20: HEIGHT 0,h0%
WIDTH mm%,wc%: HEIGHT mm%,h0%-75
LEFT hv%,wc%: WIDTH hv%,wh%: HEIGHT hv%,HEIGHT(mm%)
LEFT as%,wc%/2-40: LEFT as%+1,wc%+wh%/2-40
RETURN
' ==============================================================================
DATA "Balises"
DATA "========== FICHIER HTML =============================================================="
DATA "<HTML>...</HTML> Début et fin de fichier Html"
DATA "<HEAD>...</HEAD> Zone d'en-tête d'un fichier Html"
DATA "<TITLE>...</TITLE> Titre affiché par le browser (élément de HEAD)"
DATA "<BODY>...</BODY> Début et fin du corps du fichier Html"
DATA "<BODY bgcolor="+q$+"#XXXXXX"+q$+"> Couleur d'arrière-plan (en hexadécimal)"
DATA "<BODY background="+q$+"xyz.gif"+q$+"> Image d'arrière-plan"
DATA ""
DATA "========== MISE EN FORME DES CARACTÈRES =============================================="
DATA "<B>...</B> Texte en gras"
DATA "<BIG>...</BIG> Agrandissement de la taille des caractères"
DATA "<BLINK>...</BLINK> Texte clignotant (Netscape seul)"
DATA "<EM>...</EM> Texte en italique"
DATA "<FONT color="+q$+"#XXXXXX"+q$+">...</FONT> Texte en couleur, RRGGBB valeur hexadécimale"
DATA "<FONT size=X>...</FONT> Taille des caractères où X est une valeur de 1 à 7"
DATA "<I>...</I> Texte en italique"
DATA "<NOBR>...</NOBR> Empêche les sauts de lignes auto des navigateurs"
DATA "<PRE>...</PRE> Texte préformaté: affichage espaces et sauts/ligne"
DATA "<SMALL>...</SMALL> Réduction de la taille des caractères"
DATA "<STRONG>...</STRONG> Mise en gras du texte"
DATA "<SUB>...</SUB> Texte en indice"
DATA "<SUP>...</SUP> Texte en exposant"
DATA "<U>...</U> Texte souligné"
DATA ""
DATA "========== MISE EN FORME DU TEXTE ===================================================="
DATA " Commentaire, ignoré par le navigateur"
DATA "<BR> A la ligne"
DATA "<BLOCKQUOTE>...</BLOCKQUOTE> Citation (introduit un retrait du texte)"
DATA "<CENTER>...</CENTER> Centre tout élément compris dans le tag"
DATA "<DIV align=center> ...</DIV> Centre l'élément encadré par le tag"
DATA "<DIV align=left> ...</DIV> Aligne l'élément à gauche"
DATA "<DIV align=right> ...</DIV> Aligne l'élément à droite"
DATA "<Hx>...</Hx> Titre où x a une valeur de 1 à 6"
DATA "<Hx align=center>...</Hx> Titre centré"
DATA "<Hx align=left>...</Hx> Titre aligné à gauche"
DATA "<Hx align=right>...</Hx> Titre aligné à droite "
DATA "<P>...</P> Nouveau paragraphe"
DATA "<P align=center>...</P> Paragraphe centré"
DATA "<P align=left>...</P> Paragraphe aligné à gauche"
DATA "<P align=right>...</P> Paragraphe aligné à droite"
DATA ""
DATA "========== LISTES ==================================================================="
DATA "<UL> Liste non numérotée (dite à puces)"
DATA "<LI> Élément de liste"
DATA "</UL> "
DATA "<OL> Liste numérotée"
DATA "<LI> Élément de liste"
DATA "</OL> "
DATA "<DL> Liste de glossaire"
DATA "<DT>...</DT> Terme de glossaire (sans retrait)"
DATA "<DD>...</DD> Explication du terme (avec retrait)"
DATA "</DL>"
DATA ""
DATA "========== LIGNE DE SÉPARATION ======================================================"
DATA "<HR> Trait horizontal (centré par défaut)"
DATA "<HR width="+q$+"x%"+q$+"> Largeur du trait en %"
DATA "<HR width=x> Largeur du trait en pixels"
DATA "<HR size=x> Épaisseur du trait en pixels (20 maxi)"
DATA "<HR align=center> Trait centré (défaut) "
DATA "<HR align=left> Trait aligné à gauche"
DATA "<HR align=right> Trait aligné à droite"
DATA "<HR color=#RRGGBB> Couleur du trait (valeur hexa)
DATA "<HR noshade> Trait sans effet d'ombrage"
DATA ""
DATA "========== HYPERLIENS ==============================================================="
DATA "<A href="+q$+"http://..."+q$+">...</A> Lien vers une page Web"
DATA "<A href="+q$+"mailto:..."+q$+">...</A> Lien vers une adresse email"
DATA "<A href="+q$+"fichier.htm"+q$+">...</A> Lien vers page locale fichier.htm située même dossier"
DATA "<A name="+q$+"xyz"+q$+">...</A> Définition d'une ancre"
DATA "<A href="+q$+"#xyz"+q$+">...</A> Lien vers une ancre"
DATA "<A href="+q$+"fichier#xyz"+q$+">...</A>"
DATA ""
DATA "========== IMAGES =================================================================== "
DATA "<IMG src="+q$+"xyz.gif"+q$+">"
DATA "<IMG src="+q$+"xyz.jpg"+q$+"> Insère img format Gif ou Jpg (cf liens pour adressage)"
DATA "<IMG ... width=x height=y> Mise à échelle d'image (pixels) (accélère affichage)"
DATA "<IMG ... border=x> Définition de la bordure d'une image avec lien"
DATA "<IMG ... alt="+q$+"votre texte"+q$+"> Texte alternatif lorsque l'image n'est pas affichée"
DATA "<IMG ... align=bottom> Aligne l’image en bas"
DATA "<IMG ... align=middle> Aligne l’image au milieu"
DATA "<IMG ... align=top> Aligne l’image en haut"
DATA "<IMG ... align=left> Aligne l’image à gauche"
DATA "<IMG ... align=right> Aligne l’image à droite"
DATA "<IMG ... hspace=x> Espacement horizontal entre l'image et le texte"
DATA "<IMG ... vspace=y> Espacement vertical entre l'image et le texte"
DATA ""
DATA "========== TABLEAUX ================================================================="
DATA "<TABLE>...</TABLE> Définition d'un tableau"
DATA "<TABLE width="+q$+"x%"+q$+"> Largeur du tableau en %"
DATA "<TABLE width=x> Largeur du tableau en pixels"
DATA "<TABLE border=x> Largeur de la bordure"
DATA "<TABLE cellpadding=x> Espace entre la bordure et le texte"
DATA "<TABLE cellspacing=x> Epaisseur du trait entre les cellules"
DATA "<TR>...</TR> Ligne du tableau"
DATA "<TD>...</TD> Cellule du tableau"
DATA "<TD bgcolor="+q$+"#XXXXXX"+q$+"> Couleur d'une cellule de tableau"
DATA "<TD width="+q$+"x%"+q$+"> Largeur de colonne en %"
DATA "<TD width=x> Largeur de colonne en pixels"
DATA "<TD align=center> Texte centré dans la cellule"
DATA "<TD align=left> Texte aligné à gauche dans la cellule"
DATA "<TD align=right> Texte aligné à droite dans la cellule"
DATA "<TD valign=bottom> Alignement vers le bas du contenu d'une cellule "
DATA "<TD valign=middle> Centrage vertical du contenu d'une cellule"
DATA "<TD valign=top> Alignement vers le haut du contenu d'une cellule"
DATA "<TD colspan=x> Nombre de cellules à fusionner horizontalement"
DATA "<TD rowspan=x> Nombre de cellules à fusionner verticalement"
DATA ""
DATA "========== FRAMES ==================================================================="
DATA "<FRAMESET>...</FRAMESET> Définit une struct. de frames (rempl. alors tag BODY)"
DATA "<FRAMESET rows="+q$+"x%,y%,..."+q$+"> Division horizontale de la fenêtre en %"
DATA "<FRAMESET cols="+q$+"x%,y%,..."+q$+"> Division verticale de la fenêtre en %"
DATA "<FRAME src="+q$+"fichier.htm"+q$+"> Fichier affiché dans une fenêtre de frames"
DATA "<NOFRAMES>...</NOFRAMES> Contenu pour les browsers non prévus pour les frames"
DATA "FBalises"
' ===============================================================================

Sujet: Re: Un petit éditeur html Jeu 4 Sep 2014 - 7:53

Bravo JL35, c'est bon ça. Simple et efficace.

Sujet: Re: Un petit éditeur html Jeu 4 Sep 2014 - 15:43

Petites améliorations de confort, ci-dessus Wink

Sujet: Re: Un petit éditeur html Jeu 4 Sep 2014 - 17:56

Après un truc qui serait sympa, serait d'avoir une barre d'icône plutôt que de taper les balises comme dans le forum. Tu aurais le bouton B qui insérerait un bloc <B>...</B>, une icone avec une grande lettre pour insérer un bloc Big, un I pour un bloc italic, un C pour clignotant, etc ...
(Sans tenir compte de la localisation où on l'insert, sinon ça commence à faire usine à gaz puisqu'il faudrait vérifier le nombre de blocs ouverts etc... et ce n'est certainement pas le but de ton programme)
Cette interface graphique améliorerait encore la convivialité du programme, je pense et à part un peu de temps, ce n'est pas très compliqué à mettre en oeuvre

Sujet: Re: Un petit éditeur html Ven 5 Sep 2014 - 9:35

Petit programme sympa. Bravo JL35 !

Maintenant il ne me reste plus qu'a me remettre a l'HTLM...
Houlà c'est loin tout ça !!
Aller encore un petit effort et ca va revenir. Laughing

PS : effectivement la sélection par icone ca serait sympa. A voir...

Bonne continuation

Sujet: Re: Un petit éditeur html Ven 5 Sep 2014 - 14:23

Un peu de patience, ça va venir.
Un de ces jours !

Sujet: Re: Un petit éditeur html Ven 5 Sep 2014 - 16:47

Comme d'hab, tu fais un petit programme et on t'en demande plus Very Happy

Mais c'est vrai que quand tu le fera, ça rendra vraiment ce petit éditeur très sympatique pour faire des fichiers HTML. Libre à chacun après s'il utilise de petits codejavascript ou autre (par exemple pour replier des sections - je dis ça d'expérience car c'est ce que je faisait en HTML sur des pages d'aide dans ServiceNow à une époque) de se rajouter les boutons qui vont bien pour injecter le code selon le même principe.

Sujet: reponse d' un beta (enfin utilisateur) Ven 5 Sep 2014 - 22:59

Je suis émerveillé de lire ce que vous programmez.
Je n'en suis pas je vous rassure sinon je posterais plus souvent.

Mais parfois je me demande si ce n'est pas pour la beauté du geste que tous ces codes nous parviennent...

Comme déjà expliqué dans d'anciens post, je ne programme que pour des trucs qui me facilitent la vie.
Excel, fichier Ged etc.

Et du coup j'ai bien du mal à vous suivre. Malgré les encouragements de beaucoup...

Bon allez! je continue à lire.

Sujet: Re: Un petit éditeur html Ven 5 Sep 2014 - 23:22

Bonsoir maelilou,
Je pense que pour la plupart, comme pour moi, c'est moins par nécessité que pour le plaisir de faire marcher quelque chose par soi-même.
Et aussi (surtout ?) pour le plaisir de partager quand on pense avoir pondu quelque chose d'intéressant, et aussi récupérer les idées parfois géniales des autres (je ne donne pas de noms, sinon gare à la grosse tête Very Happy

)

Panoramic est bien pratique pour se faire ses petits utilitaires personnels, avec des interfaces agréables à regarder, ce que je fais, et je publie quand je pense que ça peut en intéresser d'autres, pas pour les utiliser tels quels, dans mon idée, mais pour les accommoder à leur façon et suivant leurs besoins.

Il n'y a aucun complexe à avoir, les gens ont plus ou moins d'expérience (et de loisirs !), tout le monde a débuté à un moment donné, et tout le monde est bienvenu.
En tout cas tes remarques sont sympas, mais n'hésite surtout pas, si tu veux te lancer, tu as du déjà remarquer que tout le monde ici se fait un plaisir d'aider les autres, à n'importe quel niveau, plus on est de fous plus on rit Razz

Sujet: Re: Un petit éditeur html Ven 5 Sep 2014 - 23:51

Tout n'est pas encore complètement codé, mais voici où j'en suis de mon ex-petit éditeur, qui a pris de l'embonpoint grâce à Jicehel
Un petit éditeur html Imghtm10

Pour avoir la fonction des boutons de la barre d'outils, mettre le curseur dessus (hint).
~~Il reste à faire les couleurs, et d'autres bricoles.~~
Je crois que c'est à peu près tout, je n'ai pas traité les ancres, mais pour moi ça n'a pas un gros intérêt et ça peut se faire à la main, comme tout ce qui manque, il n'y a ici que l'essentiel, ce n'est pas prévu pour construire un site mais un simple message.

Code:: ' EditHtml éditeur html wysiwyg
LABEL Ouvrir,Enr,Enrs,QEdit,Couper,Copier,Coller,Actuel,Balises,Tuto,Redim,Redim1
LABEL Outils,Insert,er2,Poscurs,Carspe,Pol1,Desbout,Desbout1
DIM wc%,wh%,i%,j%,k%,mm%,hv%,mf%,me%,mv%,ma%,mh%,od%,sd%,h0%,hh%,a$,b$,c$,q$,f$,v$,s$
DIM pas%,as%,ar%,in%,curs%,ligcur%,poscur%,nble%,wb,rc$,tb$,fp%,x%,y%,crsp$(30),crss$(30),nsp%
DIM fm$,ti%,an%,en%,ce%,li%,ta%,wu%
fm$ = "C:\TEMP\TmpHtm.htm"
f$ = ""
q$ = CHR$(34)
rc$ = CHR$(13)+CHR$(10): tb$ = CHR$(9)
READ a$: WHILE a$<>"Caract": READ a$: END_WHILE: ' caractères spéciaux et équivalents
nsp%=0: READ a$: WHILE a$<>"F": nsp%=nsp%+1: crsp$(nsp%)=a$: READ a$: END_WHILE
FOR i% = 1 TO nsp%: READ a$: crss$(i%)=a$: NEXT i%

wc% = 600: wh% = 600
h0% = SCREEN_Y-100
WIDTH 0,wc%+wh%+16: HEIGHT 0,h0%: BORDER_SMALL 0: CAPTION 0," Éditeur HTML"
FONT_NAME 0,"Arial": FONT_SIZE 0,9: FONT_BOLD 0: COLOR 0,190,255,255
' BARRE DE MENUS +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
i% = 10: MAIN_MENU i%
mf%=11: SUB_MENU mf%: PARENT mf%,i%: CAPTION mf%,"Fichier"
i%=mf%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Ouvrir...": ON_CLICK i%,Ouvrir
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Enregistrer": ON_CLICK i%,Enr
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Enregistrer sous...": ON_CLICK i%,Enrs
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Quitter": ON_CLICK i%,QEdit
me%=21: SUB_MENU me%: PARENT me%,OBJECT_PARENT(mf%): CAPTION me%,"Edit"
i%=me%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Couper": ON_CLICK i%,Couper
i%=i%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Copier": ON_CLICK i%,Copier
i%=i%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Coller": ON_CLICK i%,Coller
mv%=i%+1: SUB_MENU mv%: PARENT mv%,OBJECT_PARENT(mf%): CAPTION mv%,"Fenêtre"
i%=mv%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Plus large"
i%=i%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Plus haute"
i%=i%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Moins large"
i%=i%+1: SUB_MENU i%: PARENT i%,mv%: CAPTION i%,"Moins haute"
FOR i% = 1 TO 4: ON_CLICK mv%+i%,Redim: NEXT i%
in%=i%+1: SUB_MENU in%: PARENT in%,OBJECT_PARENT(mf%): CAPTION in%,"Insérer"
i%=in%+1: SUB_MENU i%: PARENT i%,in%: CAPTION i%,"Gras"
i%=i%+1: SUB_MENU i%: PARENT i%,in%: CAPTION i%,"Italique"
i%=i%+1: SUB_MENU i%: PARENT i%,in%: CAPTION i%,"Souligné"
FOR i% = 1 TO 3: ON_CLICK in%+i%,Insert: NEXT i%
ma%=50: SUB_MENU ma%: PARENT ma%,OBJECT_PARENT(mf%): CAPTION ma%,"Actualiser"
ON_CLICK ma%,Actuel
mh%=60: SUB_MENU mh%: PARENT mh%,OBJECT_PARENT(mf%): CAPTION mh%,"Aide"
i%=mh%+1: SUB_MENU i%: PARENT i%,mh%: CAPTION i%,"Balises Html": ON_CLICK i%,Balises
i%=i%+1: SUB_MENU i%: PARENT i%,mh%: CAPTION i%,"Tutoriel (Web)": ON_CLICK i%,Tuto
' BARRE D'OUTILS +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
wb=26: ti%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,0: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H1": HINT i%,"Titre H1"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H2": HINT i%,"Titre H2"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H3": HINT i%,"Titre H3"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H4": HINT i%,"Titre H4"
an%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"An": HINT i%,"Ancre"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Img": HINT i%,"Image"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Cou": HINT i%,"Couleur"
en%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"B": HINT i%,"Gras"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
FONT_ITALIC i%: CAPTION i%,"I": HINT i%,"Italique"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
FONT_UNDERLINE i%: CAPTION i%,"S": HINT i%,"Souligné"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Tab": HINT i%,"Tabulation"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"< !": HINT i%,"Commentaire"
ce%=i%: ' boutons graphiques (pictures)
i%=i%+1: x%=LEFT(i%-1)+36: GOSUB Desbout: HINT i%,"Horizontal gauche"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Horizontal centré"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Horizontal droite"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Vertical haut"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Vertical centré"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Vertical bas"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"é": HINT i%,"Caractères spéciaux"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Pol": HINT i%,"Police"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Ctx": HINT i%,"Couleur texte"
li%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Ln": HINT i%,"Liste numérotée"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Lp": HINT i%,"Liste à puces"
ta%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Tab": HINT i%,"Tableau"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"NL": HINT i%,"Ligne de tableau"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Vu": HINT i%,"Rafraîchir"
FOR k% = ti%+1 TO i%: ON_CLICK k%, Outils: NEXT k%
i%=i%+1: ALPHA i%: TOP i%,-3: LEFT i%,LEFT(i%-1)+wb+10: FONT_BOLD_OFF i%
a$="Cliquer un emplacement ou sélectionner une zone dans le source,"
CAPTION i%,a$+chr$(10)+"puis cliquer l'outil désiré."
' BARRE DE TITRES ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
i%=i%+1: ALPHA i%: TOP i%,28: LEFT i%,wc%/2-40: CAPTION i%," SOURCE ": as% = i%
COLOR i%,255,255,0
y%=TOP(i%)-4: wu%=40
i%=i%+1: x%=LEFT(as%)-40: GOSUB Desbout1: HINT i%,"Source plus étroit"
i%=i%+1: x%=LEFT(as%)+55: GOSUB Desbout1: HINT i%,"Source plus large"
i%=i%+1: ALPHA i%: TOP i%,TOP(as%): LEFT i%,wc%+wh%/2-40: CAPTION i%," RÉSULTAT ":ar%=i%
COLOR i%,255,255,0
i%=i%+1: x%=LEFT(ar%)-40: GOSUB Desbout1: HINT i%,"Résultat plus étroit"
i%=i%+1: x%=LEFT(ar%)+65: GOSUB Desbout1: HINT i%,"Résultat plus large"
' ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
mm%=100: MEMO mm%: TOP mm%,TOP(i%-1)+20: LEFT mm%,0: WIDTH mm%,wc%: HEIGHT mm%,h0%-100
COLOR mm%,255,255,195: BAR_BOTH mm%
FONT_NAME mm%,"Lucida Console": FONT_SIZE mm%,8: FONT_BOLD_OFF mm%
hv%=mm%+1: HVIEWER hv%: TOP hv%,TOP(mm%): LEFT hv%,wc%: WIDTH hv%,wh%
HEIGHT hv%,HEIGHT(mm%)
' ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
od%=105: OPEN_DIALOG od%: FILTER od%,"Fichiers HTML|*.htm"
sd%=od%+1: SAVE_DIALOG sd%: FILTER sd%,"Fichiers HTML|*.htm"
' FORM POLICE ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
fp%=150: FORM fp%: TOP fp%,TOP(0)+100: LEFT fp%,LEFT(0)+200: WIDTH fp%,200
HEIGHT fp%,300: BORDER_SMALL fp%: CAPTION fp%,"POLICES:": HIDE fp%
COLOR fp%,200,255,255
i%=fp%+1: LIST i%: PARENT i%,fp%: FULL_SPACE i%: HEIGHT i%,HEIGHT(fp%)-78
FONT_NAMES_LOAD i%
FOR k%=COUNT(i%) TO 1 STEP -1
IF LEFT$(ITEM_READ$(i%,k%),1)="@" THEN ITEM_DELETE i%,k%
NEXT k%
i%=i%+1: ALPHA i%: PARENT i%,fp%: TOP i%,HEIGHT(i%-1)+5: LEFT i%,5
CAPTION i%,"Taille (1 à 7):"
i%=i%+1: SPIN i%: PARENT i%,fp%: TOP i%,TOP(i%-1)-3: LEFT i%,70: WIDTH i%,45
MIN i%,1: MAX i%,7: POSITION i%,2
i%=i%+1: BUTTON i%: PARENT i%,fp%: TOP i%,TOP(i%-1): LEFT i%,LEFT(i%-1)+50
WIDTH i%,50: CAPTION i%,"OK": ON_CLICK i%,Pol1
' FORM AIDE ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
hh%=200: FORM hh%: TOP hh%,0: LEFT hh%,200: WIDTH hh%,640: HEIGHT hh%,SCREEN_Y-80
HIDE hh%: CAPTION hh%," - PRINCIPALES BALISES HTML -
i%=hh%+1: LIST i%: PARENT i%,hh%: FULL_SPACE i%: FONT_NAME i%,"Lucida Console"
READ a$: WHILE a$<>"Balises": READ a$: END_WHILE
READ a$: WHILE a$<>"FBalises": ITEM_ADD i%,a$: READ a$: END_WHILE

ITEM_ADD mm%,"<HTML>": ITEM_ADD mm%," <HEADER><TITLE>...</TITLE></HEADER>": ITEM_ADD mm%," <BODY>"
ITEM_ADD mm%,"": ITEM_ADD mm%," ... corps du message ...": ITEM_ADD mm%,""
ITEM_ADD mm%," </BODY>": ITEM_ADD mm%,"</HTML>"
GOSUB Actuel
END
' ==============================================================================
Ouvrir:
a$ = FILE_NAME$(od%): IF LEN(a$)<4 THEN RETURN
f$ = a$: CAPTION 0," Fichier : "+f$
FILE_LOAD mm%,f$: ' Ouvrir
FILE_LOAD hv%,f$
RETURN
' ==============================================================================
Enr:
IF f$ = "" THEN RETURN
FILE_SAVE mm%,f$: ' Enregistrer
RETURN
' ==============================================================================
Enrs:
a$ = FILE_NAME$(sd%): IF LEN(a$)<4 THEN RETURN
f$ = a$: CAPTION 0,f$
FILE_SAVE mm%,f$: ' Enregistrer sous...
RETURN
' ==============================================================================
QEdit:

TERMINATE
' ==============================================================================
Couper:
CLIPBOARD_CUT mm%
RETURN
' ==============================================================================
Copier:
CLIPBOARD_COPY mm%
RETURN
' ==============================================================================
Coller:
CLIPBOARD_PASTE mm%
RETURN
' ==============================================================================
Actuel:
' Actualiser l'image à droite en fonction du source à gauche
FILE_SAVE mm%,fm$
FILE_LOAD hv%,fm$
RETURN
' ==============================================================================
Balises:
SHOW hh%
RETURN
' ==============================================================================
Tuto:
' Tutoriel Html en ligne
EXECUTE_WAIT "http://www.ukonline.be/programmation/html/tutoriel/"
RETURN
' ==============================================================================
Redim:
' Redimensionner la fenêtre
pas% = 100: ' pixels, pas de l'agrandissement ou réduction total
IF CLICKED(mv%+1) = 1: ' agrandir la fenêtre en largeur
wc% = wc%+pas%/2: wh% = wh%+pas%/2
ELSE
IF CLICKED(mv%+2) = 1: ' agrandir en hauteur
h0% = h0%+pas%
ELSE
IF CLICKED(mv%+3) = 1: ' réduire en largeur
wc% = wc%-pas%/2: wh% = wh%-pas%/2
ELSE
h0% = h0%-pas%: ' réduire en hauteur
END_IF
END_IF
END_IF
WIDTH mm%,wc%: HEIGHT mm%,h0%-100
LEFT hv%,wc%: WIDTH hv%,wh%: HEIGHT hv%,HEIGHT(mm%)
WIDTH 0,wc%+wh%+16: HEIGHT 0,h0%
LEFT as%,wc%/2-40: LEFT ar%,wc%+wh%/2-40
LEFT as%+1,LEFT(as%)-40: LEFT as%+2,LEFT(as%)+55
LEFT ar%+1,LEFT(ar%)-40: LEFT ar%+2,LEFT(ar%)+65
RETURN
' ==============================================================================
Redim1:
i% = NUMBER_CLICK: k%=i%-as%
pas%=25
SELECT k%
CASE 1: wc%=wc%-pas%
CASE 2: wc%=wc%+pas%
CASE 4: wh%=wh%-pas%
CASE 5: wh%=wh%+pas%
END_SELECT
WIDTH mm%,wc%: LEFT hv%,wc%: WIDTH hv%,wh%
WIDTH 0,wc%+wh%+16
LEFT as%,wc%/2-40: LEFT ar%,wc%+wh%/2-40
LEFT as%+1,LEFT(as%)-40: LEFT as%+2,LEFT(as%)+55
LEFT ar%+1,LEFT(ar%)-40: LEFT ar%+2,LEFT(ar%)+65
RETURN
' ==============================================================================
Outils:
' clic sur un bouton de la barre d'outils
i% = NUMBER_CLICK
c$ = "": s$ = ""
IF i%<(ti%+5): ' boutons 'titre'
k%=i%-ti%: c$="<H"+STR$(k%)+">": s$="</H"+STR$(k%)+">"
ELSE
IF i%<(an%+4): ' ancre, image, couleurs
k%=i%-an%
SELECT k%
CASE 1: return
CASE 2: c$="<IMG SRC="+q$+"xxx"+q$+" WIDTH="+q$+"320"+q$
c$=c$+" HEIGHT="+q$+"240"+q$+">"
CASE 3: Palette216(200,100): c$="COLOR="+q$+"#"+CLIPBOARD_STRING_PASTE$+q$
END_SELECT
ELSE
IF i%<(en%+6): ' enrichissements texte
k%=i%-en%
SELECT k%
CASE 1: c$="<B>": s$="</B>"
CASE 2: c$="<I>": s$="</I>"
CASE 3: c$="<U>": s$="</U>"
CASE 4: c$ = CHR$(9): ' tabulation
CASE 5: c$="<!": s$ = ">": ' zone en commentaire
END_SELECT
ELSE
IF i%<(ce%+10): ' alignement, caractères spéciaux, police
k%=i%-ce%
SELECT k%
CASE 1: c$="ALIGN="+CHR$(34)+"LEFT"+CHR$(34)
CASE 2: c$="ALIGN="+CHR$(34)+"CENTER"+CHR$(34)
CASE 3: c$="ALIGN="+CHR$(34)+"RIGHT"+CHR$(34)
CASE 4: c$="VALIGN="+CHR$(34)+"TOP"+CHR$(34)
CASE 5: c$="VALIGN="+CHR$(34)+"CENTER"+CHR$(34)
CASE 6: c$="VALIGN="+CHR$(34)+"BOTTOM"+CHR$(34)
CASE 7: GOSUB Carspe: RETURN: ' conversion des lettres accentuées
CASE 8: SHOW fp%: RETURN: ' Police
Pol1:
i%=ITEM_INDEX(fp%+1): IF i%=0 THEN HIDE fp%: RETURN
a$ = ITEM_INDEX$(fp%+1): k% = POSITION(fp%+3): HIDE fp%
c$="<FONT FACE="+q$+a$+q$: ' Police
c$=c$+" SIZE="+q$+STR$(k%)+q$+">"
s$="</FONT>"
CASE 9: Palette216(200,100): ' couleur zone de texte
c$="<FONT COLOR="+q$+"#"+CLIPBOARD_STRING_PASTE$+q$+">"
s$="</FONT>"
END_SELECT
ELSE
IF i%<(li%+3): ' listes: demander le nombre d'éléments <----
a$=MESSAGE_INPUT$("Liste","Nombre d'éléments:","")
IF a$ = "" THEN RETURN
j% = VAL(a$): IF j%=0 THEN RETURN
k%=i%-li%
SELECT k%
CASE 1: c$="<OL>": b$ = "</OL>": ' liste numérotée
CASE 2: c$="<UL>": b$ = "</UL>": ' liste à puces
END_SELECT
c$ = c$+rc$
FOR k% = 1 TO j%: c$=c$+" <LI>"+rc$: NEXT k%
c$=c$+b$
ELSE
IF i%<(ta%+4): ' tableau, insertion rangée, voir
k%=i%-ta%
SELECT k%
CASE 1: c$="<TABLE BORDER="+q$+"0"+q$+" WIDTH="
c$=c$+q$+"550"+q$+">"+rc$+"</TABLE>"
CASE 2: c$="<TR>"+rc$+" <TD WIDTH="+q$+"100"+q$+">"
c$=c$+rc$+"<FONT FACE="+q$+"Arial, Helvetica"+q$
c$=c$+" SIZE="+q$+"2"+q$+">"+rc$+" </FONT>"+rc$
c$=c$+" </TD>"+rc$+"</TR>"
CASE 3: GOSUB Actuel: RETURN
END_SELECT
s$ = ""
END_IF
END_IF
END_IF
END_IF
END_IF
END_IF
GOSUB Insert
RETURN
' ==============================================================================
Insert:
b$ = SELECT_READ$(mm%): ' zone sélectionnée
GOSUB Poscurs
IF b$ = ""
a$ = ITEM_READ$(mm%, ligcur%): ' insertion d'un code de formatage seul
a$ = LEFT$(a$,poscur%-1)+c$+MID$(a$,poscur%,200)
ITEM_DELETE mm%,ligcur%: ITEM_INSERT mm%,ligcur%,a$
ELSE
' insertion de deux codes encadrant la sélection
v$ = b$: nble% = 1
er2:
k% = INSTR(v$, rc$)
IF k% > 0
nble% = nble% + 1
v$ = MID$(v$,k%+2,10000): GOTO er2
END_IF
IF nble% = 1
' la sélection de texte est sur une seule ligne
a$ = ITEM_READ$(mm%, ligcur%)
a$ = LEFT$(a$,poscur%-1)+c$+b$+s$+MID$(a$,poscur%,100)
ITEM_DELETE mm%,ligcur%: ITEM_INSERT mm%,ligcur%,a$
ELSE
' la sélection de texte est sur plusieurs lignes
a$ = ITEM_READ$(mm%, ligcur%)
v$ = LEFT$(a$, poscur%-1)+c$+b$+s$+MID$(a$, poscur%,100)
ITEM_DELETE mm%, ligcur%
FOR i% = 0 to nble%-1
k% = INSTR(v$, rc$): IF k% < 1 THEN EXIT_FOR
ITEM_INSERT mm%,ligcur%+i%,LEFT$(v$,k%-1)
v$ = MID$(v$,k%+2,10000)
NEXT i%
ITEM_INSERT mm%, ligcur%+i%, v$
END_IF
END_IF
CARET_POSITION mm%, curs%
RETURN
' ==============================================================================
Poscurs:
' Calcul de la position du curseur (ligne et indice) dans le Memo (emplacement cliqué)
CLIPBOARD_STRING_COPY CHR$(255): CLIPBOARD_PASTE mm%: CLIPBOARD_STRING_COPY ""
curs% = 0
FOR i% = 1 TO COUNT(mm%)
a$ = ITEM_READ$(mm%, i%)
k% = INSTR(a$, CHR$(255))
IF k% > 0
a$ = LEFT$(a$, k%-1)+MID$(a$,k%+1,200)
ITEM_DELETE mm%,i%: ITEM_INSERT mm%, i%, a$
ligcur% = i%: ' ligne du clic
poscur% = k%: ' index du clic dans la ligne
curs% = curs% + k%-1: ' index absolu (par rapport au début du memo)
EXIT_FOR
END_IF
curs% = curs% + LEN(a$) + 2
NEXT i%
RETURN
' ==============================================================================
Carspe:
' Conversion des caractères spéciaux en codes html
FOR i% = 1 TO COUNT(mm%)
a$ = ITEM_READ$(mm%,i%): c$=a$
FOR j% = 1 TO nsp%
b$ = crsp$(j%)
k%=INSTR(a$,b$)
WHILE k%>0
a$=LEFT$(a$,k%-1)+crss$(j%)+MID$(a$,k%+1,500): k%=INSTR(a$,b$)
END_WHILE
NEXT j%
IF a$<>c$ THEN ITEM_DELETE mm%,i%: ITEM_INSERT mm%,i%,a$: ' car. trouvés
NEXT i%
RETURN
' ==============================================================================
Desbout:
PICTURE i%: TOP i%,0: LEFT i%,x%: WIDTH i%,wb: HEIGHT i%,24
2D_TARGET_IS i%: 2D_RECTANGLE 0,0,wb,24
k%=i%-ce%
SELECT k%
CASE 1: 2D_LINE 5,5,20,5: 2D_LINE 5,8,15,8: 2D_LINE 5,11,20,11: 2D_LINE 5,14,15,14
2D_LINE 5,17,20,17
CASE 2: 2D_LINE 5,5,20,5: 2D_LINE 8,8,18,8: 2D_LINE 5,11,20,11: 2D_LINE 8,14,18,14
2D_LINE 5,17,20,17
CASE 3: 2D_LINE 5,5,20,5: 2D_LINE 11,8,20,8: 2D_LINE 5,11,20,11: 2D_LINE 11,14,20,14
2D_LINE 5,17,20,17
CASE 4: 2D_LINE 6,4,6,20: 2D_LINE 9,4,9,15: 2D_LINE 12,4,12,20: 2D_LINE 15,4,15,15
2D_LINE 18,4,18,20
CASE 5: 2D_LINE 6,4,6,20: 2D_LINE 9,7,9,17: 2D_LINE 12,4,12,20: 2D_LINE 15,7,15,17
2D_LINE 18,4,18,20
CASE 6: 2D_LINE 6,4,6,20: 2D_LINE 9,10,9,20: 2D_LINE 12,4,12,20: 2D_LINE 15,10,15,20
2D_LINE 18,4,18,20
END_SELECT
RETURN
' ==============================================================================
Desbout1:
PICTURE i%: TOP i%,y%: LEFT i%,x%: WIDTH i%,wu%: HEIGHT i%,20
2D_TARGET_IS i%: 2D_RECTANGLE 0,0,wu%,20: PRINT_TARGET_IS i%: FONT_NAME i%,"Wingdings"
ON_CLICK i%,Redim1
k%=i%-as%
SELECT k%
CASE 1: PRINT_LOCATE 2,4: PRINT CHR$(232)+" "+CHR$(231)
CASE 2: PRINT_LOCATE 2,4: PRINT CHR$(231)+" "+CHR$(232)
CASE 4: PRINT_LOCATE 2,4: PRINT CHR$(232)+" "+CHR$(231)
CASE 5: PRINT_LOCATE 2,4: PRINT CHR$(231)+" "+CHR$(232)
END_SELECT
RETURN
' ==============================================================================
SUB Palette216(x,y)
' Choix d'une couleur dans une palette de 216 (couleurs html) affichée en x,y
' Résultat dans le clipboard sous forme d'une chaîne hexa RRGGBB
IF LABEL("Aff_pal216") = 0 THEN LABEL Aff_pal216
IF LABEL("Qui_pal216") = 0 THEN LABEL Qui_pal216
DIM_LOCAL a$, nfo%, np, nq, nt, nb, wc, hc, r, g, b, i, j, qq
qq = 0: wc = 15: hc = 12
nfo%=3000: WHILE OBJECT_EXISTS(nfo%)=1: nfo%=nfo%+1: END_WHILE
FORM nfo%: TOP nfo%,y: LEFT nfo%,x: WIDTH nfo%,12*(wc+1)+16: HEIGHT nfo%,18*hc+84
BORDER_SMALL nfo%
CAPTION nfo%," PALETTE 216 COULEURS HTML": ON_CLOSE nfo%,Qui_pal216
np=nfo%+1: WHILE OBJECT_EXISTS(np)=1: np=np+1: END_WHILE
PICTURE np: PARENT np,nfo%: FULL_SPACE np: 2D_TARGET_IS np
ON_CLICK np,Aff_pal216
nq=np+1: WHILE OBJECT_EXISTS(nq)=1: nq=nq+1: END_WHILE
PICTURE nq: PARENT nq,nfo%: TOP nq,18*hc+22: LEFT nq,5: WIDTH nq,3*wc
HEIGHT nq,25
nt=nq+1: WHILE OBJECT_EXISTS(nt)=1: nt=nt+1: END_WHILE
ALPHA nt: PARENT nt,nfo%: TOP nt,TOP(nq): LEFT nt,LEFT(nq)+WIDTH(nq)+5
FONT_NAME nt,"Lucida Console"
nb=nt+1: WHILE OBJECT_EXISTS(nb)=1: nb=nb+1: END_WHILE
BUTTON nb: PARENT nb,nfo%:TOP nb,TOP(nq): WIDTH nb,50: LEFT nb,WIDTH(nfo%)-70
CAPTION nb,"OK"
ON_CLICK nb,Qui_pal216
r = 0: g = 0: b = 0
FOR j=0 TO 17
y = j*(hc+1)
FOR i = 0 TO 11
x = i*(wc+1): 2D_PEN_COLOR r,g,b: 2D_FILL_COLOR r,g,b
2D_RECTANGLE x,y,x+wc,y+hc
b=b+51
IF b>255
b=0: g=g+51
IF g>255
g=0: r=r+51
END_IF
END_IF
NEXT i
NEXT j
r=0: g=0: b=0: COLOR nq,r,g,b
CAPTION nt,"#00 00 00"+CHR$(10)+STR$(r)+","+STR$(g)+","+STR$(b)
2D_TARGET_IS nq: 2D_PEN_COLOR 164,164,164
WHILE qq=0: WAIT 100: TO_FOREGROUND nfo%: END_WHILE: DELETE nfo%: EXIT_SUB
Aff_pal216:
x=MOUSE_X_LEFT_DOWN(np): y=MOUSE_Y_LEFT_DOWN(np)
r=COLOR_PIXEL_RED(np,x,y): g=COLOR_PIXEL_GREEN(np,x,y): b=COLOR_PIXEL_BLUE(np,x,y)
2D_FILL_COLOR r,g,b: 2D_RECTANGLE 0,0,WIDTH(nq),HEIGHT(nq)
a$ = "#"+RIGHT$("0"+HEX$(r),2)+" "+RIGHT$("0"+HEX$(g),2)+" "+RIGHT$("0"+HEX$(b),2)
a$ = a$ + CHR$(10)+STR$(r)+","+STR$(g)+","+STR$(b)
CAPTION nt,a$
RETURN
Qui_pal216:
2D_TARGET_IS 0
CLIPBOARD_STRING_COPY RIGHT$("0"+HEX$(r),2)+RIGHT$("0"+HEX$(g),2)+RIGHT$("0"+HEX$(b),2)
qq = 1
RETURN
END_SUB
' ==============================================================================
DATA "Caract"
DATA "à","â","é","è","ê","ë","î","ï","ô","û","ü","ç","É",q$,"F"
DATA "à","â","&eacute:","è","ê","ë","î","ï"
DATA "ô","û","ü","&ccdil;","É","""
DATA "Balises"
DATA "========== FICHIER HTML ============================================================="
DATA "<HTML>...</HTML> Début et fin de fichier Html"
DATA "<HEAD>...</HEAD> Zone d'en-tête d'un fichier Html"
DATA "<TITLE>...</TITLE> Titre affiché par le browser (élément de HEAD)"
DATA "<BODY>...</BODY> Début et fin du corps du fichier Html"
DATA "<BODY bgcolor="+q$+"#RRGGBB"+q$+"> Couleur d'arrière-plan (en hexadécimal)"
DATA "<BODY background="+q$+"xyz.gif"+q$+"> Image d'arrière-plan"
DATA ""
DATA "========== MISE EN FORME DES CARACTÈRES ============================================="
DATA "<B>...</B> Texte en gras"
DATA "<BIG>...</BIG> Agrandissement de la taille des caractères"
DATA "<BLINK>...</BLINK> Texte clignotant (Netscape seul)"
DATA "<EM>...</EM> Texte en italique"
DATA "<FONT color="+q$+"#RRGGBB"+q$+">...</FONT> Texte en couleur, RRGGBB valeur hexadécimale"
DATA "<FONT size=X>...</FONT> Taille des caractères où X est une valeur de 1 à 7"
DATA "<I>...</I> Texte en italique"
DATA "<NOBR>...</NOBR> Empêche les sauts de lignes auto des navigateurs"
DATA "<PRE>...</PRE> Texte préformaté: affichage espaces et sauts/ligne"
DATA "<SMALL>...</SMALL> Réduction de la taille des caractères"
DATA "<STRONG>...</STRONG> Mise en gras du texte"
DATA "<SUB>...</SUB> Texte en indice"
DATA "<SUP>...</SUP> Texte en exposant"
DATA "<U>...</U> Texte souligné"
DATA ""
DATA "========== MISE EN FORME DU TEXTE ==================================================="
DATA " Commentaire, ignoré par le navigateur"
DATA "<BR> A la ligne"
DATA "<BLOCKQUOTE>...</BLOCKQUOTE> Citation (introduit un retrait du texte)"
DATA "<CENTER>...</CENTER> Centre tout élément compris dans le tag"
DATA "<DIV align=center> ...</DIV> Centre l'élément encadré par le tag"
DATA "<DIV align=left> ...</DIV> Aligne l'élément à gauche"
DATA "<DIV align=right> ...</DIV> Aligne l'élément à droite"
DATA "<Hx>...</Hx> Titre où x a une valeur de 1 à 6"
DATA "<Hx align=center>...</Hx> Titre centré"
DATA "<Hx align=left>...</Hx> Titre aligné à gauche"
DATA "<Hx align=right>...</Hx> Titre aligné à droite"
DATA "<P>...</P> Nouveau paragraphe"
DATA "<P align=center>...</P> Paragraphe centré"
DATA "<P align=left>...</P> Paragraphe aligné à gauche"
DATA "<P align=right>...</P> Paragraphe aligné à droite"
DATA ""
DATA "========== LISTES ==================================================================="
DATA "<UL> Liste non numérotée (dite à puces)"
DATA "<LI> Élément de liste"
DATA "</UL>"
DATA "<OL> Liste numérotée"
DATA "<LI> Élément de liste"
DATA "</OL>"
DATA "<DL> Liste de glossaire"
DATA "<DT>...</DT> Terme de glossaire (sans retrait)"
DATA "<DD>...</DD> Explication du terme (avec retrait)"
DATA "</DL>"
DATA ""
DATA "========== LIGNE DE SÉPARATION ======================================================"
DATA "<HR> Trait horizontal (centré par défaut)"
DATA "<HR width="+q$+"x%"+q$+"> Largeur du trait en %"
DATA "<HR width=x> Largeur du trait en pixels"
DATA "<HR size=x> Épaisseur du trait en pixels (20 maxi)"
DATA "<HR align=center> Trait centré (défaut)"
DATA "<HR align=left> Trait aligné à gauche"
DATA "<HR align=right> Trait aligné à droite"
DATA "<HR color="+q$+"#RRGGBB"+q$+"> Couleur du trait (valeur hexa)"
DATA "<HR noshade> Trait sans effet d'ombrage"
DATA ""
DATA "========== HYPERLIENS ==============================================================="
DATA "<A href="+q$+"http://..."+q$+">...</A> Lien vers une page Web"
DATA "<A href="+q$+"mailto:..."+q$+">...</A> Lien vers une adresse email"
DATA "<A href="+q$+"fichier.htm"+q$+">...</A> Lien vers page locale fichier.htm située même dossier"
DATA "<A name="+q$+"xyz"+q$+">...</A> Définition d'une ancre"
DATA "<A href="+q$+"#xyz"+q$+">...</A> Lien vers une ancre"
DATA "<A href="+q$+"fichier#xyz"+q$+">...</A>"
DATA ""
DATA "========== IMAGES =================================================================== "
DATA "<IMG src="+q$+"xyz.gif"+q$+">"
DATA "<IMG src="+q$+"xyz.jpg"+q$+"> Insère img format Gif ou Jpg (cf liens pour adressage)"
DATA "<IMG ... width=x height=y> Mise à échelle d'image (pixels) (accélère affichage)"
DATA "<IMG ... border=x> Définition de la bordure d'une image avec lien"
DATA "<IMG ... alt="+q$+"votre texte"+q$+"> Texte alternatif lorsque l'image n'est pas affichée"
DATA "<IMG ... align=bottom> Aligne l’image en bas"
DATA "<IMG ... align=middle> Aligne l’image au milieu"
DATA "<IMG ... align=top> Aligne l’image en haut"
DATA "<IMG ... align=left> Aligne l’image à gauche"
DATA "<IMG ... align=right> Aligne l’image à droite"
DATA "<IMG ... hspace=x> Espacement horizontal entre l'image et le texte"
DATA "<IMG ... vspace=y> Espacement vertical entre l'image et le texte"
DATA ""
DATA "========== TABLEAUX ================================================================="
DATA "<TABLE>...</TABLE> Définition d'un tableau"
DATA "<TABLE width="+q$+"x%"+q$+"> Largeur du tableau en %"
DATA "<TABLE width=x> Largeur du tableau en pixels"
DATA "<TABLE border=x> Largeur de la bordure"
DATA "<TABLE cellpadding=x> Espace entre la bordure et le texte"
DATA "<TABLE cellspacing=x> Epaisseur du trait entre les cellules"
DATA "<TR>...</TR> Ligne du tableau"
DATA "<TD>...</TD> Cellule du tableau"
DATA "<TD bgcolor="+q$+"#RRGGBB"+q$+"> Couleur d'une cellule de tableau"
DATA "<TD width="+q$+"x%"+q$+"> Largeur de colonne en %"
DATA "<TD width=x> Largeur de colonne en pixels"
DATA "<TD align=center> Texte centré dans la cellule"
DATA "<TD align=left> Texte aligné à gauche dans la cellule"
DATA "<TD align=right> Texte aligné à droite dans la cellule"
DATA "<TD valign=bottom> Alignement vers le bas du contenu d'une cellule"
DATA "<TD valign=middle> Centrage vertical du contenu d'une cellule"
DATA "<TD valign=top> Alignement vers le haut du contenu d'une cellule"
DATA "<TD colspan=x> Nombre de cellules à fusionner horizontalement"
DATA "<TD rowspan=x> Nombre de cellules à fusionner verticalement"
DATA ""
DATA "========== FRAMES ==================================================================="
DATA "<FRAMESET>...</FRAMESET> Définit une struct. de frames (rempl. alors tag BODY)"
DATA "<FRAMESET rows="+q$+"x%,y%,..."+q$+"> Division horizontale de la fenêtre en %"
DATA "<FRAMESET cols="+q$+"x%,y%,..."+q$+"> Division verticale de la fenêtre en %"
DATA "<FRAME src="+q$+"fichier.htm"+q$+"> Fichier affiché dans une fenêtre de frames"
DATA "<NOFRAMES>...</NOFRAMES> Contenu pour les browsers non prévus pour les frames"
DATA "FBalises"
' ===============================================================================

6/8 petits détails...
+ ajout d'un bouton couleur de texte ('Ctx')

Sujet: Re: Un petit éditeur html Sam 6 Sep 2014 - 8:11

Alors là il n'y a rien a rajouter !

Ah si ! une petit erreur d'inattention c'est glissé dans ton code a la fin de la ligne 440 : un guillemet de trop. Laughing

Sinon, rien a dire. En plus pas de fichier externe pour les icones, tout est fait en Panoramic.
Les hint pour les infos sur les icones, on a même droit a une palette de couleur avec ses dégradées.

Vraiment BRAVO JL35 ! cheers

Sujet: re Sam 6 Sep 2014 - 10:05

Tu devrais ajouter le "head" avec les balises pour la langue et tout le reste.
Sinon, tu risques d' avoir des surprise sur certains browser avec des lettres accentuées
et autres... Wink

Sujet: Re: Un petit éditeur html Sam 6 Sep 2014 - 10:11

Oui, là je suis d'accord, si le but est de faire un éditeur HTML simple, avec l'usage des icônes, le résultat est obtenu.
C'est efficace.

Sujet: Re: Un petit éditeur html Sam 6 Sep 2014 - 14:02

@ygeronimi
Pour les lettres accentuées, tu as un bouton qui fait la conversion sur demande, le bouton 'é' (pour toutes les lettres accentuées du memo),
certes il n'y a que les plus courantes, mais il suffit de rajouter les manquantes dans les datas de fin de programme.
Le <head> </head> n'est pas forcément nécessaire, c'est à ajouter au besoin, comme le <title>.

@Minibug
Je n'ai pas vu ce guillemet de trop... une farce du forum ? en tout cas merci pour ton appréciation.

Pour les balises ajoutées par les boutons icônes, j'ai fait selon mon idée, mais c'est très facile à modifier à sa façon (s/p Outils).
Il n'y a pas de subtilités particulières dans le programme, tout est facilement modifiable, et améliorable sûrement.
Ainsi par exemple la numérotation des objets par i%+1 est bien pratique pour en insérer ultérieurement sans problèmes, tout se réajuste automatiquement.

Je viens d'ajouter un bouton ('Ctx') pour colorer une zone de texte sélectionnée.

Et puis j'ai corrigé une anomalie bizarre: dans le s/p 'Actuel' il y a 2 lignes: File_save mm%,fm$ et File_load hv%,fm$.
Or ce fm$ n'était défini nulle part, même pas dans les déclarations de variables, il n'apparaissait que dans ces 2 lignes, et pourtant on passait sans erreur et sans problème dans le sous programme, je n'ai pas compris scratch

Bon, en tout cas c'est réparé.

Sujet: Re: Un petit éditeur html Sam 6 Sep 2014 - 18:40

Je viens d'ajouter 4 boutons pour redimensionner facilement les deux fenêtres, individuellement.
Et c'est tout pour ce soir (je sors).

Invité

Citation :: Or ce fm$ n'était défini nulle part, même pas dans les déclarations de variables, il n'apparaissait que dans ces 2 lignes, et pourtant on passait sans erreur et sans problème dans le sous programme, je n'ai pas compris

J'ai juste jeté un œil à ton programme. Dans ces lignes, le programme ne les considère pas fm$ comme variable, mais comme nom. Tu as donc un fichier qui a le nom: fm$.
Sleep

Sujet: Re: Un petit éditeur html Sam 6 Sep 2014 - 23:56

C'est ce que j'en avais déduit après coup, et tu as raison c'est effectivement ce qui se passait, il me créait un fichier du nom de 'fm$' dans le répertoire d'exécution.

C'est tout de même curieux, comme ce n'était pas entre guillemets il aurait dû considérer ça comme une variable, non déclarée, et sortir en erreur...

Sujet: Re: Un petit éditeur html Lun 8 Sep 2014 - 17:50

Dernière version en date:

Code:: ' EditHtml éditeur html wysiwyg
LABEL Ouvrir,Enr,Enrs,Imprs,Impri,QEdit,Couper,Copier,Coller,Actuel,Balises,Tuto
LABEL Redim,Redim1,Outils,Insert,er2,Poscurs,Carspe,Pol1,Desbout,Desbout1,Desbout2
DIM wc%,wh%,i%,j%,k%,mm%,hv%,mf%,me%,mh%,od%,sd%,h0%,hh%,a$,b$,c$,q$,f$,v$,s$
DIM pas%,as%,ar%,curs%,ligcur%,poscur%,nble%,wb,rc$,tb$,fp%,x%,y%,crsp$(30),crss$(30),nsp%
DIM fm$,ti%,an%,en%,ce%,li%,ta%,wu%,bt%,fi$
fm$ = "C:\TEMP\TmpHtm.htm"
fi$ = "C:\TEMP\ImgHtm.bmp"
f$ = ""
q$ = CHR$(34)
rc$ = CHR$(13)+CHR$(10): tb$ = CHR$(9)
READ a$: WHILE a$<>"Caract": READ a$: END_WHILE: ' caractères spéciaux et équivalents
nsp%=0: READ a$: WHILE a$<>"F": nsp%=nsp%+1: crsp$(nsp%)=a$: READ a$: END_WHILE
FOR i% = 1 TO nsp%: READ a$: crss$(i%)=a$: NEXT i%

wc% = 600: wh% = 600
h0% = SCREEN_Y-100
WIDTH 0,wc%+wh%+16: HEIGHT 0,h0%: BORDER_SMALL 0: CAPTION 0," Éditeur HTML"
FONT_NAME 0,"Arial": FONT_SIZE 0,9: FONT_BOLD 0: COLOR 0,190,255,255
' BARRE DE MENUS +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
i% = 10: MAIN_MENU i%
mf%=11: SUB_MENU mf%: PARENT mf%,i%: CAPTION mf%,"Fichier"
i%=mf%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Ouvrir...": ON_CLICK i%,Ouvrir
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Enregistrer": ON_CLICK i%,Enr
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Enregistrer sous...": ON_CLICK i%,Enrs
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Imprimer le source": ON_CLICK i%,Imprs
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Imprimer l'aperçu": ON_CLICK i%,Impri
i%=i%+1: SUB_MENU i%: PARENT i%,mf%: CAPTION i%,"Quitter": ON_CLICK i%,QEdit
me%=21: SUB_MENU me%: PARENT me%,OBJECT_PARENT(mf%): CAPTION me%,"Edit"
i%=me%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Couper": ON_CLICK i%,Couper
i%=i%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Copier": ON_CLICK i%,Copier
i%=i%+1: SUB_MENU i%: PARENT i%,me%: CAPTION i%,"Coller": ON_CLICK i%,Coller
mh%=60: SUB_MENU mh%: PARENT mh%,OBJECT_PARENT(mf%): CAPTION mh%,"Aide"
i%=mh%+1: SUB_MENU i%: PARENT i%,mh%: CAPTION i%,"Balises Html": ON_CLICK i%,Balises
i%=i%+1: SUB_MENU i%: PARENT i%,mh%: CAPTION i%,"Tutoriel (Web)": ON_CLICK i%,Tuto
' BARRE D'OUTILS +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
wb=26: ti%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,0: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H1": HINT i%,"Titre H1"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H2": HINT i%,"Titre H2"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H3": HINT i%,"Titre H3"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"H4": HINT i%,"Titre H4"
an%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"An": HINT i%,"Ancre"+chr$(10)+"(non implémenté, voir l'aide)"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Img": HINT i%,"Insertion d'image"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Cou": HINT i%,"Couleur"
en%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"B": HINT i%,"Sélection en gras"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
FONT_ITALIC i%: CAPTION i%,"I": HINT i%,"Sélection en italiques"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
FONT_UNDERLINE i%: CAPTION i%,"S": HINT i%,"Sélection en souligné"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Tab": HINT i%,"Insertion tabulation"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"< !": HINT i%,"Sélection en commentaire"
ce%=i%: ' boutons graphiques (pictures)
i%=i%+1: x%=LEFT(i%-1)+36: GOSUB Desbout: HINT i%,"Sélection alignée"+chr$(10)+"à gauche"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Sélection centrée"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Sélection alignée"+chr$(10)+"à droite"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Vertical haut"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Vertical centré"
i%=i%+1: x%=LEFT(i%-1)+wb: GOSUB Desbout: HINT i%,"Vertical bas"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"é": HINT i%,"Convertir les caractères"+chr$(10)+"spéciaux"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Pol": HINT i%,"Police de la"+chr$(10)+"sélection"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Ctx": HINT i%,"Couleur du texte"+chr$(10)+"sélectionné"
li%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Ln": HINT i%,"Liste numérotée"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Lp": HINT i%,"Liste à puces"
ta%=i%
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Tab": HINT i%,"Tableau"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+wb: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"NL": HINT i%,"Ligne de tableau"
i%=i%+1: BUTTON i%: TOP i%,0: LEFT i%,LEFT(i%-1)+36: WIDTH i%,wb: HEIGHT i%,24
CAPTION i%,"Vu": HINT i%,"Rafraîchir"+chr$(10)+"l'aperçu"
FOR k% = ti%+1 TO i%: ON_CLICK k%, Outils: NEXT k%
i%=i%+1: ALPHA i%: TOP i%,-3: LEFT i%,LEFT(i%-1)+wb+10: FONT_BOLD_OFF i%
a$="Cliquer un emplacement ou sélectionner une zone dans le source,"
CAPTION i%,a$+chr$(10)+"puis cliquer l'outil désiré."
' BARRE DE TITRES ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
i%=i%+1: ALPHA i%: TOP i%,32: LEFT i%,wc%/2-40: CAPTION i%," SOURCE ": as% = i%
COLOR i%,255,255,0
y%=TOP(i%)-1: wu%=40
i%=i%+1: x%=LEFT(as%)-40: GOSUB Desbout1: HINT i%,"Source plus étroit"
i%=i%+1: x%=LEFT(as%)+55: GOSUB Desbout1: HINT i%,"Source plus large"
i%=i%+1: ALPHA i%: TOP i%,TOP(as%): LEFT i%,wc%+wh%/2-40: CAPTION i%," APERÇU ":ar%=i%
COLOR i%,255,255,0
i%=i%+1: x%=LEFT(ar%)-40: GOSUB Desbout1: HINT i%,"Aperçu plus étroit"
i%=i%+1: x%=LEFT(ar%)+55: GOSUB Desbout1: HINT i%,"Aperçu plus large"
bt%=i%
i%=i%+1: x%=WIDTH(0)-60: y%=0: GOSUB Desbout2: HINT i%,"Fenêtre plus haute"
i%=i%+1: y%=25: GOSUB Desbout2: HINT i%,"Fenêtre moins haute"
' ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
mm%=100: MEMO mm%: TOP mm%,50: LEFT mm%,0: WIDTH mm%,wc%: HEIGHT mm%,h0%-105
COLOR mm%,255,255,195: BAR_BOTH mm%
FONT_NAME mm%,"Lucida Console": FONT_SIZE mm%,8: FONT_BOLD_OFF mm%
hv%=mm%+1: HVIEWER hv%: TOP hv%,TOP(mm%): LEFT hv%,wc%: WIDTH hv%,wh%
HEIGHT hv%,HEIGHT(mm%)
' ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
od%=105: OPEN_DIALOG od%: FILTER od%,"Fichiers HTML|*.htm"
sd%=od%+1: SAVE_DIALOG sd%: FILTER sd%,"Fichiers HTML|*.htm"
' FORM POLICE ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
fp%=150: FORM fp%: TOP fp%,TOP(0)+100: LEFT fp%,LEFT(0)+200: WIDTH fp%,200
HEIGHT fp%,300: BORDER_SMALL fp%: CAPTION fp%,"POLICES:": HIDE fp%
COLOR fp%,200,255,255
i%=fp%+1: LIST i%: PARENT i%,fp%: FULL_SPACE i%: HEIGHT i%,HEIGHT(fp%)-78
FONT_NAMES_LOAD i%
FOR k%=COUNT(i%) TO 1 STEP -1
IF LEFT$(ITEM_READ$(i%,k%),1)="@" THEN ITEM_DELETE i%,k%
NEXT k%
i%=i%+1: ALPHA i%: PARENT i%,fp%: TOP i%,HEIGHT(i%-1)+5: LEFT i%,5
CAPTION i%,"Taille (1 à 7):"
i%=i%+1: SPIN i%: PARENT i%,fp%: TOP i%,TOP(i%-1)-3: LEFT i%,70: WIDTH i%,45
MIN i%,1: MAX i%,7: POSITION i%,2
i%=i%+1: BUTTON i%: PARENT i%,fp%: TOP i%,TOP(i%-1): LEFT i%,LEFT(i%-1)+50
WIDTH i%,50: CAPTION i%,"OK": ON_CLICK i%,Pol1
' FORM AIDE ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
hh%=200: FORM hh%: TOP hh%,0: LEFT hh%,200: WIDTH hh%,640: HEIGHT hh%,SCREEN_Y-80
HIDE hh%: CAPTION hh%," - PRINCIPALES BALISES HTML -
i%=hh%+1: LIST i%: PARENT i%,hh%: FULL_SPACE i%: FONT_NAME i%,"Lucida Console"
READ a$: WHILE a$<>"Balises": READ a$: END_WHILE
READ a$: WHILE a$<>"FBalises": ITEM_ADD i%,a$: READ a$: END_WHILE

ITEM_ADD mm%,"<HTML>": ITEM_ADD mm%," <HEADER><TITLE>...</TITLE></HEADER>": ITEM_ADD mm%," <BODY>"
ITEM_ADD mm%,"": ITEM_ADD mm%," ... corps du message ...": ITEM_ADD mm%,""
ITEM_ADD mm%," </BODY>": ITEM_ADD mm%,"</HTML>"
GOSUB Actuel
END
' ==============================================================================
Ouvrir:
a$ = FILE_NAME$(od%): IF LEN(a$)<4 THEN RETURN
f$ = a$: CAPTION 0," Fichier : "+f$
FILE_LOAD mm%,f$: ' Ouvrir
FILE_LOAD hv%,f$
RETURN
' ==============================================================================
Enr:
IF f$ = "" THEN RETURN
FILE_SAVE mm%,f$: ' Enregistrer
RETURN
' ==============================================================================
Enrs:
a$ = FILE_NAME$(sd%): IF LEN(a$)<4 THEN RETURN
f$ = a$: CAPTION 0,f$
FILE_SAVE mm%,f$: ' Enregistrer sous...
RETURN
' ==============================================================================
Imprs:
' Impression du source
FILE_SAVE mm%,fm$
EXECUTE_WAIT "Notepad.exe " + fm$
RETURN
' ==============================================================================
Impri:
' Impression de l'aperçu
GOSUB Actuel: ' mise à jour de l'image résultat (aperçu)
IMAGE 500: 2D_TARGET_IS 0
2D_IMAGE_COPY 500,LEFT(hv%),TOP(hv%),LEFT(hv%)+WIDTH(hv%),TOP(hv%)+HEIGHT(hv%)
CLIPBOARD_COPY 500: DELETE 500
EXECUTE_WAIT "C:\Progra~2\Irfanv~1\i_view32.exe /clippaste"
RETURN
' ==============================================================================
QEdit:

TERMINATE
' ==============================================================================
Couper:
CLIPBOARD_CUT mm%
RETURN
' ==============================================================================
Copier:
CLIPBOARD_COPY mm%
RETURN
' ==============================================================================
Coller:
CLIPBOARD_PASTE mm%
RETURN
' ==============================================================================
Actuel:
' Actualiser l'image à droite en fonction du source à gauche
FILE_SAVE mm%,fm$
FILE_LOAD hv%,fm$
RETURN
' ==============================================================================
Balises:
SHOW hh%
RETURN
' ==============================================================================
Tuto:
' Tutoriel Html en ligne (entre autres)
EXECUTE_WAIT "http://www.ukonline.be/programmation/html/tutoriel/"
RETURN
' ==============================================================================
Redim:
' Redimensionner la fenêtre (hauteur)
pas%=50
IF CLICKED(bt%+1) = 1: ' agrandir
h0%=h0%+pas%
ELSE: ' rétrécir
h0%=h0%-pas%
END_IF
HEIGHT 0,h0%
HEIGHT mm%,h0%-110
HEIGHT hv%,HEIGHT(mm%)
HEIGHT 0,h0%
RETURN
' ==============================================================================
Redim1:
i% = NUMBER_CLICK: k%=i%-as%
pas%=40
SELECT k%
CASE 1: wc%=wc%-pas%
CASE 2: wc%=wc%+pas%
CASE 4: wh%=wh%-pas%
CASE 5: wh%=wh%+pas%
END_SELECT
WIDTH mm%,wc%: LEFT hv%,wc%: WIDTH hv%,wh%
WIDTH 0,wc%+wh%+16
LEFT as%,wc%/2-40: LEFT ar%,wc%+wh%/2-40
LEFT as%+1,LEFT(as%)-40: LEFT as%+2,LEFT(as%)+55
LEFT ar%+1,LEFT(ar%)-40: LEFT ar%+2,LEFT(ar%)+55
LEFT bt%+1,WIDTH(0)-60: LEFT bt%+2,LEFT(bt%+1)
RETURN
' ==============================================================================
Outils:
' clic sur un bouton de la barre d'outils
i% = NUMBER_CLICK
c$ = "": s$ = ""
IF i%<(ti%+5): ' boutons 'titre'
k%=i%-ti%: c$="<H"+STR$(k%)+">": s$="</H"+STR$(k%)+">"
ELSE
IF i%<(an%+4): ' ancre, image, couleurs
k%=i%-an%
SELECT k%
CASE 1: return
CASE 2: c$="<IMG SRC="+q$+"xxx"+q$+" WIDTH="+q$+"320"+q$
c$=c$+" HEIGHT="+q$+"240"+q$+">"
CASE 3: Palette216(200,100): c$="COLOR="+q$+"#"+CLIPBOARD_STRING_PASTE$+q$
END_SELECT
ELSE
IF i%<(en%+6): ' enrichissements texte
k%=i%-en%
SELECT k%
CASE 1: c$="<B>": s$="</B>"
CASE 2: c$="<I>": s$="</I>"
CASE 3: c$="<U>": s$="</U>"
CASE 4: c$ = CHR$(9): ' tabulation
CASE 5: c$="<!": s$ = ">": ' zone en commentaire
END_SELECT
ELSE
IF i%<(ce%+10): ' alignement, caractères spéciaux, police
k%=i%-ce%
SELECT k%
CASE 1: c$="<DIV ALIGN=left>": s$="</DIV>"
CASE 2: c$="<DIV ALIGN=center>": s$="</DIV>"
CASE 3: c$="<DIV ALIGN=right>": s$="</DIV>"
CASE 4: c$="VALIGN="+q$+"TOP"+q$
CASE 5: c$="VALIGN="+q$+"CENTER"+q$
CASE 6: c$="VALIGN="+q$+"BOTTOM"+q$
CASE 7: GOSUB Carspe: RETURN: ' conversion des lettres accentuées
CASE 8: SHOW fp%: RETURN: ' Police
Pol1:
i%=ITEM_INDEX(fp%+1): IF i%=0 THEN HIDE fp%: RETURN
a$ = ITEM_INDEX$(fp%+1): k% = POSITION(fp%+3): HIDE fp%
c$="<FONT FACE="+q$+a$+q$: ' Police
c$=c$+" SIZE="+q$+STR$(k%)+q$+">"
s$="</FONT>"
CASE 9: Palette216(200,100): ' couleur zone de texte
c$="<FONT COLOR="+q$+"#"+CLIPBOARD_STRING_PASTE$+q$+">"
s$="</FONT>"
END_SELECT
ELSE
IF i%<(li%+3): ' listes: demander le nombre d'éléments <----
a$=MESSAGE_INPUT$("Liste","Nombre d'éléments:","")
IF a$ = "" THEN RETURN
j% = VAL(a$): IF j%=0 THEN RETURN
k%=i%-li%
SELECT k%
CASE 1: c$="<OL>": b$ = "</OL>": ' liste numérotée
CASE 2: c$="<UL>": b$ = "</UL>": ' liste à puces
END_SELECT
c$ = c$+rc$
FOR k% = 1 TO j%: c$=c$+" <LI>"+rc$: NEXT k%
c$=c$+b$
ELSE
IF i%<(ta%+4): ' tableau, insertion rangée, voir
k%=i%-ta%
SELECT k%
CASE 1: c$="<TABLE BORDER="+q$+"0"+q$+" WIDTH="
c$=c$+q$+"550"+q$+">"+rc$+"</TABLE>"
CASE 2: c$="<TR>"+rc$+" <TD WIDTH="+q$+"100"+q$+">"
c$=c$+rc$+"<FONT FACE="+q$+"Arial, Helvetica"+q$
c$=c$+" SIZE="+q$+"2"+q$+">"+rc$+" </FONT>"+rc$
c$=c$+" </TD>"+rc$+"</TR>"
CASE 3: GOSUB Actuel: RETURN
END_SELECT
s$ = ""
END_IF
END_IF
END_IF
END_IF
END_IF
END_IF
GOSUB Insert
RETURN
' ==============================================================================
Insert:
b$ = SELECT_READ$(mm%): ' zone sélectionnée
GOSUB Poscurs
IF b$ = ""
a$ = ITEM_READ$(mm%, ligcur%): ' insertion d'un code de formatage seul
a$ = LEFT$(a$,poscur%-1)+c$+MID$(a$,poscur%,200)
ITEM_DELETE mm%,ligcur%: ITEM_INSERT mm%,ligcur%,a$
ELSE
' insertion de deux codes encadrant la sélection
v$ = b$: nble% = 1
er2:
k% = INSTR(v$, rc$)
IF k% > 0
nble% = nble% + 1
v$ = MID$(v$,k%+2,10000): GOTO er2
END_IF
IF nble% = 1
' la sélection de texte est sur une seule ligne
a$ = ITEM_READ$(mm%, ligcur%)
a$ = LEFT$(a$,poscur%-1)+c$+b$+s$+MID$(a$,poscur%,100)
ITEM_DELETE mm%,ligcur%: ITEM_INSERT mm%,ligcur%,a$
ELSE
' la sélection de texte est sur plusieurs lignes
a$ = ITEM_READ$(mm%, ligcur%)
v$ = LEFT$(a$, poscur%-1)+c$+b$+s$+MID$(a$, poscur%,100)
ITEM_DELETE mm%, ligcur%
FOR i% = 0 to nble%-1
k% = INSTR(v$, rc$): IF k% < 1 THEN EXIT_FOR
ITEM_INSERT mm%,ligcur%+i%,LEFT$(v$,k%-1)
v$ = MID$(v$,k%+2,10000)
NEXT i%
ITEM_INSERT mm%, ligcur%+i%, v$
END_IF
END_IF
CARET_POSITION mm%, curs%
RETURN
' ==============================================================================
Poscurs:
' Calcul de la position du curseur (ligne et indice) dans le Memo (emplacement cliqué)
CLIPBOARD_STRING_COPY CHR$(255): CLIPBOARD_PASTE mm%: CLIPBOARD_STRING_COPY ""
curs% = 0
FOR i% = 1 TO COUNT(mm%)
a$ = ITEM_READ$(mm%, i%)
k% = INSTR(a$, CHR$(255))
IF k% > 0
a$ = LEFT$(a$, k%-1)+MID$(a$,k%+1,200)
ITEM_DELETE mm%,i%: ITEM_INSERT mm%, i%, a$
ligcur% = i%: ' ligne du clic
poscur% = k%: ' index du clic dans la ligne
curs% = curs% + k%-1: ' index absolu (par rapport au début du memo)
EXIT_FOR
END_IF
curs% = curs% + LEN(a$) + 2
NEXT i%
RETURN
' ==============================================================================
Carspe:
' Conversion des caractères spéciaux en codes html
FOR i% = 1 TO COUNT(mm%)
a$ = ITEM_READ$(mm%,i%): c$=a$
FOR j% = 1 TO nsp%
b$ = crsp$(j%)
k%=INSTR(a$,b$)
WHILE k%>0
a$=LEFT$(a$,k%-1)+crss$(j%)+MID$(a$,k%+1,500): k%=INSTR(a$,b$)
END_WHILE
NEXT j%
IF a$<>c$ THEN ITEM_DELETE mm%,i%: ITEM_INSERT mm%,i%,a$: ' car. trouvés
NEXT i%
RETURN
' ==============================================================================
Desbout:
PICTURE i%: TOP i%,0: LEFT i%,x%: WIDTH i%,wb: HEIGHT i%,24
2D_TARGET_IS i%: 2D_RECTANGLE 0,0,wb,24
k%=i%-ce%
SELECT k%
CASE 1: 2D_LINE 5,5,20,5: 2D_LINE 5,8,15,8: 2D_LINE 5,11,20,11: 2D_LINE 5,14,15,14
2D_LINE 5,17,20,17
CASE 2: 2D_LINE 5,5,20,5: 2D_LINE 8,8,18,8: 2D_LINE 5,11,20,11: 2D_LINE 8,14,18,14
2D_LINE 5,17,20,17
CASE 3: 2D_LINE 5,5,20,5: 2D_LINE 11,8,20,8: 2D_LINE 5,11,20,11: 2D_LINE 11,14,20,14
2D_LINE 5,17,20,17
CASE 4: 2D_LINE 6,4,6,20: 2D_LINE 9,4,9,15: 2D_LINE 12,4,12,20: 2D_LINE 15,4,15,15
2D_LINE 18,4,18,20
CASE 5: 2D_LINE 6,4,6,20: 2D_LINE 9,7,9,17: 2D_LINE 12,4,12,20: 2D_LINE 15,7,15,17
2D_LINE 18,4,18,20
CASE 6: 2D_LINE 6,4,6,20: 2D_LINE 9,10,9,20: 2D_LINE 12,4,12,20: 2D_LINE 15,10,15,20
2D_LINE 18,4,18,20
END_SELECT
RETURN
' ==============================================================================
Desbout1:
PICTURE i%: TOP i%,y%: LEFT i%,x%: WIDTH i%,wu%: HEIGHT i%,17
2D_TARGET_IS i%: 2D_RECTANGLE 0,0,wu%,17: PRINT_TARGET_IS i%: FONT_NAME i%,"Wingdings"
ON_CLICK i%,Redim1
2D_FILL_COLOR 200,200,200
k%=i%-as%
SELECT k%
CASE 1: PRINT_LOCATE 2,3: PRINT CHR$(232)+" "+CHR$(231)
CASE 2: PRINT_LOCATE 2,3: PRINT CHR$(231)+" "+CHR$(232)
CASE 4: PRINT_LOCATE 2,3: PRINT CHR$(232)+" "+CHR$(231)
CASE 5: PRINT_LOCATE 2,3: PRINT CHR$(231)+" "+CHR$(232)
END_SELECT
RETURN
' ==============================================================================
Desbout2:
PICTURE i%: TOP i%,y%: LEFT i%,x%: WIDTH i%,24: HEIGHT i%,25
2D_TARGET_IS i%: 2D_RECTANGLE 0,0,24,25: PRINT_TARGET_IS i%: FONT_NAME i%,"Wingdings"
ON_CLICK i%,Redim
2D_FILL_COLOR 200,200,200
k%=i%-bt%
SELECT k%
CASE 1: PRINT_LOCATE 6,1: PRINT CHR$(233): PRINT_LOCATE 6,12: PRINT CHR$(234)
CASE 2: PRINT_LOCATE 6,2: PRINT CHR$(234): PRINT_LOCATE 6,11: PRINT CHR$(233)
END_SELECT
RETURN
' ==============================================================================
SUB Palette216(x,y)
' Choix d'une couleur dans une palette de 216 (couleurs html) affichée en x,y
' Résultat dans le clipboard sous forme d'une chaîne hexa RRGGBB
IF LABEL("Aff_pal216") = 0 THEN LABEL Aff_pal216
IF LABEL("Qui_pal216") = 0 THEN LABEL Qui_pal216
DIM_LOCAL a$, nfo%, np, nq, nt, nb, wc, hc, r, g, b, i, j, qq
qq = 0: wc = 15: hc = 12
nfo%=3000: WHILE OBJECT_EXISTS(nfo%)=1: nfo%=nfo%+1: END_WHILE
FORM nfo%: TOP nfo%,y: LEFT nfo%,x: WIDTH nfo%,12*(wc+1)+16: HEIGHT nfo%,18*hc+84
BORDER_SMALL nfo%
CAPTION nfo%," PALETTE 216 COULEURS HTML": ON_CLOSE nfo%,Qui_pal216
np=nfo%+1: WHILE OBJECT_EXISTS(np)=1: np=np+1: END_WHILE
PICTURE np: PARENT np,nfo%: FULL_SPACE np: 2D_TARGET_IS np
ON_CLICK np,Aff_pal216
nq=np+1: WHILE OBJECT_EXISTS(nq)=1: nq=nq+1: END_WHILE
PICTURE nq: PARENT nq,nfo%: TOP nq,18*hc+22: LEFT nq,5: WIDTH nq,3*wc
HEIGHT nq,25
nt=nq+1: WHILE OBJECT_EXISTS(nt)=1: nt=nt+1: END_WHILE
ALPHA nt: PARENT nt,nfo%: TOP nt,TOP(nq): LEFT nt,LEFT(nq)+WIDTH(nq)+5
FONT_NAME nt,"Lucida Console"
nb=nt+1: WHILE OBJECT_EXISTS(nb)=1: nb=nb+1: END_WHILE
BUTTON nb: PARENT nb,nfo%:TOP nb,TOP(nq): WIDTH nb,50: LEFT nb,WIDTH(nfo%)-70
CAPTION nb,"OK"
ON_CLICK nb,Qui_pal216
r = 0: g = 0: b = 0
FOR j=0 TO 17
y = j*(hc+1)
FOR i = 0 TO 11
x = i*(wc+1): 2D_PEN_COLOR r,g,b: 2D_FILL_COLOR r,g,b
2D_RECTANGLE x,y,x+wc,y+hc
b=b+51
IF b>255
b=0: g=g+51
IF g>255
g=0: r=r+51
END_IF
END_IF
NEXT i
NEXT j
r=0: g=0: b=0: COLOR nq,r,g,b
CAPTION nt,"#00 00 00"+CHR$(10)+STR$(r)+","+STR$(g)+","+STR$(b)
2D_TARGET_IS nq: 2D_PEN_COLOR 164,164,164
WHILE qq=0: WAIT 100: TO_FOREGROUND nfo%: END_WHILE: DELETE nfo%: EXIT_SUB
Aff_pal216:
x=MOUSE_X_LEFT_DOWN(np): y=MOUSE_Y_LEFT_DOWN(np)
r=COLOR_PIXEL_RED(np,x,y): g=COLOR_PIXEL_GREEN(np,x,y): b=COLOR_PIXEL_BLUE(np,x,y)
2D_FILL_COLOR r,g,b: 2D_RECTANGLE 0,0,WIDTH(nq),HEIGHT(nq)
a$ = "#"+RIGHT$("0"+HEX$(r),2)+" "+RIGHT$("0"+HEX$(g),2)+" "+RIGHT$("0"+HEX$(b),2)
a$ = a$ + CHR$(10)+STR$(r)+","+STR$(g)+","+STR$(b)
CAPTION nt,a$
RETURN
Qui_pal216:
2D_TARGET_IS 0
CLIPBOARD_STRING_COPY RIGHT$("0"+HEX$(r),2)+RIGHT$("0"+HEX$(g),2)+RIGHT$("0"+HEX$(b),2)
qq = 1
RETURN
END_SUB
' ==============================================================================
DATA "Caract"
DATA "à","â","é","è","ê","ë","î","ï","ô","û","ü","ç","É",q$,"F"
DATA "à","â","&eacute:","è","ê","ë","î","ï"
DATA "ô","û","ü","&ccdil;","É","""
DATA "Balises"
DATA "========== FICHIER HTML ============================================================="
DATA "<HTML>...</HTML> Début et fin de fichier Html"
DATA "<HEAD>...</HEAD> Zone d'en-tête d'un fichier Html"
DATA "<TITLE>...</TITLE> Titre affiché par le browser (élément de HEAD)"
DATA "<BODY>...</BODY> Début et fin du corps du fichier Html"
DATA "<BODY bgcolor="+q$+"#RRGGBB"+q$+"> Couleur d'arrière-plan (en hexadécimal)"
DATA "<BODY background="+q$+"xyz.gif"+q$+"> Image d'arrière-plan"
DATA ""
DATA "========== MISE EN FORME DES CARACTÈRES ============================================="
DATA "<B>...</B> Texte en gras"
DATA "<BIG>...</BIG> Agrandissement de la taille des caractères"
DATA "<BLINK>...</BLINK> Texte clignotant (Netscape seul)"
DATA "<EM>...</EM> Texte en italique"
DATA "<FONT color="+q$+"#RRGGBB"+q$+">...</FONT> Texte en couleur, RRGGBB valeur hexadécimale"
DATA "<FONT size=X>...</FONT> Taille des caractères où X est une valeur de 1 à 7"
DATA "<I>...</I> Texte en italique"
DATA "<NOBR>...</NOBR> Empêche les sauts de lignes auto des navigateurs"
DATA "<PRE>...</PRE> Texte préformaté: affichage espaces et sauts/ligne"
DATA "<SMALL>...</SMALL> Réduction de la taille des caractères"
DATA "<STRONG>...</STRONG> Mise en gras du texte"
DATA "<SUB>...</SUB> Texte en indice"
DATA "<SUP>...</SUP> Texte en exposant"
DATA "<U>...</U> Texte souligné"
DATA ""
DATA "========== MISE EN FORME DU TEXTE ==================================================="
DATA " Commentaire, ignoré par le navigateur"
DATA "<BR> A la ligne"
DATA "<BLOCKQUOTE>...</BLOCKQUOTE> Citation (introduit un retrait du texte)"
DATA "<CENTER>...</CENTER> Centre tout élément compris dans le tag"
DATA "<DIV align=center> ...</DIV> Centre l'élément encadré par le tag"
DATA "<DIV align=left> ...</DIV> Aligne l'élément à gauche"
DATA "<DIV align=right> ...</DIV> Aligne l'élément à droite"
DATA "<Hx>...</Hx> Titre où x a une valeur de 1 à 6"
DATA "<Hx align=center>...</Hx> Titre centré"
DATA "<Hx align=left>...</Hx> Titre aligné à gauche"
DATA "<Hx align=right>...</Hx> Titre aligné à droite"
DATA "<P>...</P> Nouveau paragraphe"
DATA "<P align=center>...</P> Paragraphe centré"
DATA "<P align=left>...</P> Paragraphe aligné à gauche"
DATA "<P align=right>...</P> Paragraphe aligné à droite"
DATA ""
DATA "========== LISTES ==================================================================="
DATA "<UL> Liste non numérotée (dite à puces)"
DATA "<LI> Élément de liste"
DATA "</UL>"
DATA "<OL> Liste numérotée"
DATA "<LI> Élément de liste"
DATA "</OL>"
DATA "<DL> Liste de glossaire"
DATA "<DT>...</DT> Terme de glossaire (sans retrait)"
DATA "<DD>...</DD> Explication du terme (avec retrait)"
DATA "</DL>"
DATA ""
DATA "========== LIGNE DE SÉPARATION ======================================================"
DATA "<HR> Trait horizontal (centré par défaut)"
DATA "<HR width="+q$+"x%"+q$+"> Largeur du trait en %"
DATA "<HR width=x> Largeur du trait en pixels"
DATA "<HR size=x> Épaisseur du trait en pixels (20 maxi)"
DATA "<HR align=center> Trait centré (défaut)"
DATA "<HR align=left> Trait aligné à gauche"
DATA "<HR align=right> Trait aligné à droite"
DATA "<HR color="+q$+"#RRGGBB"+q$+"> Couleur du trait (valeur hexa)"
DATA "<HR noshade> Trait sans effet d'ombrage"
DATA ""
DATA "========== HYPERLIENS ==============================================================="
DATA "<A href="+q$+"http://..."+q$+">...</A> Lien vers une page Web"
DATA "<A href="+q$+"mailto:..."+q$+">...</A> Lien vers une adresse email"
DATA "<A href="+q$+"fichier.htm"+q$+">...</A> Lien vers page locale fichier.htm située même dossier"
DATA "<A name="+q$+"xyz"+q$+">...</A> Définition d'une ancre"
DATA "<A href="+q$+"#xyz"+q$+">...</A> Lien vers une ancre"
DATA "<A href="+q$+"fichier#xyz"+q$+">...</A>"
DATA ""
DATA "========== IMAGES =================================================================== "
DATA "<IMG src="+q$+"xyz.gif"+q$+">"
DATA "<IMG src="+q$+"xyz.jpg"+q$+"> Insère img format Gif ou Jpg (cf liens pour adressage)"
DATA "<IMG ... width=x height=y> Mise à échelle d'image (pixels) (accélère affichage)"
DATA "<IMG ... border=x> Définition de la bordure d'une image avec lien"
DATA "<IMG ... alt="+q$+"votre texte"+q$+"> Texte alternatif lorsque l'image n'est pas affichée"
DATA "<IMG ... align=bottom> Aligne l’image en bas"
DATA "<IMG ... align=middle> Aligne l’image au milieu"
DATA "<IMG ... align=top> Aligne l’image en haut"
DATA "<IMG ... align=left> Aligne l’image à gauche"
DATA "<IMG ... align=right> Aligne l’image à droite"
DATA "<IMG ... hspace=x> Espacement horizontal entre l'image et le texte"
DATA "<IMG ... vspace=y> Espacement vertical entre l'image et le texte"
DATA ""
DATA "========== TABLEAUX ================================================================="
DATA "<TABLE>...</TABLE> Définition d'un tableau"
DATA "<TABLE width="+q$+"x%"+q$+"> Largeur du tableau en %"
DATA "<TABLE width=x> Largeur du tableau en pixels"
DATA "<TABLE border=x> Largeur de la bordure"
DATA "<TABLE cellpadding=x> Espace entre la bordure et le texte"
DATA "<TABLE cellspacing=x> Epaisseur du trait entre les cellules"
DATA "<TR>...</TR> Ligne du tableau"
DATA "<TD>...</TD> Cellule du tableau"
DATA "<TD bgcolor="+q$+"#RRGGBB"+q$+"> Couleur d'une cellule de tableau"
DATA "<TD width="+q$+"x%"+q$+"> Largeur de colonne en %"
DATA "<TD width=x> Largeur de colonne en pixels"
DATA "<TD align=center> Texte centré dans la cellule"
DATA "<TD align=left> Texte aligné à gauche dans la cellule"
DATA "<TD align=right> Texte aligné à droite dans la cellule"
DATA "<TD valign=bottom> Alignement vers le bas du contenu d'une cellule"
DATA "<TD valign=middle> Centrage vertical du contenu d'une cellule"
DATA "<TD valign=top> Alignement vers le haut du contenu d'une cellule"
DATA "<TD colspan=x> Nombre de cellules à fusionner horizontalement"
DATA "<TD rowspan=x> Nombre de cellules à fusionner verticalement"
DATA ""
DATA "========== FRAMES ==================================================================="
DATA "<FRAMESET>...</FRAMESET> Définit une struct. de frames (rempl. alors tag BODY)"
DATA "<FRAMESET rows="+q$+"x%,y%,..."+q$+"> Division horizontale de la fenêtre en %"
DATA "<FRAMESET cols="+q$+"x%,y%,..."+q$+"> Division verticale de la fenêtre en %"
DATA "<FRAME src="+q$+"fichier.htm"+q$+"> Fichier affiché dans une fenêtre de frames"
DATA "<NOFRAMES>...</NOFRAMES> Contenu pour les browsers non prévus pour les frames"
DATA "FBalises"
' ===============================================================================

quelques améliorations (je pense), par exemple pour redimensionner la fenêtre, avec des fonctions d'impression.
J'ai fait une exception pour l'impression du résultat avec appel de Irfanview, mais ce n'est pas obligatoire, d'ailleurs ça n'imprime que la fenêtre visible, il vaut sans doute mieux utiliser son navigateur préféré pour imprimer le html.
La fonction des boutons s'affiche avec le hint.

» Un petit éditeur
» Petit problème d'éditeur
» Petit éditeur de textes
» Petit et léger visualisateur et éditeur de textes
» Editeur EliP 6 : Le Tiny éditeur avec 25 onglets de travail