diff options
| -rw-r--r-- | public/views/repositories.html | 1 | ||||
| -rw-r--r-- | static/assets/js/pages/repositories.js | 75 |
2 files changed, 76 insertions, 0 deletions
diff --git a/public/views/repositories.html b/public/views/repositories.html index d90d3cb..56ac9ed 100644 --- a/public/views/repositories.html +++ b/public/views/repositories.html @@ -70,6 +70,7 @@ </div> </div> </div> + <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.min.js"></script> <script src="/static/assets/js/pages/repositories.js"></script> <script src="/static/assets/js/bootstrap-386.js"></script> <script src="/static/assets/js/bootstrap-transition.js"></script> diff --git a/static/assets/js/pages/repositories.js b/static/assets/js/pages/repositories.js index 70207ba..821b83c 100644 --- a/static/assets/js/pages/repositories.js +++ b/static/assets/js/pages/repositories.js @@ -61,6 +61,81 @@ $.getJSON("api/user", function (data) { githubText.appendChild(githubContainer); ghParagraph.appendChild(githubText); userData.appendChild(ghParagraph); + const contributions = data.contributions; + const canvas = document.createElement("canvas"); + canvas.id = "contributionsChart"; + const ctx = canvas.getContext("2d"); + const color = "#000083"; + // Generate Dates of past 53 weeks + const dates = []; + const today = new Date(); + const startDate = new Date( + today.getFullYear(), + today.getMonth(), + today.getDate() - 53 * 7 + ); + for (let i = 0; i < 53; i++) { + const date = new Date( + startDate.getFullYear(), + startDate.getMonth(), + startDate.getDate() + i * 7 + ); + const datePlusSevenDays = new Date( + date.getFullYear(), + date.getMonth(), + date.getDate() + 6 + ); + const sd = date.toLocaleDateString("en-US", { + month: "short", + day: "numeric", + year: "numeric", + }); + const ed = datePlusSevenDays.toLocaleDateString("en-US", { + month: "short", + day: "numeric", + year: "numeric", + }); + dates.push(sd + " - " + ed); + } + const contributionsChart = new Chart(ctx, { + type: "bar", + data: { + labels: dates, + datasets: [ + { + label: "Weekly Contributions", + data: contributions, + backgroundColor: color, + }, + ], + }, + options: { + plugins: { + subtitle: { + display: true, + text: "Weekly Contributions (Past Year)\n", + }, + legend: { + display: false, + }, + }, + scales: { + x: { + ticks: { + display: false + } + }, + y: { + ticks: { + display: false, + beginAtZero: true + } + } + } + }, + }); + canvas.height = "200px"; + userData.appendChild(canvas); }); const repos = document.getElementById("repos"); |
