ekxk.github.io/discipline.html at main · ekxk/ekxk.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!DOCTYPE html>
<html lang="en">
<head>
  <link rel="stylesheet" href="style.css" type="text/css">
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Daily Tracker v1</title>

</head>
<body>

  <h1>Daily Tracker v1</h1>
  <div class="date">매일 운동</div>

  <div id="tracker"></div>

  <button onclick="exportCSV()">Export CSV</button>

<script>
  /**********************
   * CONFIG — EDIT HERE
   **********************/
  const START_DATE = "2026-01-12";

  const ACTIONS = [
    "pushup",
    "dumbbell",
    "pullup"
  ];

  const ACTION_LABELS = {
    pushup: "Push-up Progression",
    dumbbell: "Dumbbell",
    pullup: "Pull-up Progression"
  };

  const STORAGE_KEY = "disciplineTracker";

  /**********************
   * HELPERS
   **********************/
  function getDateRange(start, end) {
    const dates = [];
    let current = new Date(start);
    const last = new Date(end);

    while (current <= last) {
      dates.push(current.toISOString().slice(0, 10));
      current.setDate(current.getDate() + 1);
    }

    return dates.reverse(); // latest first
  }

  /**********************
   * LOAD DATA
   **********************/
  const allData = JSON.parse(localStorage.getItem(STORAGE_KEY)) || {};
  const today = new Date().toISOString().slice(0, 10);

  const dates = getDateRange(START_DATE, today);
  const container = document.getElementById("tracker");

  dates.forEach(date => {
    if (!allData[date]) {
      allData[date] = {};
    }

    const dayBlock = document.createElement("div");
    dayBlock.style.border = "1px solid #ddd";
    dayBlock.style.borderRadius = "8px";
    dayBlock.style.padding = "10px";
    dayBlock.style.marginBottom = "12px";

    const title = document.createElement("div");
    title.textContent = date;
    title.style.fontWeight = "bold";
    title.style.marginBottom = "6px";
    dayBlock.appendChild(title);

    ACTIONS.forEach(action => {
      const label = document.createElement("label");
      label.style.display = "block";
      label.style.fontSize = "14px";

      const checkbox = document.createElement("input");
      checkbox.type = "checkbox";
      checkbox.checked = !!allData[date][action];
      checkbox.style.marginRight = "6px";

      checkbox.addEventListener("change", () => {
        allData[date][action] = checkbox.checked;
        localStorage.setItem(STORAGE_KEY, JSON.stringify(allData));
      });

      label.appendChild(checkbox);
      label.appendChild(document.createTextNode(ACTION_LABELS[action]));
      dayBlock.appendChild(label);
    });

    container.appendChild(dayBlock);
  });

  /**********************
   * EXPORT CSV
   **********************/
  function exportCSV() {
    let header = ["date", ...ACTIONS];
    let rows = [header.join(",")];

    Object.keys(allData).sort().forEach(date => {
      const row = [date];
      ACTIONS.forEach(action => {
        row.push(allData[date][action] ? 1 : 0);
      });
      rows.push(row.join(","));
    });

    const blob = new Blob([rows.join("\n")], { type: "text/csv" });
    const a = document.createElement("a");
    a.href = URL.createObjectURL(blob);
    a.download = "discipline_tracker.csv";
    a.click();
  }
</script>
</body>
</html>