Skip to content

Instantly share code, notes, and snippets.

@ggorlen

ggorlen/codementor-payouts.html

Last active June 21, 2024 14:08
Show Gist options
  • Save ggorlen/15a88d9a8d8e13d3769bcdfc44917372 to your computer and use it in GitHub Desktop.
Save ggorlen/15a88d9a8d8e13d3769bcdfc44917372 to your computer and use it in GitHub Desktop.
Download ZIP
Codementor payouts visualizer
Raw
codementor-payouts.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="Codementor payout visualizer">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Codementor Payout Visualizer</title>
</head>
<body>
<div>
<canvas id="chart"></canvas>
</div>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
/*
scrape from https://arc.dev/settings/payout-information/completed?from_cm=1 with:
[...document.querySelectorAll(".payout-info")].map(e => ({
date: e.querySelector(".date").textContent.trim(),
payout: e.querySelector(".amount").textContent.trim()
}))
*/
const ctx = document.getElementById("chart");
const data = [
{
"date": "June 10, 2024",
"payout": "$78.49"
},
{
"date": "June 3, 2024",
"payout": "$47.60"
},
{
"date": "May 27, 2024",
"payout": "$164.17"
},
{
"date": "May 20, 2024",
"payout": "$25.81"
},
{
"date": "May 13, 2024",
"payout": "$92.13"
},
{
"date": "May 6, 2024",
"payout": "$189.54"
},
{
"date": "April 29, 2024",
"payout": "$116.54"
},
{
"date": "April 22, 2024",
"payout": "$28.64"
},
{
"date": "April 8, 2024",
"payout": "$229.29"
},
{
"date": "April 1, 2024",
"payout": "$23.98"
},
{
"date": "March 18, 2024",
"payout": "$190.96"
},
{
"date": "March 11, 2024",
"payout": "$892.93"
},
{
"date": "March 4, 2024",
"payout": "$1,132.66"
},
{
"date": "February 26, 2024",
"payout": "$421.71"
},
{
"date": "February 19, 2024",
"payout": "$180.70"
},
{
"date": "February 12, 2024",
"payout": "$39.50"
},
{
"date": "January 22, 2024",
"payout": "$143.08"
},
{
"date": "January 15, 2024",
"payout": "$360.97"
},
{
"date": "January 8, 2024",
"payout": "$254.75"
},
{
"date": "December 25, 2023",
"payout": "$137.16"
},
{
"date": "December 18, 2023",
"payout": "$134.73"
},
{
"date": "December 11, 2023",
"payout": "$48.41"
},
{
"date": "December 4, 2023",
"payout": "$61.87"
},
{
"date": "November 27, 2023",
"payout": "$94.77"
},
{
"date": "November 20, 2023",
"payout": "$82.97"
},
{
"date": "November 13, 2023",
"payout": "$343.28"
},
{
"date": "November 6, 2023",
"payout": "$293.78"
},
{
"date": "October 30, 2023",
"payout": "$101.99"
},
{
"date": "October 23, 2023",
"payout": "$274.93"
},
{
"date": "October 16, 2023",
"payout": "$92.23"
},
{
"date": "October 9, 2023",
"payout": "$135.25"
},
{
"date": "October 2, 2023",
"payout": "$163.54"
},
{
"date": "September 25, 2023",
"payout": "$287.02"
},
{
"date": "September 18, 2023",
"payout": "$73.15"
},
{
"date": "September 11, 2023",
"payout": "$134.67"
},
{
"date": "September 4, 2023",
"payout": "$119.20"
},
{
"date": "August 28, 2023",
"payout": "$167.54"
},
{
"date": "August 21, 2023",
"payout": "$654.57"
},
{
"date": "August 7, 2023",
"payout": "$423.99"
},
{
"date": "July 24, 2023",
"payout": "$101.16"
},
{
"date": "July 17, 2023",
"payout": "$145.92"
},
{
"date": "July 3, 2023",
"payout": "$491.29"
},
{
"date": "June 19, 2023",
"payout": "$429.53"
},
{
"date": "June 12, 2023",
"payout": "$118.72"
},
{
"date": "June 5, 2023",
"payout": "$92.34"
},
{
"date": "May 29, 2023",
"payout": "$283.04"
},
{
"date": "May 22, 2023",
"payout": "$292.94"
},
{
"date": "May 15, 2023",
"payout": "$657.22"
},
{
"date": "May 8, 2023",
"payout": "$466.22"
},
{
"date": "May 1, 2023",
"payout": "$504.98"
},
{
"date": "April 24, 2023",
"payout": "$750.41"
},
{
"date": "April 17, 2023",
"payout": "$274.00"
},
{
"date": "April 10, 2023",
"payout": "$734.86"
},
{
"date": "April 3, 2023",
"payout": "$742.45"
},
{
"date": "March 27, 2023",
"payout": "$570.26"
},
{
"date": "March 20, 2023",
"payout": "$1,049.85"
},
{
"date": "March 13, 2023",
"payout": "$432.03"
},
{
"date": "March 6, 2023",
"payout": "$1,748.19"
},
{
"date": "February 27, 2023",
"payout": "$1,364.89"
},
{
"date": "February 20, 2023",
"payout": "$1,089.70"
},
{
"date": "February 13, 2023",
"payout": "$1,276.64"
},
{
"date": "February 6, 2023",
"payout": "$1,123.48"
},
{
"date": "January 30, 2023",
"payout": "$959.54"
},
{
"date": "January 23, 2023",
"payout": "$1,344.93"
},
{
"date": "January 16, 2023",
"payout": "$941.07"
},
{
"date": "January 9, 2023",
"payout": "$1,045.56"
},
{
"date": "January 2, 2023",
"payout": "$614.95"
},
{
"date": "December 26, 2022",
"payout": "$653.24"
},
{
"date": "December 19, 2022",
"payout": "$881.80"
},
{
"date": "December 12, 2022",
"payout": "$1,511.31"
},
{
"date": "December 5, 2022",
"payout": "$1,249.19"
},
{
"date": "November 28, 2022",
"payout": "$999.57"
},
{
"date": "November 21, 2022",
"payout": "$421.87"
},
{
"date": "November 14, 2022",
"payout": "$744.53"
},
{
"date": "November 7, 2022",
"payout": "$581.98"
},
{
"date": "October 31, 2022",
"payout": "$973.75"
},
{
"date": "October 24, 2022",
"payout": "$1,386.05"
},
{
"date": "October 17, 2022",
"payout": "$992.38"
},
{
"date": "October 10, 2022",
"payout": "$865.05"
},
{
"date": "October 3, 2022",
"payout": "$402.58"
},
{
"date": "September 26, 2022",
"payout": "$588.99"
},
{
"date": "September 19, 2022",
"payout": "$924.63"
},
{
"date": "September 12, 2022",
"payout": "$708.26"
},
{
"date": "September 5, 2022",
"payout": "$518.96"
},
{
"date": "August 29, 2022",
"payout": "$459.88"
},
{
"date": "August 22, 2022",
"payout": "$312.22"
},
{
"date": "August 15, 2022",
"payout": "$201.11"
},
{
"date": "August 8, 2022",
"payout": "$1,110.90"
},
{
"date": "August 1, 2022",
"payout": "$142.39"
},
{
"date": "July 25, 2022",
"payout": "$441.54"
},
{
"date": "July 18, 2022",
"payout": "$77.14"
},
{
"date": "July 11, 2022",
"payout": "$58.58"
},
{
"date": "July 4, 2022",
"payout": "$165.75"
},
{
"date": "June 27, 2022",
"payout": "$170.93"
},
{
"date": "June 20, 2022",
"payout": "$216.49"
},
{
"date": "June 13, 2022",
"payout": "$53.62"
},
{
"date": "May 9, 2022",
"payout": "$204.85"
},
{
"date": "May 2, 2022",
"payout": "$257.44"
},
{
"date": "April 25, 2022",
"payout": "$416.77"
},
{
"date": "April 18, 2022",
"payout": "$471.68"
},
{
"date": "April 11, 2022",
"payout": "$262.72"
},
{
"date": "April 4, 2022",
"payout": "$527.94"
},
{
"date": "March 28, 2022",
"payout": "$155.09"
},
{
"date": "March 21, 2022",
"payout": "$342.17"
},
{
"date": "March 14, 2022",
"payout": "$348.95"
}
].reverse();
const res = [{...data[0], date: new Date(data[0].date)}];
for (let i = 1; i < data.length; i++) {
let start = new Date(data[i-1].date);
const end = new Date(data[i].date);
res.push({date: start, payout: data[i-1].payout});
while (start < end) {
// debug challenge possibility: remove start.getTime() from the line below
const d = new Date(start.getTime());
d.setDate(start.getDate() + 7);
start = d;
if (start < end) {
res.push({date: start, payout: "$0.00"});
}
}
}
res.push({...data.at(-1), date: new Date(data.at(-1).date)});
// TODO: could also graph number of unique clients
// could graph $0 payouts since last payout and the current date.
// fill in a missing payout:
//{
//const d = new Date();
//d.setDate(25);
//res.push({date: d, payout: "0"});
//}
new Chart(ctx, {
type: "line",
data: {
labels: res.map(e => e.date.toLocaleDateString("en-US")),
datasets: [{
label: "payout",
data: res.map(e => e.payout.replace(/[$,]/g, "")),
}]
},
options: {
scales: {
y: {
beginAtZero: true,
ticks: {
callback: (value, index, ticks) => `$${value}`
}
}
}
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment