From: Robert Kaiser Date: Sat, 24 Nov 2012 14:20:26 +0000 (+0100) Subject: make module switching work X-Git-Tag: production~46 X-Git-Url: https://git-public.kairo.at/?a=commitdiff_plain;h=eabed1a435fb1ea52f189b7b0433bdb640a29137;p=tricorder.git make module switching work --- diff --git a/index.html b/index.html index 1b1eea6..9d407e0 100644 --- a/index.html +++ b/index.html @@ -32,14 +32,15 @@
-STAR TREK and related items are trademarks of Paramount Pictures. +STAR TREK and related items are +trademarks of Paramount Pictures.
@@ -52,7 +53,18 @@ Web Tricorder
+

This is the main area for tricorder output.

+
+
+

This is the main area for position tricorder output.

+
+
+

This is the main area for gravity tricorder output.

+
+
+

This is the main area for acoustics tricorder output.

+
diff --git a/js/tricorder.js b/js/tricorder.js index b04ac12..c1b61e7 100644 --- a/js/tricorder.js +++ b/js/tricorder.js @@ -21,4 +21,18 @@ function updateStardate() { gStardate.textContent = sdateval.toFixed(1); setTimeout(updateStardate, 5*60*1000); -} \ No newline at end of file +} + +function switchModule(modname) { + var sections = document.getElementsByTagName('section'); + for (var i = 0; i <= sections.length - 1; i++) { + sections[i].classList.remove("active"); + } + var navs = document.getElementById('navlist').children; + for (var i = 0; i <= navs.length - 1; i++) { + navs[i].classList.remove("active"); + } + + document.getElementById("nav" + modname).classList.add("active"); + document.getElementById("sect" + modname).classList.add("active"); +} diff --git a/style/tricorder.css b/style/tricorder.css index 891e0e3..b7b8fa5 100644 --- a/style/tricorder.css +++ b/style/tricorder.css @@ -119,13 +119,19 @@ a:hover, a:active { color: #FFCF00; } #navlist > li:hover, #navlist > li:active, #navlist > li:hover > a, -#navlist li:active > a, +#navlist > li:active > a, #navlist > li > a:hover, #navlist > li > a:active { background-color: #FFCF00; color: #000000; } +#navlist > li.active, +#navlist > li.active > a { + background-color: #008484; + color: #FFCF00; +} + #navPos, #navPos > a { background-color: #FF9F00; color: #000000; @@ -198,3 +204,11 @@ a:hover, a:active { color: #FFCF00; } overflow: auto; border: none; } + +section { + display: none; +} + +section.active { + display: block; +}