mercredi 6 septembre 2017

Tohtml

Vim dispose d'une commande TOhtml pour convertir le fichier courant en html. Cette fonction produit une page html complète avec son head et son body. Les styles qui y sont définis altèrent le style de la page dans laquelle on l'inclut. Ici on va hacker TOhtml pour produire un bout de code html isolé.

TOhtml

La commande TOhtml crée un nouveau buffer dans une nouvelle fenêtre et y insère le code d'un page html autonome :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>~/codex/dct/dct.c.html</title>
<meta name="Generator" content="Vim/8.1">
<meta name="plugin-version" content="vim8.1_v1">
<meta name="syntax" content="c">
<meta name="settings" content="number_lines,use_css,pre_wrap,no_foldcolumn,expand_tabs,line_ids,prevent_copy=">
<meta name="colorscheme" content="mu">
<style type="text/css">
<!--
pre { white-space: pre-wrap; font-family: monospace; color: #ffffff; background-color: #000000; }
body { font-family: monospace; color: #ffffff; background-color: #000000; }
* { font-size: 1em; }
.PreProc { color: #5fd7ff; }
.Type { color: #87ffaf; }
.String { color: #87ffaf; }
.LineNr { color: #a8a8a8; background-color: #1c1c1c; padding-bottom: 1px; }
.Comment { color: #a8a8a8; }
.Constant { color: #ff5f5f; }
.Special { color: #00ffff; }
.Repeat { color: #ffff00; }
.Statement { color: #ffff00; }
-->
</style>

Le but recherché est de ne laisser que le strict nécessaire pour afficher le code avec la coloration syntaxique.

On voudrait quelque chose comme ceci :

<pre id='vimCodeElement'>
<span id="L1" class="LineNr"> 1 </span><span class="Comment">/*</span><span class="Comment"> </span>
<span id="L2" class="LineNr"> 2 </span><span class="Comment">dct.c</span>
<span id="L3" class="LineNr"> 3 </span><span class="Comment">Released under the GPL (C) 2019 marnout à free pt fr</span>
<span id="L4" class="LineNr"> 4 </span><span class="Comment">*/</span>
<span id="L5" class="LineNr"> 5 </span><span class="PreProc">#include </span><span class="String"><stdio.h></span>
<span id="L6" class="LineNr"> 6 </span><span class="PreProc">#include </span><span class="String"><string.h></span>
<span id="L7" class="LineNr"> 7 </span><span class="PreProc">#include </span><span class="String"><mpfr.h></span>
...
...
</pre>

Le script vim / python

L'affichage qui suit est produit par le script lui même tohtml.vim

 1 " (c) 2017 Released under the GPL by marnout à free pt fr
 2 
 3 :TOhtml
 4 
 5 " delete lines that does not begin by <span
 6 :v/^<span/d
 7 
 8 python << endpy
 9 
10 import vim
11 
12 cb = vim.current.buffer
13 cb[0:0] = ['<pre class="monokai">']
14 cb.append('</pre>')
15 for i in range(len(cb)):
16    cb[i] = cb[i].replace('\\n', '&Backslash;n')
17    cb[i] = cb[i].replace('\%', '\\%')
18 endpy

Commentaire

Ligne 3
Exécute la commande TOhtml de vim. On se retrouve donc avec une nouvelle fenetre qui affiche le contenu du buffer créé par la commande.
Ligne 6
Supprime toutes les lignes qui ne commencent pas par <span. Voir la commande :v avec :help :v. Après cette execution, un grand nettoyage est fait. Il ne reste que les lignes <span ..> .. </span>.
Lignes 8 à 18
Script python qui sera excécuté dans vim au format Herdoc. La première ligne importe le module vim.
Ligne 12
Définit la variable python cb qui est une liste des lignes du buffer courant.
Ligne 13
Ajoute au début de buffer la balise pre.
Ligne 4
Ferme la balise en fin de buffer.
Lignes 15 à 17
Je ne sais pas pourquoi, les caractères \n et % sont mal intréprétés par html. Je n'ai pas encore compris le mystère, d'autant que le code produit par la command TOhtml de vim ne souffre pas de cet handicap. En attendant j'ai remplacé ces caractères par lesur code html.

Fichier css

Il faut inclure dans le head de la page un fichier css. Le mien est le suivant

.monokai { 
   white-space: pre-wrap; 
   font-family: monospace; 
   color: #ffffff; 
   background-color: #222; 
}
.String { color: yellow; }
.Number { color: blue; }
.Define { color: #aaaa00; }
.Conditional { color: #ff005f; }
.Comment { color: #999; }
.Operator { color: #ff005f; }
.Function { color: #afd700; }
.Statement { color: #ff005f; }
.PreProc { color: #ff00ff; }
.Special { color: #ffffff; }
.Type { color: #00ff00; }
.Constant { color: pink; }
.Repeat {color: red;}

Utilisation

J'ai placé le fichier tohtml.vim dans mon dossier $HOME/.vim

J'ai ajouté à mon .vimrc :

:command Tohtml :source ~/.vim/tohtml.vim

La majuscule T à Tohtml est une contrainte de vim.

Pour exporter un buffer de vim en html, il suffit maintenant de taper la commande :Tohtml et enregistrer le buffer produit. Par défaut si le nom du fichier est machin.c le fichier html en sortie sera machin.c.html

Il ne reste plus qu'à l'inclure ou le recopier dans une page html.

Remarque

Avec mon programme Qlam avec lequel je rédige ce site, je fais :

#inchtml toto.c

Réalisé avec Qlam - LGPL