git ssb

1
function Year()
2
{
3
  let base = document.getElementById("center");
4
5
  const monthNames = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
6
  const dayNames = [ "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday" ]
7
8
  let year = new Date().getFullYear();
9
  let month = 0;
10
  let style = "day";
11
  
12
  function doHeader()
13
  {
14
    return `<div class="header"><p class="y">${year}</p><p class="p">${yearProgress(2018) + "%"}</p></div>`;
15
  }
16
17
  while(month < 12)
18
  {
19
    base.innerHTML += `<div class="month">
20
      ${month==0?doHeader():""}
21
      <p class="m">${monthNames[new Date(year, month).getMonth()].substr(0,2)}</p>
22
      <svg class="graph" id="${monthNames[month]}">
23
      ${doLabels()}
24
      ${doMonth(month)}
25
      </svg></div>`
26
    month++
27
  }
28
29
  function doLabels()
30
  {
31
    let html = "";
32
    let y = 0;
33
    
34
    for(i = 0; i < 7; i++)
35
    {
36
      y = (i * 14)+1;
37
      html += `<text class="dayLabel" x="5" y='${y}' dy="10">${dayNames[i].substr(0,1)}</text>`
38
    }
39
    return html;
40
  }
41
42
  function doMonth(month)
43
  {
44
    html = "";
45
    monthLength = new Date(year, month+1, 0).getDate();
46
    let date = 0;
47
    let x = 0;
48
    let y = 0;
49
    let today = new Date(year, new Date().getMonth(), new Date().getDate(), 0);
50
51
    while(date < monthLength)
52
    {
53
      x += 14;
54
      let week = 0
55
      
56
      while(week < 7 && date != monthLength)
57
      {
58
        y = week * 14 + 2;
59
        let day = new Date(year, month, date);
60
61
        if(day.getDay() != week)
62
        {
63
          style = "null";
64
          date--
65
        }
66
        else if(day < today)
67
        {
68
          style = "gone";
69
        }
70
        else if(day.getDay() == 5 || day.getDay() == 6)
71
        {
72
          style = "weekend";
73
        }
74
        else
75
        {
76
          style = "day";
77
        }
78
79
        html += `<rect class='${style}' x='${x}' y='${y}' title='${dayNames[week] + "_" + (date+1)}' width="12px" height="12px" rx="2" ry="2" onclick=""></rect>`
80
        week++
81
        date++
82
      }
83
    }
84
    return html;
85
  }
86
87
  function yearProgress(year)
88
  {
89
    progress = new Date() - new Date(year, 0, 1, 0);
90
    return (progress/31536000000).toFixed(2);
91
  }
92
}