From 4372fa1091e9701f4b14f709ac3e0cfb90ab3328 Mon Sep 17 00:00:00 2001 From: JensBergqvist Date: Sat, 26 Feb 2022 10:53:01 +0100 Subject: [PATCH 1/5] updated javascript --- code/script.js | 68 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 68 insertions(+) diff --git a/code/script.js b/code/script.js index e69de29b..b534b89a 100644 --- a/code/script.js +++ b/code/script.js @@ -0,0 +1,68 @@ +//DOM selectors +const username = 'JensBergqvist' +const projects = document.getElementById("projects") + + +const API_REPOS = `https://api.github.com/users/${username}/repos`; +const API_PROFIL = `https://api.github.com/users/${username}` +//Picture and name + +const profilePic = () => { + fetch(API_PROFIL) + .then(res => res.json()) + .then(data => { + // console.log(data) + picture = data.avatar_url + let profilePicture = `
+

${username}

+ +
`; + return (projects.innerHTML = profilePicture) +}) +} + +profilePic() + +const getRepos = () => { + fetch(API_REPOS) + .then(response => response.json()) + .then(data => { + const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project-')) + + + 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) + // //console.log(data.user.login) + // // console.log(repo.owner.login) + // //const myPullRequest = data.filter((pull) => {return pull.user.login === repo.owner.login}) + // const myPullRequest = data.filter(pull => pull.user.login === repo.owner.login) + // const commitUrl = myPullRequest[0].commits_url + + // fetch(commitUrl) + // .then(res => res.json()) + // .then(data => { + // const numberCommit = data.length + + + + document.getElementById('projects').innerHTML += ` +
+

${repo.name}

+

Github Link +

Default branch: ${repo.default_branch}

+

Latest push: ${new Date(repo.pushed_at).toDateString()}

+ + +
` + }) + }) + } + + //}) + //} + + getRepos() \ No newline at end of file From cf7d6f526dbf05049781f01a2b4b5523002e1f5f Mon Sep 17 00:00:00 2001 From: JensBergqvist Date: Sun, 27 Feb 2022 20:55:59 +0100 Subject: [PATCH 2/5] Updated js --- code/script.js | 62 +++++++++++++++++++++++++++----------------------- 1 file changed, 33 insertions(+), 29 deletions(-) diff --git a/code/script.js b/code/script.js index b534b89a..29d95010 100644 --- a/code/script.js +++ b/code/script.js @@ -27,42 +27,46 @@ const getRepos = () => { fetch(API_REPOS) .then(response => response.json()) .then(data => { - const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project-')) + const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project')) 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) - // //console.log(data.user.login) - // // console.log(repo.owner.login) - // //const myPullRequest = data.filter((pull) => {return pull.user.login === repo.owner.login}) - // const myPullRequest = data.filter(pull => pull.user.login === repo.owner.login) - // const commitUrl = myPullRequest[0].commits_url - - // fetch(commitUrl) - // .then(res => res.json()) - // .then(data => { - // const numberCommit = data.length - - + projects.innerHTML += `
+

Repo name: ${repo.name}

 +

Default branch: ${repo.default_branch}

+

Last push: ${new Date(repo.pushed_at).toLocaleString()} +

Number of commits:

+ +
+ ` - document.getElementById('projects').innerHTML += ` -
-

${repo.name}

-

Github Link -

Default branch: ${repo.default_branch}

-

Latest push: ${new Date(repo.pushed_at).toDateString()}

- - -
` + }) + getPullRequest(forkedRepos) }) } - //}) - //} + const getPullRequest= (repos) => { + repos.forEach((repo)=> { + fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls?per_page=100`) + .then(response => response.json()) + .then(data => { + const myPullRequest = data.find((pull)=> pull.user.login === repo.owner.login) + if (myPullRequest) { + getCommits(myPullRequest.commits_url, repo.name) + } else { + document.getElementById(`${repo.name}`).innerHTML=`No pullrequest ` + } + }) + }) + } + + const getCommits=(commits, myRepoName) => { + fetch(commits) + .then(response => response.json) + .then(data =>{ + document.getElementById(`${myRepoName}`).innerHTML += data.length + }) + } getRepos() \ No newline at end of file From 503cbd559b720271fd43e6062fd11365c4fdff01 Mon Sep 17 00:00:00 2001 From: JensBergqvist Date: Sun, 27 Feb 2022 21:37:23 +0100 Subject: [PATCH 3/5] Added chart and some styling --- code/chart.js | 28 ++++++++++++++++++++++++++++ code/index.html | 1 + code/script.js | 8 +++++--- code/style.css | 7 ++++++- 4 files changed, 40 insertions(+), 4 deletions(-) diff --git a/code/chart.js b/code/chart.js index 92e85a30..f5c6a9a8 100644 --- a/code/chart.js +++ b/code/chart.js @@ -2,3 +2,31 @@ const ctx = document.getElementById('chart').getContext('2d') //"Draw" the chart here 👇 + +const drawChart = (ammount) => { + const config = { + type: "doughnut", + data: { + labels: [ + "My completed projects", "Projects left" + ], + datasets: [ + { + label: "Dataset", + data: [ammount, 19-ammount], + backgroundColor: ["rgb(255, 99, 132)", "rgb(100, 06, 130)"], + borderColor: "rgb(255, 98, 133)", + } + ] + } + } + const myChart = new Chart( + document.getElementById('chart'), + config + ); +} + + + + + \ No newline at end of file diff --git a/code/index.html b/code/index.html index 2fb5e0ae..81fd8d0a 100644 --- a/code/index.html +++ b/code/index.html @@ -6,6 +6,7 @@ Project GitHub Tracker +

