[Исходный код] [Попробуйте свое имя пользователя]

Github предоставляет очень интересную функцию «Перфокарта». Он визуализирует количество ваших коммитов по дням недели и часам дня в каждом репозитории.

Было бы интересно, если бы статистика показывала количество моих коммитов по часам в день на основе всех моих репозиториев. Благодаря API Github эту идею можно легко реализовать.

Шаг 1:

https://api.github.com/users/[username]/repos

Используя указанный выше API, мы можем получить информацию обо всех репозиториях одного пользователя в формате JSON. Анализируя ответ JSON, мы можем получить метку «full_name», обозначающую имя пользователя и имя репозитория:

"full_name": "byn9826/Thousanday-React"

Сначала нам нужен массив для хранения всего «full_name»:

const xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "https://api.github.com/users/" + this.state.name + "/repos", false);
xmlhttp.send();
const result = JSON.parse(xmlhttp.responseText);
const repos = result.map(r => { return r.full_name; });

Шаг 2

https://api.github.com/repos/[username]/[reponame]/stats/punch_card

Используя API, описанный выше, мы можем получить статистику коммитов одного пользователя по дням и часам для одного репозитория. Пара [username] / [reponame] здесь - это в точности то же «full_name», которое мы сохранили в нашей переменной «repos» на предыдущем шаге. Затем сохраните все данные коммитов в другом массиве:

const punch = [];
for (let j = 0; j < repos.length; j++) {
  xmlhttp = new XMLHttpRequest();
  xmlhttp.open("GET", "https://api.github.com/repos/" + repos[j] + "/stats/punch_card", false);
  xmlhttp.send();
  punch[j] = JSON.parse(xmlhttp.responseText);
}

Шаг 3:

Переменная «punch» представляет собой вложенный массив, имеющий вид [[0,0,0], [0,1,1], ……]. Первое число означает один день недели от 0 до 6, второе число означает один час дня от 0 до 23, третье число означает общее количество коммитов за этот час и этот день. Итак, нам нужна именно сумма третьих чисел (Всего фиксирует числа), где второе число одинаково (по каждому часу дня):

const commits = [];
let total = 0;
for (let k = 0; k < punch.length; k++) {
  for (let l = 0; l < punch[k].length; l++) {
    commits[punch[k][l][1]] = (commits[punch[k][l][1]] || 0) + punch[k][l][2];
    total += punch[k][l][2];
  }
}
this.setState({ commits, total });

Шаг 4:

Показывать данные в компоненте индикатора выполнения React по каждому часу дня:

const perhours = this.state.commits.map((perhour, index) =>
  <div key={index} style={lineStyle}>
    <div style={indexStyle}>{index}:00 - {index}:59</div>
    <Progress progress={perhour} max={this.state.total} percentage=     {this.state.percentage} height="12px" width="80%" />
  </div>
);
return {perhours};

Наконец-то я получил статистику коммитов:

Мои продуктивные часы - с 13:00 до 12:00.

Давайте проверим кого-нибудь на основе Самые активные пользователи GitHub 2015

Какой красивый изгиб!

Однако для каждого IP-адреса существует ограничение на получение API-интерфейсов Github, а некоторые имена пользователей могут привести к ошибке из-за неправильного формата JSON.