git ssb

1
const monthNames = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
2
const dayNames = [ "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday",  "Sunday" ]
3
4
function Year(letnice)
5
{
6
  let base = document.getElementById("center");
7
  base.innerHTML = "";
8
  let year;
9
10
  isNaN(letnice) || letnice==null ? year = new Date().getFullYear() : year = String(letnice).replace("#", "").substr(0,4);
11
  window.location.hash = year;
12
13
  let month = 0;
14
  let today = new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()-1, 0);
15
  let style = "";
16
  let footer = "";
17
18
  base.innerHTML += doHeader();
19
  
20
  while(month < 12)
21
  {
22
    base.innerHTML += `<div class="month">
23
      <p class="m">${monthNames[new Date(year, month).getMonth()].substr(0,2)}</p>
24
      <svg class="graph" id="${monthNames[month]}">
25
      ${doLabels()}
26
      ${doMonth(month)}
27
      </svg></div>`
28
    month++
29
  }
30
31
  base.innerHTML += doFooter();
32
  footer = document.getElementById("footer");
33
34
  function doHeader()
35
  {
36
    return `<div class="header"><p class="y">${year}<a onclick="getYear(-1);">-</a><a onclick="getYear(1);">+</a></p><p class="p">${yearProgress(year)}</p></div>`;
37
  }
38
39
  function doFooter(content)
40
  {
41
    return `<div class="footer" id="footer">${footer}</div>`;
42
  }
43
44
  function yearProgress(year)
45
  {
46
    diff = new Date() - new Date(year, 0, 1, 0);
47
    progress = ((diff/31536000000)*100).toFixed(2);
48
    yd = Math.abs((progress / 100).toFixed(2));
49
50
    return progress < 0 ? yd + ` YEARS AWAY` : progress > 100 ? yd + ` YEARS AGO` : progress+"%";
51
  }
52
53
  function doLabels()
54
  {
55
    let html = "";
56
    let y = 0;
57
    
58
    for(i = 0; i < 7; i++)
59
    {
60
      y = (i * 14);
61
      html += `<text class="dayLabel" x="5" y='${y}' dy="10">${dayNames[i].substr(0,1)}</text>`
62
    }
63
    return html;
64
  }
65
66
  function doMonth(month)
67
  {
68
    html = "";
69
    monthLength = new Date(year, month+1, 0).getDate();
70
    let date = 0;
71
    let x = 0;
72
    let y = 0;
73
    
74
    while(date < monthLength)
75
    {
76
      x += 14;
77
      let week = 0;
78
      
79
      while(week < 7 && date != monthLength)
80
      {
81
        y = week * 14;
82
        let day = new Date(year, month, date, 0);
83
84
        if(day.getDay() != week)
85
        {
86
          style = "null";
87
          date--
88
        }
89
        else if(String(day) == String(today))
90
        {
91
          style = "today";
92
        }
93
        else if(day < today)
94
        {
95
          style = "gone";
96
        }
97
        else if(day.getDay() == 5 || day.getDay() == 6)
98
        {
99
          style = "weekend";
100
        }
101
        else
102
        {
103
          style = "day";
104
        }
105
        html += `<rect class='${style}' x='${x}' y='${y}' title='${(date+1) == 0 ? "null" : dayNames[week] + " " + (date+1)}' width="12px" height="12px" rx="2" ry="2" onclick="UpdateFooter('${year}', '${month}', '${(date+1)}', '${week}')"></rect>`
106
        week++
107
        date++
108
      }
109
    }
110
    return html;
111
  }
112
}
113
114
function UpdateFooter(year, month, date, week)
115
{
116
  let diff = ((new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate(), 0) - new Date(year, month, date))/86400000);
117
  let num = Math.abs(diff).toFixed();
118
  let calc;
119
120
  diff < 0 ? calc = `In ${num} Day${num>1?'s':''}.` : diff == 0 ? calc = `Today.`: calc = `${num} Day${num>1?'s':''} ago.`
121
  footer.innerHTML = `${monthNames[month]} ${date}, ${dayNames[week]}. ${calc}`;
122
}
123
124
function getYear(i)
125
{
126
  location.hash = parseInt(location.hash.replace('#','')) + parseInt(i);
127
}
128
129
window.onhashchange = function()
130
{
131
  Year(parseInt(location.hash.replace('#','')));
132
}