Skip to content

Commit 529a58b

Browse files
isomothisomoth
committed
fixed forkedRepos function and fixed indentation
1 parent 08e6662 commit 529a58b

4 files changed

Lines changed: 93 additions & 104 deletions

File tree

‎code/chart.js‎

Lines changed: 34 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,39 @@
1-
// DOM-selector for the canvas
1+
// DOM-selector for the canvas
22
const ctx = document.getElementById('myChart').getContext('2d');
33

44
// Generate the chart based on the data fetched on script.js
5-
const drawChart = (amount) => {
6-
const config = {
7-
type: 'bar',
8-
data: {
9-
labels: [
10-
'Finished Projects',
11-
'Projects Left',
12-
],
13-
datasets: [{
14-
label: 'Completed Projects',
15-
data: [amount, 19-amount],
16-
backgroundColor: [
17-
'#D365C8',
18-
'#3aafc9',
19-
],
20-
hoverOffset: 4
21-
}]
5+
const drawChart = (amount) => {
6+
const config = {
7+
type: 'bar',
8+
data: {
9+
labels: ['Finished Projects', 'Projects Left'],
10+
datasets: [
11+
{
12+
label: 'Completed Projects',
13+
data: [amount, 19 - amount],
14+
backgroundColor: ['#D365C8', '#3aafc9'],
15+
hoverOffset: 4,
16+
},
17+
],
18+
},
19+
options: {
20+
// The first two options make the chart responsive
21+
responsive: true,
22+
maintainAspectRatio: false,
23+
plugins: {
24+
legend: {
25+
display: false,
26+
},
27+
tooltips: {
28+
callbacks: {
29+
label: function (tooltipItem) {
30+
return tooltipItem.yLabel;
31+
},
2232
},
23-
options: {
24-
// The first two options make the chart responsive
25-
responsive: true,
26-
maintainAspectRatio: false,
27-
plugins: {
28-
legend: {
29-
display: false,
30-
},
31-
tooltips: {
32-
callbacks: {
33-
label: function(tooltipItem) {
34-
console.log(tooltipItem)
35-
return tooltipItem.yLabel;
36-
},
37-
},
38-
},
39-
}
40-
}
41-
};
42-
43-
const myChart = new Chart(
44-
ctx,
45-
config
46-
);
47-
}
33+
},
34+
},
35+
},
36+
};
4837

49-
38+
const myChart = new Chart(ctx, config);
39+
};

‎code/index.html‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,18 @@
55
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
77
<title>Project GitHub Tracker</title>
8-
<meta name="description" content="GitHub Technigo forked projects tracker">
9-
<meta name="author" content="Isabel González">
8+
<meta
9+
name="description"
10+
content="GitHub Technigo forked projects tracker"
11+
/>
12+
<meta name="author" content="Isabel González" />
1013
<link rel="stylesheet" href="./style.css" />
11-
<link rel="preconnect" href="https://fonts.googleapis.com">
12-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
13-
<link href="https://fonts.googleapis.com/css2?family=Martel+Sans:wght@200;300;400;600;700;800;900&display=swap" rel="stylesheet">
14+
<link rel="preconnect" href="https://fonts.googleapis.com" />
15+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
16+
<link
17+
href="https://fonts.googleapis.com/css2?family=Martel+Sans:wght@200;300;400;600;700;800;900&display=swap"
18+
rel="stylesheet"
19+
/>
1420
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
1521
</head>
1622
<body>

‎code/script.js‎

Lines changed: 23 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
// The strict mode in JavaScript prevents several bugs. For example, it won't let you use undeclared variables.
2-
"use strict";
1+
// The strict mode in JavaScript prevents several bugs. For example, it won't let you use undeclared variables.
2+
'use strict';
33

44
// Global variables
55
const USER = 'isomoth';
@@ -33,35 +33,36 @@ getUserProfile();
3333
// Fetch all of the user's projects where a pull request has been made
3434
const getPullRequests = (allRepos) => {
3535
allRepos.forEach((repo) => {
36-
const PULL_URL = `https://api.github.com/repos/Technigo/${repo.name}/pulls?per_page=100`
36+
const PULL_URL = `https://api.github.com/repos/Technigo/${repo.name}/pulls?per_page=100`;
3737
fetch(PULL_URL)
3838
.then((response) => response.json())
3939
.then((data) => {
4040
const userPullRequest = data.find(
4141
(pull) => pull.user.login === repo.owner.login
4242
);
4343
// Filter out pull requests from other users and fetch commits from them
44-
if(userPullRequest){
44+
if (userPullRequest) {
4545
getCommits(userPullRequest.commits_url, repo.name);
4646
} else {
4747
// Catch exception when no pull request has been made
48-
document.getElementById(`commit-${repo.name}`).innerHTML = 'No pull requests so far.';
48+
document.getElementById(`commit-${repo.name}`).innerHTML =
49+
'No pull requests so far.';
4950
}
5051
});
5152
});
5253
};
5354

5455
//Fetch all commits from filtered projects
5556
const getCommits = (myCommitsUrl, myRepoName) => {
56-
fetch(myCommitsUrl) // this will be 'commits_url' from line 45
57-
.then((res) => res.json())
58-
.then((data) => {
59-
// Count amount of commits
60-
document.getElementById(`commit-${myRepoName}`).innerHTML += data.length;
61-
});
57+
fetch(myCommitsUrl) // this will be 'commits_url' from line 45
58+
.then((res) => res.json())
59+
.then((data) => {
60+
// Count amount of commits
61+
document.getElementById(`commit-${myRepoName}`).innerHTML += data.length;
62+
});
6263
};
6364

64-
// Fetch all repositories that the user has forked from Technigo
65+
// Fetch all repositories that the user has forked from Technigo
6566
const getRepositories = () => {
6667
fetch(REPOS_URL)
6768
.then((response) => response.json())
@@ -71,27 +72,24 @@ const getRepositories = () => {
7172
);
7273
// Sort repos based on date of creation ("created_at")
7374
forkedRepos.sort(
74-
(a, b) => new Date(b.created_at) - new Date(a.created_at)
75+
(b, a) => new Date(a.created_at) - new Date(b.created_at)
7576
);
76-
// Display them from earliest to latest
77-
forkedRepos = forkedRepos.reverse();
7877
// Finally, use a loop to generate a card container for each project and fetch other relevant info about it
79-
forkedRepos.forEach(
80-
(repo) => {
81-
projectsContainer.innerHTML +=
82-
`<div class="repo-card">
83-
<h3><a class="repo-link" href="${repo.html_url}">${repo.name}</a><h3>
78+
forkedRepos.forEach((repo) => {
79+
projectsContainer.innerHTML += `<div class="repo-card">
80+
<h3><a class="repo-link" href="${repo.html_url}" target="_blank">${
81+
repo.name
82+
}</a><h3>
8483
<span>
8584
<p>Default branch: ${repo.default_branch}</p>
8685
<p>Latest push: ${new Date(repo.pushed_at).toDateString()}</p>
8786
<p id="commit-${repo.name}">Amount of commits: </p>
8887
<span>
89-
</div>`
90-
},
91-
);
88+
</div>`;
89+
});
9290
getPullRequests(forkedRepos),
93-
//Use the data above to generate the chart from chart.js, displaying elapsed vs. remaining projects
94-
drawChart(forkedRepos.length);
91+
//Use the data above to generate the chart from chart.js, displaying elapsed vs. remaining projects
92+
drawChart(forkedRepos.length);
9593
});
9694
};
9795