GitHub Tracker

diff --git a/code/script.js b/code/script.js index 29d95010..79ae998f 100644 --- a/code/script.js +++ b/code/script.js @@ -14,7 +14,7 @@ const profilePic = () => { // console.log(data) picture = data.avatar_url let profilePicture = `
-

${username}

+

${username}

`; return (projects.innerHTML = profilePicture) @@ -34,7 +34,7 @@ const getRepos = () => { projects.innerHTML += `

Repo name: ${repo.name}

Default branch: ${repo.default_branch}

-

Last push: ${new Date(repo.pushed_at).toLocaleString()} +

Last push: ${new Date(repo.pushed_at).toDateString()}

Number of commits:

@@ -42,7 +42,9 @@ const getRepos = () => { }) - getPullRequest(forkedRepos) + + getPullRequest(forkedRepos) + drawChart(forkedRepos.length) }) } diff --git a/code/style.css b/code/style.css index 7c8ad447..73abe3b8 100644 --- a/code/style.css +++ b/code/style.css @@ -1,3 +1,8 @@ body { background: #FFECE9; -} \ No newline at end of file + font-family: Arial, Helvetica, sans-serif; + +} +.repo-card { + border-style: dotted; +} From 5ff431f26247d5595dceee6e12d613831a1a722a Mon Sep 17 00:00:00 2001 From: JensBergqvist Date: Mon, 28 Feb 2022 14:19:57 +0100 Subject: [PATCH 4/5] Final styling, not proud of it but too tired --- README.md | 6 ++---- code/index.html | 9 ++++++--- code/script.js | 6 ++---- code/style.css | 43 ++++++++++++++++++++++++++++++++++++++++--- 4 files changed, 50 insertions(+), 14 deletions(-) diff --git a/README.md b/README.md index 1613a3b0..5bb7722a 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,10 @@ # GitHub Tracker +This week we were asked to build a github tracker for our Technigo projects. -Replace this readme with your own information about your project. - -Start by briefly describing the assignment in a sentence or two. Keep it short and to the point. ## The problem +I had massive problems with showing my commits. Whenever I invoked the code to display it, several of my projects disappeared. I needed to make an if else statement to be able to display all the projects. -Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next? ## View it live diff --git a/code/index.html b/code/index.html index 81fd8d0a..33632eaa 100644 --- a/code/index.html +++ b/code/index.html @@ -1,6 +1,7 @@ + @@ -10,13 +11,15 @@

GitHub Tracker

-

Projects:

+
- +
+ +
- +
\ No newline at end of file diff --git a/code/script.js b/code/script.js index 79ae998f..eaf75e32 100644 --- a/code/script.js +++ b/code/script.js @@ -13,9 +13,7 @@ const profilePic = () => { .then(data => { // console.log(data) picture = data.avatar_url - let profilePicture = `
-

${username}

- + let profilePicture = `

${username}

`; return (projects.innerHTML = profilePicture) }) @@ -65,7 +63,7 @@ const getRepos = () => { const getCommits=(commits, myRepoName) => { fetch(commits) - .then(response => response.json) + .then(response => response.json()) .then(data =>{ document.getElementById(`${myRepoName}`).innerHTML += data.length }) diff --git a/code/style.css b/code/style.css index 73abe3b8..e472bffe 100644 --- a/code/style.css +++ b/code/style.css @@ -1,8 +1,45 @@ +* { + box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-font-smoothing: antialiased; + text-rendering: optimizeLegibility; +} + body { - background: #FFECE9; - font-family: Arial, Helvetica, sans-serif; + background: #39c440; + font-family:Verdana, Geneva, Tahoma, sans-serif; + display: flex; + flex-direction: column; + align-items: center; + max-height: 100vh } .repo-card { - border-style: dotted; + padding-left: 10px; + border-style: dashed; + +} + +h1 { + display: flex; + width: 100%; + margin: auto; + margin-top: 10%; + justify-content: center; + font-family:Verdana, Geneva, Tahoma, sans-serif +} + +.chart { + width: 50%; + height:50%; +} + +.profile { + justify-content: center; + } + +.photo { + width: 100% +} \ No newline at end of file From 29de60ab66f1ab7dc8c01fc47afca133b398cc65 Mon Sep 17 00:00:00 2001 From: JensBergqvist Date: Mon, 28 Feb 2022 14:26:31 +0100 Subject: [PATCH 5/5] Added netlify page --- README.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/README.md b/README.md index 5bb7722a..b31a0841 100644 --- a/README.md +++ b/README.md @@ -7,5 +7,4 @@ I had massive problems with showing my commits. Whenever I invoked the code to d ## View it live - -Every project should be deployed somewhere. Be sure to include the link to the deployed project so that the viewer can click around and see what it's all about. +https://brave-hopper-89f38f.netlify.app