Notez que ce site n'utilise pas Joust mais les scripts de Sylvain Machefert.
Qu'est-ce-que c'est ?
Joust est un ensemble de fichiers HTML contenant des commandes
Javascript qui permettent la création de menus dynamiques tels
que celui de ce site.
Comment ça marche ?
Tout d'abord, téléchargez l'archive joust.zip sur le site de Joust. Décompactez
là dans un dossier quelconque (au besoin,
récupérez Zip Central).
Ouvrez le fichier index.htm avec un éditeur de texte quelconque
(p.e. sous Windows, Maj+clic-droit -> "Ouvrir avec" le bloc-notes).
Pour exemple, voici un aperçu de ces lignes dans mon fichier
index.htm :
// Now set up the menu with a whole lot of addEntry and addChild
function calls
var level1ID = -1;
var level2ID = -1;
var level3ID = -1;
var level4ID = -1;
var texdir = "info/tex/";
var pfmdir = "profmath/";
var pfmres = "profmath/ressources/";
var pfmdoc = "profmath/doc/";
var pfmtch = "profmath/telechargements/";
var lindir = "info/linux/";
var tstdir = "info/tests/";
level1ID = theMenu.addEntry(-1, "Document", "Accueil", "home.htm",
"Accueil du site");
level1ID = theMenu.addEntry(level1ID, "Folder", "Projets Profmath",
pfmdir+"profmath.html", "Liste des projets");
level2ID = theMenu.addChild(level1ID, "Document", "Assistant de
saisie", pfmdoc+"assistant.html", "Pour faciliter la saisie de textes
et de graphiques.");
level2ID = theMenu.addEntry (level2ID, "Document", "Macros LaTeX",
pfmdoc+"pfm_macr.html", "Mes fichiers de macros.");
level2ID = theMenu.addEntry (level2ID, "Document", "Ressources HTML",
pfmres+"ressources.html", "Des cours, exercices, figures, etc.");
level1ID = theMenu.addEntry(level1ID, "Folder", "LaTeX",
texdir+"tex.html", "Présentation");
level2ID = theMenu.addChild(level1ID, "Folder", "Doc",
texdir+"doc.html", "Index des informations sur LaTeX.");
level3ID = theMenu.addChild(level2ID, "Folder", "Graphiques",
texdir+"graphiques.html", "Comment faire des graphiques sous LaTeX.");
...
Voici une description des premières lignes :
- tout d'abord on définit autant de niveaux d'arborescence que
nécessaire : var level1ID = -1;
...
- éventuellement, on peut définir des variables contenant
les noms des dossiers contenant vos pages html : var texdir = "info/tex/";
...
- ensuite on définit les entrées du menu :
theMenu.addEntry crée une entrée dans un niveau
donné de l'arborescence et theMenu.addChild ajoute un niveau
à l'arborescence :
level1ID = theMenu.addEntry(-1, "Document", "Accueil",
"home.htm", "Accueil du site");
level1ID = theMenu.addEntry(level1ID, "Folder", "Projets Profmath",
pfmdir+"profmath.html", "Liste des projets");
level2ID = theMenu.addChild(level1ID, "Document", "Assistant de
saisie", pfmdoc+"assistant.html", "Pour faciliter la saisie de textes
et de graphiques.");
level2ID = theMenu.addEntry (level2ID, "Document", "Macros LaTeX",
pfmdoc+"pfm_macr.html", "Mes fichiers de macros.");
level2ID = theMenu.addEntry (level2ID, "Document", "Ressources HTML",
pfmres+"ressources.html", "Des cours, exercices, figures, etc.");
level1ID = theMenu.addEntry(level1ID, "Folder", "LaTeX",
texdir+"tex.html", "Présentation");
level2ID = theMenu.addChild(level1ID, "Folder", "Doc",
texdir+"doc.html", "Index des informations sur LaTeX.");
level3ID = theMenu.addChild(level2ID, "Folder", "Graphiques",
texdir+"graphiques.html", "Comment faire des graphiques sous LaTeX.");
...
puis il ne reste plus qu'à enregistrer le fichier index.htm.
Remarque : pour ceux qui utilisent Visual Basic (de Microsoft...), il
existe un logiciel appelé VB2Joust qui permet de transformer le
contenu d'un composant TreeView en du code javascript Joust.