forked from HackYourFuture/JavaScript3
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.js
More file actions
128 lines (105 loc) · 4.5 KB
/
Copy pathindex.js
File metadata and controls
128 lines (105 loc) · 4.5 KB
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
'use strict';
{
function fetchJSON(url, cb) {
const xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.responseType = 'json';
xhr.onload = () => {
if (xhr.status < 400) {
cb(null, xhr.response);
} else {
cb(new Error(`Network error: ${xhr.status} - ${xhr.statusText}`));
}
};
xhr.onerror = () => cb(new Error('Network request failed'));
xhr.send();
}
function createAndAppend(name, parent, options = {}) {
const elem = document.createElement(name);
parent.appendChild(elem);
Object.keys(options).forEach((key) => {
const value = options[key];
if (key === 'text') {
elem.innerText = value;
} else {
elem.setAttribute(key, value);
}
});
return elem;
}
function Repositories(index, data, container) {
const repoInfo = createAndAppend('div', container, { 'class': 'left-div box' });
const table = createAndAppend('table', repoInfo, { 'id': 'info-table' });
const repoTr = createAndAppend('tr', table);
createAndAppend('td', repoTr, { 'text': 'Repository :', 'class': 'label' });
const repoName = createAndAppend('td', repoTr, { 'id': 'repo-name' });
const url = createAndAppend('a', repoName, { 'target': '_blank', });
const descriptionTr = createAndAppend('tr', table);
const descriptionName = createAndAppend('td', descriptionTr, { 'text': 'Description :', 'class': 'label' });
const descriptionDetails = createAndAppend('td', descriptionTr);
const forkTr = createAndAppend('tr', table);
createAndAppend('td', forkTr, { 'text': 'Forks :', 'class': 'label' });
const forkNum = createAndAppend('td', forkTr);
const updateTr = createAndAppend('tr', table);
createAndAppend('td', updateTr, { 'text': 'Updated :', 'class': 'label' });
const updateNum = createAndAppend('td', updateTr);
url.innerText = data[index].name;
url.setAttribute('href', data[index].html_url);
if (data[index].description === null) {
descriptionName.innerHTML = '';
descriptionDetails.innerText = '';
} else {
descriptionName.innerText = "Description :";
descriptionDetails.innerText = data[index].description;
}
forkNum.innerText = data[index].forks;
const updateRepo = new Date(data[index].updated_at);
updateNum.innerText = updateRepo.toLocaleString("en-US");
}
function Contributors(data, container) {
const contributorsDiv = createAndAppend('div', container, { 'class': 'right-div box' });
createAndAppend('p', contributorsDiv, { 'text': 'Contributions', 'class': 'contributions' });
const ul = createAndAppend('ul', contributorsDiv);
data.forEach(contributor => {
const li = createAndAppend('li', ul);
li.setAttribute('target', '_blank');
li.addEventListener("click", () => { window.open(contributor.html_url) });
createAndAppend('img', li, { 'src': contributor.avatar_url });
createAndAppend('p', li, { 'text': contributor.login });
createAndAppend('div', li, { 'text': contributor.contributions, 'class': 'contributionNum' });
});
}
function main(url) {
const root = document.getElementById('root');
const header = createAndAppend('header', root, { 'class': 'header' });
createAndAppend('p', header, { 'text': 'HYF Repositories' });
const select = createAndAppend('select', header, { 'id': 'select-list' });
const container = createAndAppend('div', root, { 'id': 'container' });
fetchJSON(url, (err, data) => {
if (err) {
createAndAppend('div', root, { 'text': err.message, class: 'alert-error' });
} else {
data.sort((x, y) => x.name.localeCompare(y.name));
data.forEach((item, index) => {
createAndAppend('option', select, { 'text': item.name, 'value': index });
});
Repositories(0, data, container);
}
const contributorsInfo = data[0].contributors_url;
fetchJSON(contributorsInfo, (err, contributorData) => {
Contributors(contributorData, container);
});
select.addEventListener('change', (e) => {
container.innerHTML = "";
const index = e.target.value;
Repositories(index, data, container);
const contributorOnSelect = data[index].contributors_url;
fetchJSON(contributorOnSelect, (err, contributorData) => {
Contributors(contributorData, container);
});
});
});
}
const HYF_REPOS_URL = 'https://api.github.com/orgs/HackYourFuture/repos?per_page=100';
window.onload = () => main(HYF_REPOS_URL);
}