| 1 | window.addEventListener('load', function() { |
| 2 | var links = document.getElementById("links").children[0].children; |
| 3 | var home = document.getElementsByClassName("home"); |
| 4 | var menu = document.getElementById("menu"); |
| 5 | var content = document.getElementById("content"); |
| 6 | var body = document.getElementsByTagName("body")[0]; |
| 7 | var menuLoc = parseInt(getComputedStyle(menu).getPropertyValue("top")); |
| 8 | |
| 9 | function menuOperator(node, position, token="") { |
| 10 | menu.setAttribute("class", position); |
| 11 | for(var i = 0; i < links.length; i++) { |
| 12 | links[i].children[0].removeAttribute("class"); |
| 13 | } |
| 14 | node.setAttribute("class", "selected " + token); |
| 15 | for(var i = 0; i < content.children.length; i++) { |
| 16 | content.children[i].setAttribute("class", "hidden") |
| 17 | } |
| 18 | var name = node.getAttribute("data-name"); |
| 19 | if(name) { |
| 20 | var article = document.getElementById(name); |
| 21 | article.setAttribute("class", "selected"); |
| 22 | } |
| 23 | var color = node.getAttribute("data-color"); |
| 24 | if(color) { |
| 25 | body.setAttribute("class", color); |
| 26 | } |
| 27 | window.history.pushState("object or string", "Title", node.href); |
| 28 | } |
| 29 | |
| 30 | for(var i = 0; i < links.length - 1; i++) { |
| 31 | links[i].children[0].onclick = function(event) { |
| 32 | event.preventDefault(); |
| 33 | var node = event.currentTarget; |
| 34 | menuOperator(node, "top"); |
| 35 | }; |
| 36 | } |
| 37 | for(var i = 0; i < home.length; i++) { |
| 38 | home[i].onclick = function(event) { |
| 39 | event.preventDefault(); |
| 40 | var node = event.currentTarget; |
| 41 | menuOperator(node, "middle", "home"); |
| 42 | } |
| 43 | } |
| 44 | }, false); |