downloads: better loadTabByHash

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

1 files changed, 35 insertions, 17 deletions

diff --git a/downloads/index.html b/downloads/index.html
index fb5fe69..0661c4d 100644
--- a/downloads/index.html
+++ b/downloads/index.html
@@ -4,26 +4,44 @@ nav1-show: true
 nav1-weight: 9
 
 title: 'Downloads'
-inlinejs: |
-  $(
-	loadTabByHash();
-  );
+inlinejs: "$(loadTabByHash(););"
 ---
 <script>
-	// Select the right tab based on the hash.
-	// TODO: we also want to be able to change the hash based on some clicks
-    // TODO: better validation, use explicit arch list.
-	function loadTabByHash() {
-      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');
-	}
+  // Select the right tab based on the hash.
+  // TODO: we also want to be able to change the hash based on some clicks
+  function loadTabByHash() {
+    var h = window.location.hash;
+    // If arch is unselected, or invalid, use amd64.
+	var VALID_ARCHES = ['amd64','alpha','arm','arm64','hppa','ia64','loong','mips','m68k','ppc','riscv','s390','sparc','x86'];
+	var DEFAULT_ARCH = 'amd64';
+	// If it was an advanced anchor/hash in the URL, drop it for validation.
+	h = s.replace(/-advanced$/,'');
+	// Validate arch now (without the leading '#' or trailing -advanced.
+    if(!VALID_ARCHES.include(h.substring(1))) {
+      h = '#' + DEFAULT_ARCH;
+    };
+    // If an advanced variant exists, we want to show it.
+	// The browser will do the correct thing for "#amd64" vs "#amd64-advanced",
+	// when both of them exist.
+    var h1 = '#other-arches a[href="' + h + '-advanced"]';
+    var h2 = '#other-arches a[href="' + h + '"]';
+    var h3 = '#other-arches a:first';
+	// Find the first one and show it.
+    for(selector in [h1,h2,h3]) {
+      var _h = $(_h);
+      if(_h.length > 0) {
+        _h.tab('show');
+        break;
+      }
+    }
+  }
+  window.addEventListener(
+    "hashchange",
+    () => { loadTabByHash(); },
+    false
+  );
 </script>
-<div class="row" onhashchange="loadTabByHash()">
+<div class="row">
   <div class="col-xs-12 col-md-6">
     <div class="panel panel-default featured-panel">
       <div class="panel-body">