‎code/style.css‎

Lines changed: 25 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
1-
*{
1+
* {
22
margin: 0;
33
padding: 0;
44
box-sizing: border-box;
55
}
66

7-
87
/* PALETTE
98
109
Dark grey: #222a36
@@ -21,10 +20,9 @@ Magenta: #D6434A
2120
/* ----------------------------------------------- */
2221

2322
body {
24-
25-
background: #D5CABD;
23+
background: #d5cabd;
2624
font-family: 'Martel Sans', Helvetica, Arial, sans-serif;
27-
color: #37888A;
25+
color: #37888a;
2826
margin: 1rem;
2927
font-size: 16px;
3028
}
@@ -48,14 +46,14 @@ a {
4846
text-align: center;
4947
}
5048

51-
.bio{
49+
.bio {
5250
margin-top: 1rem;
5351
padding-left: 2rem;
5452
padding-right: 2rem;
5553
}
5654

57-
.bio,
58-
.public,
55+
.bio,
56+
.public,
5957
.twitter {
6058
color: #474554;
6159
}
@@ -64,8 +62,8 @@ a {
6462
padding: 0.5rem;
6563
margin-bottom: 5px;
6664
width: 100%;
67-
background: #DDEBEB;
68-
display: block;
65+
background: #ddebeb;
66+
display: block;
6967
margin-left: auto;
7068
margin-right: auto;
7169
text-align: center;
@@ -74,12 +72,12 @@ a {
7472
border-radius: 6px;
7573
}
7674

77-
.user-image{
75+
.user-image {
7876
width: 50%;
79-
height: fit-content;
77+
height: fit-content;
8078
border-radius: 50%;
8179
box-shadow: 0 0 0 0.1px;
82-
display: block;
80+
display: block;
8381
margin-left: auto;
8482
margin-right: auto;
8583
}
@@ -90,7 +88,7 @@ a {
9088

9189
#project-grid {
9290
display: grid;
93-
grid-template-columns: repeat(1, 1fr);
91+
grid-template-columns: repeat(1, 1fr);
9492
}
9593

9694
.repo-card {
@@ -104,7 +102,7 @@ a {
104102
}
105103

106104
.repo-link {
107-
color: #D6434A;
105+
color: #d6434a;
108106
font-size: 20px;
109107
}
110108

@@ -116,36 +114,33 @@ a {
116114
margin-top: 2rem;
117115
margin-left: auto;
118116
margin-right: auto;
119-
width:80vw;
120-
height:60vh;
117+
width: 80vw;
118+
height: 60vh;
121119
}
122120

123-
124-
125121
/* ----------------------------------------------- */
126122
/* MEDIA QUERIES */
127123
/* ----------------------------------------------- */
128124

129125
@media screen and (min-width: 600px) {
130-
#project-grid {
126+
#project-grid {
131127
grid-template-columns: repeat(2, 1fr);
132128
grid-gap: 30px;
133-
};
134-
.user-image{
129+
}
130+
.user-image {
135131
width: 30%;
136132
height: auto;
137133
}
138134
}
139135

140136
@media screen and (min-width: 768px) {
141-
.user-image{
137+
.user-image {
142138
width: 40%;
143139
height: auto;
144140
}
145141
}
146142

147143
@media screen and (min-width: 1024px) {
148-
149144
.profile-container {
150145
display: grid;
151146
grid-template-columns: 1fr 3fr;
@@ -161,8 +156,8 @@ a {
161156
justify-content: flex-start;
162157
margin-top: 0;
163158
}
164-
165-
.user-image{
159+
160+
.user-image {
166161
width: 75%;
167162
}
168163

@@ -172,12 +167,12 @@ a {
172167

173168
h1 {
174169
font-size: 3em;
175-
}
170+
}
176171
h2 {
177172
font-size: 2em;
178173
}
179174
h3 {
180-
font-size: 1em;
175+
font-size: 1em;
181176
}
182177
.bio {
183178
font-size: 1em;
@@ -192,6 +187,6 @@ a {
192187
max-width: 2000px;
193188
}
194189
.chart-container {
195-
max-width:1500px;
190+
max-width: 1500px;
196191
}
197-
}
192+
}

0 commit comments

Comments
 (0)