project-github-tracker Frida Axelsson #83
There are no files selected for viewing
Binary file not shown.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| code/secret.js | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file not shown.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,37 @@ | ||
|
|
||
| // //DOM-selector for the canvas 👇 | ||
| const ctx = document.getElementById("chart").getContext("2d"); | ||
|
|
||
|
|
||
| const drawChart = (amount) => { | ||
| const labels = [ | ||
| 'Projects done', | ||
| 'Technigo projects', | ||
| ]; | ||
|
|
||
| const data = { | ||
| labels: labels, | ||
| datasets: [{ | ||
| label: 'My First dataset', | ||
| data: [amount, 19-amount], | ||
|
Comment on lines
+6
to
+16
There was a problem hiding this comment. Great job passing in the amount of projected you have completed in your drawChart function. Nicely done! |
||
| backgroundColor: ['rgba(203,108,127,255)', 'rgba(245,243,240)' ], | ||
| borderColor: 'none', | ||
| }] | ||
| }; | ||
|
|
||
| const config = { | ||
| type: 'doughnut', | ||
| data: data, | ||
| options: { | ||
| responsive: true, | ||
| maintainAspectRatio: true, | ||
| } | ||
| }; | ||
|
|
||
| const myChart = new Chart( | ||
| document.getElementById('chart'), | ||
| config | ||
| ); | ||
| } | ||
|
|
||
| console.log('test') | ||
|
There was a problem hiding this comment. I think you forgot to remove a console log here on line 37 :) |
||
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,107 @@ | ||
| //DOM-selectors | ||
|
|
||
| const imgWrapper = document.getElementById('imgWrapper') | ||
| const userDataWrapper = document.getElementById('userDataWrapper') | ||
| const projects = document.getElementById('projects') | ||
|
|
||
| //Github API | ||
| const username = 'Nosslexa' | ||
| const API_URL = `https://api.github.com/users/${username}/repos` | ||
|
|
||
| const options = { | ||
| method: 'GET', | ||
| headers: { | ||
| Authorization: 'API_TOKEN' | ||
| } | ||
| } | ||
|
Comment on lines
+11
to
+16
There was a problem hiding this comment. I would suggest removing this as well since, I mentioned earlier that you don't seem to have a secret file and I think you can remove this code from line 11-16, since you don't seem to be using it in your script file. |
||
|
|
||
|
|
||
| // This function fetch all my repos and then filters() out the ones forked = true and starts with "project-" | ||
| const getRepos = () => { | ||
| fetch(API_URL, options) | ||
| .then(res => res.json()) | ||
| .then(data => { | ||
| console.log(data) | ||
| console.log(data[0].owner) | ||
|
Comment on lines
+24
to
+25
There was a problem hiding this comment. I think you forgot to remove some console logs here in this file as well :) |
||
|
|
||
| const forkedRepos = data.filter((repo) => repo.fork && repo.name.startsWith("project-")) | ||
| console.log(forkedRepos) | ||
|
|
||
| getPullRequests(forkedRepos) | ||
|
There was a problem hiding this comment. Nice job passing on your forked projects into your getPullRequests function. |
||
|
|
||
|
|
||
| // injects profile img and user data to the HTML. | ||
| imgWrapper.innerHTML = ` | ||
| <div> | ||
| <img class="img" src="${data[0].owner.avatar_url}" alt="userimage"> | ||
| </div> | ||
| ` | ||
|
|
||
| userDataWrapper.innerHTML += ` | ||
| <h1>Github tracker</h1> | ||
| <p>${data[0].owner.login} : Frida Axelsson</p> | ||
| ` | ||
|
|
||
| //display repo info | ||
| forkedRepos.forEach((data) => { | ||
| let projectID = data.id | ||
|
|
||
| projects.innerHTML +=` | ||
| <div class="repo-card" id="${projectID}"> | ||
| <a href="${data.html_url}"> | ||
| <h3>${data.name}</h3></a> | ||
| <p>Branch: ${data.default_branch}</p> | ||
| <p>Last push: ${new Date(data.pushed_at).toDateString()}</p> | ||
| <p id="repoName" > </p> | ||
| </div>` | ||
|
|
||
| getCommits(data, projectID); | ||
| }) | ||
| getPullRequests(forkedRepos) | ||
| drawChart(forkedRepos.length) | ||
| }) | ||
| } | ||
|
|
||
| //funktion to get commits | ||
| const getCommits = (projects, projectID) => { | ||
| const GIT_COMMIT_API = projects.commits_url.replace("{/sha}", "") | ||
| fetch (GIT_COMMIT_API) | ||
| .then((res) => res.json()) | ||
| .then(data => { | ||
| let numberOfCommits = data.length | ||
| document.getElementById(projectID).innerHTML +=` | ||
| <p> Number of commits: ${numberOfCommits}</p>` | ||
| }) | ||
| } | ||
|
|
||
| //function to find() my pullrequests and comments | ||
| const getPullRequests = (forkedRepos) => { | ||
| forkedRepos.forEach(repo => { | ||
| fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls?per_page=100`,) | ||
| .then(res => res.json()) | ||
| .then(data => { | ||
| console.log(data) | ||
|
|
||
| const myPullRequests = data.find((pull) => pull.user.login === repo.owner.login) | ||
| console.log(myPullRequests) | ||
| }) | ||
| }) | ||
| } | ||
|
|
||
|
|
||
| getRepos() | ||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
Comment on lines
+93
to
+107
There was a problem hiding this comment. I would suggest removing the empty lines you have here and the ones in your css file to keep your file clean. |
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,167 @@ | ||
| body { | ||
| background: white; | ||
| margin: 0; | ||
| padding: 0; | ||
| font-family: Arial, Helvetica, sans-serif; | ||
| } | ||
|
|
||
| header{ | ||
| background: pink; | ||
| } | ||
|
|
||
| .hero{ | ||
| background-image: url(./img/susan-wilkinson-SjhL-Zrol6A-unsplash.jpg) ; | ||
| background-position: left bottom; | ||
| background-repeat: no-repeat; | ||
| background-size: cover; | ||
| background-attachment: fixed; | ||
| position: relative; | ||
| height: 300px; | ||
| width: 100%; | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: center; | ||
| } | ||
|
Comment on lines
+13
to
+24
There was a problem hiding this comment. Great job utilizing flex box in your project! |
||
| .user-data-wrapper{ | ||
| height: 200px; | ||
| text-align: center; | ||
| color: #f5f3f0; | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: center; | ||
| } | ||
|
|
||
| .user-data-wrapper p{ | ||
| font-size: smaller; | ||
| margin: 0; | ||
| padding: 0; | ||
| } | ||
|
|
||
| .user-data-wrapper h1{ | ||
| margin-bottom: 0; | ||
| } | ||
|
|
||
| .img-wrapper{ | ||
| display: flex; | ||
| justify-content: center; | ||
| align-self: flex-end; | ||
| position: absolute; | ||
| top: 200px; | ||
| } | ||
|
|
||
| img{ | ||
| border-radius: 50%; | ||
| height: 150px; | ||
| filter: saturate(70%); | ||
| filter: grayscale(50%); | ||
| align-self: flex-end; | ||
| } | ||
|
|
||
| .project-wrapper{ | ||
| display: flex; | ||
| flex-direction: column; | ||
| align-items: center; | ||
| gap: 10px; | ||
| margin-top: 25%; | ||
| margin-bottom: 25%; | ||
| } | ||
|
|
||
| .repo-card{ | ||
| height: 40vh; | ||
| width: 80vw; | ||
| background-color: #f5f3f0; | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: center; | ||
| align-items: center; | ||
| } | ||
|
|
||
| .repo-card a { | ||
| text-decoration: none; | ||
| color: black; | ||
|
|
||
| } | ||
|
|
||
| .chart-box{ | ||
| display: flex; | ||
| justify-content: center; | ||
| } | ||
|
|
||
|
|
||
|
|
||
| footer{ | ||
| font-size: small; | ||
| background-color: #f5f3f0; | ||
| color: gray; | ||
| width: 100%; | ||
| height: 10vh; | ||
| margin: 0%; | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: flex-end; | ||
| margin-top: 25%; | ||
| } | ||
|
|
||
| @media (min-width: 768px) and (orientaion: landscape) { | ||
| .hero{ | ||
| height: 400px; | ||
| } | ||
|
|
||
| .img-wrapper{ | ||
| top: 300px; | ||
| } | ||
|
|
||
| img{ | ||
| height: 200px; | ||
| } | ||
| .project-wrapper{ | ||
| display: flex; | ||
| flex-direction: row; | ||
| flex-wrap: wrap; | ||
| justify-content: center; | ||
| margin-bottom: 25%; | ||
| } | ||
|
|
||
| .repo-card{ | ||
| height: 20vh; | ||
| width: 40vw; | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: center; | ||
| border: solid; | ||
| } | ||
| } | ||
|
|
||
| .repo-card h3{ | ||
| margin-bottom: 10px; | ||
| } | ||
| .repo-card p{ | ||
| margin: 2px; | ||
| } | ||
|
|
||
| @media (min-width: 992px){ | ||
| .project-wrapper{ | ||
| display: flex; | ||
| flex-direction: row; | ||
| flex-wrap: wrap; | ||
| justify-content: center; | ||
| margin-bottom: 25%; | ||
| } | ||
|
|
||
| .repo-card{ | ||
| height: 45vh; | ||
| width: 30vw; | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: center; | ||
|
|
||
| } | ||
|
|
||
| img{ | ||
| height: 300px; | ||
| } | ||
|
|
||
| } | ||
|
|
||
|
|
||
|
|
||
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Did you know you could add the .DS_Store file into your gitignore file as well so it doesn't get committed?