From b5786baef75a5de05b5d1e626ea654734fd4a9f2 Mon Sep 17 00:00:00 2001
From: Etienne Millon <me@emillon.org>
Date: Fri, 7 Jun 2013 16:15:50 +0200
Subject: [PATCH] Add a letter index

---
 www.bitoduc.fr/creuille.js          | 13 ++++++++++++-
 www.bitoduc.fr/feuille_de_style.css | 19 +++++++++++++++++++
 www.bitoduc.fr/index.htm            |  3 +++
 3 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/www.bitoduc.fr/creuille.js b/www.bitoduc.fr/creuille.js
index 4b4d476..be2e01f 100644
--- a/www.bitoduc.fr/creuille.js
+++ b/www.bitoduc.fr/creuille.js
@@ -118,6 +118,7 @@ function construitListe(window)
 
     var i;
     var lien = trouveElement('lienChange');
+    var index = trouveElement('index');
     var mots = trouveElement('mots');
     var langueDesClefs = obtenirLAttribut(mots, 'data-langue');
     var lettres = new Array(26);
@@ -139,6 +140,7 @@ function construitListe(window)
     lien.innerHTML = lienSource + ' &rarr; ' + lienDestination;
 
     mots.innerHTML = '';
+    index.innerHTML = '';
 
 
     for (i = 0; i < 26; ++i) {
@@ -148,6 +150,9 @@ function construitListe(window)
         lettres[i] = noeud = document.creeElement('div');
         noeud.className = 'groupe-lettre';
         noeud.enfants = 0;
+        var ancre = document.creeElement('a');
+        ancre.name = lettre;
+        noeud.appendChild(ancre);
         var titre = document.creeElement('h3');
         titre.innerHTML = lettre;
         noeud.appendChild(titre);            
@@ -188,8 +193,14 @@ function construitListe(window)
     }
 
     for (i = 0; i < 26; ++i) {
+        var lettre = String.fromCharCode(65 + i);
         noeud = lettres[i];
-        if (noeud.enfants > 1)
+        if (noeud.enfants > 1) {
             mots.appendChild(noeud);
+            var lettreIndex = document.creeElement('a');
+            lettreIndex.href = '#' + lettre;
+            lettreIndex.innerHTML = lettre;
+            index.appendChild(lettreIndex);
+        }
     }
 }
diff --git a/www.bitoduc.fr/feuille_de_style.css b/www.bitoduc.fr/feuille_de_style.css
index 022e021..1f7d135 100644
--- a/www.bitoduc.fr/feuille_de_style.css
+++ b/www.bitoduc.fr/feuille_de_style.css
@@ -66,3 +66,22 @@ h3
     color: #905050;
     margin: 50px;
 }
+
+#index
+{
+    text-align: center;
+}
+
+#index a
+{
+    font-size: larger;
+    color: black;
+    text-decoration: none;
+    margin-right: 5px;
+    position:relative;
+}
+
+#index a:hover
+{
+    background-color: #999;
+}
diff --git a/www.bitoduc.fr/index.htm b/www.bitoduc.fr/index.htm
index d1b2d5e..e6b7397 100644
--- a/www.bitoduc.fr/index.htm
+++ b/www.bitoduc.fr/index.htm
@@ -23,6 +23,9 @@
                 </div>
             </div>
 
+            <div id="index">
+            </div>
+
             <div id="mots" data-langue="anglais">
             </div>