js/script.js

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