updating pages

docs/assets/app.js

@@ -5,9 +5,25 @@ function logics(){
     const yearHolder = document.getElementById("year-holder")
     const templateRow = tableBodyElement.querySelector("tr")
     const modes = ["JulianInGregorian","GaussJulianInGregorian","GaussGregorian","AnonymousGregorian","AnonymousGregorianOptimized","Julian","GaussJulian"]
+    let currentYear = new Date().getFullYear()
     templateRow.remove()
     let lang = "bg"
 
+    function setYear(){
+        const prev = document.createElement("span")
+        prev.textContent = "⮜"
+        prev.className = "year-decrease"
+        const next = document.createElement("span")
+        next.textContent = "⮞"
+        next.className = "year-increase"
+        const year = document.createElement("span")
+        year.textContent = currentYear
+        yearHolder.innerHTML = ""
+        yearHolder.append(prev,year,next)
+        prev.addEventListener("click",e=>{ currentYear--; year.textContent = currentYear; load(currentYear);})
+        next.addEventListener("click",e=>{ currentYear++; year.textContent = currentYear; load(currentYear);})
+    }
+
     const translations = {
         bg:{
             year: "година",
@@ -41,7 +57,13 @@ function logics(){
         addRow(year,translations[lang].months[month],day,translations[lang][mode],translations[lang].bools[leap])
     }
 
-    modes.forEach(mode=>addData(Number(yearHolder.textContent),mode))
+    function load(year){
+        tableBodyElement.innerHTML = ""
+        modes.forEach(mode=>addData(Number(year),mode))
+    }
+
+    setYear()
+    load(currentYear)
 }
 
 logics()

docs/styles/styles.css

@@ -152,4 +152,8 @@ body main table tbody tr:nth-child(odd){
 body main table td,body main table th{
     text-transform: lowercase;
     text-align: center;
+}
+
+.year-decrease, .year-increase{
+    cursor: pointer;
 }