downloads: jQuery take 2

Signed-off-by: Robin H. Johnson <robbat2@gentoo.org>

1 files changed, 41 insertions, 30 deletions

diff --git a/downloads/index.html b/downloads/index.html
index 1efdfe5..1692891 100644
--- a/downloads/index.html
+++ b/downloads/index.html
@@ -5,7 +5,18 @@ nav1-weight: 9
 
 title: 'Downloads'
 # Select the correct tab based on the anchor hash in the URL.
-inlinejs: "$(function() { var h = window.location.hash; if(h == '' || $(h).length == 0) { h = '#other-arches a:first'; }; $(h).tab('show'); });"
+# TODO: better validation, use explicit arch list.
+inlinejs: "$(
+	function() {
+		var h = window.location.hash;
+		var hb = '#other-arches a';
+		var h2 = hb + '[href="' + h + '"]';
+		if(h == '' || $(h2).length == 0) {
+			h2 = hb + ':first';
+		};
+		$(h2).tab('show');
+	}
+);"
 ---
 
 <div class="row">
@@ -40,7 +51,7 @@ inlinejs: "$(function() { var h = window.location.hash; if(h == '' || $(h).lengt
     for the complete installation documentation.
     It explains how you can find the right architecture for your machine and which files you need at what stage of the installation process.<br>
     In brief, a <strong>stage 3</strong> is a minimal set of Gentoo binaries that can upgrade and expand itself (but not much more, i.e., no kernel
-    or boot loader). The desktop version already contains additional programs needed in a typical desktop installation. The installation CD can be 
+    or boot loader). The desktop version already contains additional programs needed in a typical desktop installation. The installation CD can be
     used to boot and, well, install Gentoo.
   </p>
 </div>
@@ -52,102 +63,102 @@ inlinejs: "$(function() { var h = window.location.hash; if(h == '' || $(h).lengt
 
 
     <ul class="nav nav-tabs nav-justified" id="other-arches">
-      <li><a id="amd64"	href="#tab-amd64-advanced" data-toggle="tab"><strong>amd64</strong></a></li>
-      <li><a id="alpha"	href="#tab-alpha" data-toggle="tab"><strong>alpha</strong></a></li>
-      <li><a id="arm"	href="#tab-arm" data-toggle="tab"><strong>arm</strong></a></li>
-      <li><a id="arm64"	href="#tab-arm64-advanced" data-toggle="tab"><strong>arm64</strong></a></li>
-      <li><a id="hppa"	href="#tab-hppa" data-toggle="tab"><strong>hppa</strong></a></li>
-      <li><a id="ia64"	href="#tab-ia64" data-toggle="tab"><strong>ia64</strong></a></li>
-      <li><a id="loong"	href="#tab-loong" data-toggle="tab"><strong>loong</strong></a></li>
-      <li><a id="mips"	href="#tab-mips" data-toggle="tab"><strong>mips</strong></a></li>
-      <li><a id="m68k"	href="#tab-m68k" data-toggle="tab"><strong>m68k</strong></a></li>
-      <li><a id="ppc"	href="#tab-ppc" data-toggle="tab"><strong>ppc</strong></a></li>
-      <li><a id="riscv"	href="#tab-riscv" data-toggle="tab"><strong>riscv</strong></a></li>
-      <li><a id="s390"	href="#tab-s390" data-toggle="tab"><strong>s390</strong></a></li>
-      <li><a id="sparc"	href="#tab-sparc" data-toggle="tab"><strong>sparc</strong></a></li>
-      <li><a id="x86"	href="#tab-x86" data-toggle="tab"><strong>x86</strong></a></li>
+      <li><a href="#amd64-advanced" data-toggle="tab"><strong>amd64</strong></a></li>
+      <li><a href="#alpha" data-toggle="tab"><strong>alpha</strong></a></li>
+      <li><a href="#arm" data-toggle="tab"><strong>arm</strong></a></li>
+      <li><a href="#arm64-advanced" data-toggle="tab"><strong>arm64</strong></a></li>
+      <li><a href="#hppa" data-toggle="tab"><strong>hppa</strong></a></li>
+      <li><a href="#ia64" data-toggle="tab"><strong>ia64</strong></a></li>
+      <li><a href="#loong" data-toggle="tab"><strong>loong</strong></a></li>
+      <li><a href="#mips" data-toggle="tab"><strong>mips</strong></a></li>
+      <li><a href="#m68k" data-toggle="tab"><strong>m68k</strong></a></li>
+      <li><a href="#ppc" data-toggle="tab"><strong>ppc</strong></a></li>
+      <li><a href="#riscv" data-toggle="tab"><strong>riscv</strong></a></li>
+      <li><a href="#s390" data-toggle="tab"><strong>s390</strong></a></li>
+      <li><a href="#sparc" data-toggle="tab"><strong>sparc</strong></a></li>
+      <li><a href="#x86" data-toggle="tab"><strong>x86</strong></a></li>
     </ul>
 
     <div class="tab-content other-arches">
-      <div class="tab-pane active" id="tab-amd64-advanced">
+      <div class="tab-pane active" id="amd64-advanced">
         <h3>amd64 &ndash; Advanced choices</h3>
         <div class="row">
           {% include downloads/amd64-advanced.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-alpha">
+      <div class="tab-pane active" id="alpha">
         <h3>alpha</h3>
         <div class="row">
           {% include downloads/alpha.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-arm">
+      <div class="tab-pane active" id="arm">
         <h3>arm</h3>
         <div class="row">
           {% include downloads/arm.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-arm64-advanced">
+      <div class="tab-pane active" id="arm64-advanced">
         <h3>arm64</h3>
         <div class="row">
           {% include downloads/arm64-advanced.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-hppa">
+      <div class="tab-pane active" id="hppa">
         <h3>hppa</h3>
         <div class="row">
           {% include downloads/hppa.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-loong">
+      <div class="tab-pane active" id="loong">
         <h3>loong</h3>
         <div class="row">
           {% include downloads/loong.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-ia64">
+      <div class="tab-pane active" id="ia64">
         <h3>ia64</h3>
         <div class="row">
           {% include downloads/ia64.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-mips">
+      <div class="tab-pane active" id="mips">
         <h3>mips</h3>
         <div class="row">
           {% include downloads/mips.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-m68k">
+      <div class="tab-pane active" id="m68k">
         <h3>m68k</h3>
         <div class="row">
           {% include downloads/m68k.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-ppc">
+      <div class="tab-pane active" id="ppc">
         <h3>ppc</h3>
         <div class="row">
           {% include downloads/ppc.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-riscv">
+      <div class="tab-pane active" id="riscv">
         <h3>riscv</h3>
         <div class="row">
           {% include downloads/riscv.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-s390">
+      <div class="tab-pane active" id="s390">
         <h3>s390</h3>
         <div class="row">
           {% include downloads/s390.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-sparc">
+      <div class="tab-pane active" id="sparc">
         <h3>sparc</h3>
         <div class="row">
           {% include downloads/sparc.html %}
         </div>
       </div>
-      <div class="tab-pane active" id="tab-x86">
+      <div class="tab-pane active" id="x86">
         <h3>x86</h3>
         <div class="row">
           {% include downloads/x86.html %}