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