From d1eed23eef0675facd3de6f039b08bd1bd3ddded Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Mon, 27 Sep 2021 12:41:15 +0200 Subject: [PATCH 01/11] Added API and fetched it --- code/index.html | 1 + code/script.js | 20 ++++++++++++++++++++ code/style.css | 3 ++- 3 files changed, 23 insertions(+), 1 deletion(-) diff --git a/code/index.html b/code/index.html index 2fb5e0ae..c81d8d46 100644 --- a/code/index.html +++ b/code/index.html @@ -10,6 +10,7 @@

GitHub Tracker

Projects:

+

diff --git a/code/script.js b/code/script.js index e69de29b..17fe400e 100644 --- a/code/script.js +++ b/code/script.js @@ -0,0 +1,20 @@ +const USER = 'Rosanna86' +const REPOS_URL = `https://api.github.com/users/${USER}/repos` +const projectContainer = document.getElementById('projects') + +const getRepos = () => { + fetch(REPOS_URL) + .then(response => response.json()) + .then(data => { + console.log(data) + const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('projects-')) + forkedRepos.forEach(repo => projectsContainer.innerHTML += `

${repo.name}

`) + +}) + + +} + + + +getRepos() \ No newline at end of file diff --git a/code/style.css b/code/style.css index 7c8ad447..095d8e75 100644 --- a/code/style.css +++ b/code/style.css @@ -1,3 +1,4 @@ body { background: #FFECE9; -} \ No newline at end of file +} + From b0c6295732684875a8b7c9736f3fad9732a1a9ac Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Tue, 28 Sep 2021 15:08:52 +0200 Subject: [PATCH 02/11] Added userProfile and PullRequests --- code/chart.js | 25 +++++++++++++++++ code/index.html | 13 ++++++++- code/script.js | 74 +++++++++++++++++++++++++++++++++++++++++++++---- 3 files changed, 105 insertions(+), 7 deletions(-) diff --git a/code/chart.js b/code/chart.js index 92e85a30..52eb144e 100644 --- a/code/chart.js +++ b/code/chart.js @@ -2,3 +2,28 @@ const ctx = document.getElementById('chart').getContext('2d') //"Draw" the chart here 👇 + + + +const drawChart = (amount) => { + const config = { + type: 'doughnut', + data: { + labels: [ + 'Finished projects', + 'Projects left', + ], + datasets: [{ + label: 'My First Dataset', + data: [amount,20-amount], + backgroundColor: [ + 'rgb(255, 99, 132)', + 'rgb(54, 162, 235)', + ], + hoverOffset: 4 + }] + }, + }; +} + +const myChart = new Chart(ctx, config); diff --git a/code/index.html b/code/index.html index c81d8d46..9d40921e 100644 --- a/code/index.html +++ b/code/index.html @@ -6,13 +6,24 @@ Project GitHub Tracker +

GitHub Tracker

Projects:

-
+ + + + + + + +
+
diff --git a/code/script.js b/code/script.js index 17fe400e..dfe1010f 100644 --- a/code/script.js +++ b/code/script.js @@ -1,20 +1,82 @@ const USER = 'Rosanna86' +const searchBtn = document.getElementById('repo-search') const REPOS_URL = `https://api.github.com/users/${USER}/repos` -const projectContainer = document.getElementById('projects') +const USER_URL = `https://api.github.com/users/${USER}` +const projectsContainer = document.getElementById('projects') +const userContainer = document.getElementById('myProfile') + +let repos; + +const userProfile = () => { + fetch(USER_URL) + .then(res => res.json()) + .then(data => { + console.log(data); + userContainer.innerHTML = ` +

Username: ${data.login}

+

Full name: ${data.name}

+

Location: ${data.location}

+ + ` + }) +} + +userProfile() + + const getRepos = () => { - fetch(REPOS_URL) + fetch(REPOS_URL, { + + }) .then(response => response.json()) .then(data => { console.log(data) - const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('projects-')) - forkedRepos.forEach(repo => projectsContainer.innerHTML += `

${repo.name}

`) + const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project-')) + repos = forkedRepos + forkedRepos.forEach(repo => projectsContainer.innerHTML += `

${repo.name}

`) + drawChart(forkedRepos.length) + getPullRequests(repos) + }) -}) +} +getRepos() + + +const getPullRequests = (repos) => { + repos.forEach(repo => { + console.log(repo) + fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls`, { + + }) + .then(res => res.json()) + .then(data => { + console.log(repo.name) + console.log(data) + const myPullRequest = data.filter((pull) => { + return pull.user.login === repo.owner.login + }) + console.log(myPullRequest) + }) + }) } +const getCommits = (repos) => { + repos.forEach(repo => { + fetch(myCommitsUrl) + .then(res => res.json()) + .then(data => { + console.log(data) + }) + + }) + + } + -getRepos() \ No newline at end of file + // searchBtn.addEventListener('click', () => { + // getRepos() + // }) \ No newline at end of file From c3aaf5dd38fdf1687c9a94d3c8cf94505d114e8d Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Tue, 28 Sep 2021 21:50:08 +0200 Subject: [PATCH 03/11] Added commits, inner HTML to style commits, updates, branches and urls. Began with CSS. --- code/chart.js | 4 +++- code/index.html | 25 ++++++++++++--------- code/script.js | 60 ++++++++++++++++++++++++++++++------------------- code/style.css | 19 ++++++++++++++++ 4 files changed, 73 insertions(+), 35 deletions(-) diff --git a/code/chart.js b/code/chart.js index 52eb144e..dec35369 100644 --- a/code/chart.js +++ b/code/chart.js @@ -24,6 +24,8 @@ const drawChart = (amount) => { }] }, }; + const myChart = new Chart(ctx,config); + } -const myChart = new Chart(ctx, config); + diff --git a/code/index.html b/code/index.html index 9d40921e..5ec64d08 100644 --- a/code/index.html +++ b/code/index.html @@ -1,5 +1,6 @@ + @@ -8,26 +9,28 @@ +

GitHub Tracker

Projects:

- - - - - - - -
+ + + + + + + +
- +
+ +
+ \ No newline at end of file diff --git a/code/script.js b/code/script.js index dfe1010f..45b93f72 100644 --- a/code/script.js +++ b/code/script.js @@ -7,10 +7,11 @@ const userContainer = document.getElementById('myProfile') let repos; +//profile image and info const userProfile = () => { fetch(USER_URL) - .then(res => res.json()) - .then(data => { + .then(res => res.json()) + .then(data => { console.log(data); userContainer.innerHTML = `

Username: ${data.login}

@@ -23,18 +24,15 @@ const userProfile = () => { userProfile() - - const getRepos = () => { fetch(REPOS_URL, { - + }) .then(response => response.json()) .then(data => { - console.log(data) + //console.log(data) const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project-')) repos = forkedRepos - forkedRepos.forEach(repo => projectsContainer.innerHTML += `

${repo.name}

`) drawChart(forkedRepos.length) getPullRequests(repos) }) @@ -42,38 +40,54 @@ const getRepos = () => { } getRepos() - +//function to get the repos const getPullRequests = (repos) => { repos.forEach(repo => { - console.log(repo) - fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls`, { - + //console.log(repo) + fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls?per_page=100`, { //added 100 (was 30) + }) .then(res => res.json()) .then(data => { - console.log(repo.name) - console.log(data) + //console.log(repo.name) + //console.log(data) const myPullRequest = data.filter((pull) => { return pull.user.login === repo.owner.login }) console.log(myPullRequest) - + if (myPullRequest.length === 0){ + return + } + getCommits(myPullRequest[0].commits_url,(data) => { + const numberOfCommits = data.length + //added function so the DOM do not self close tags + let boxHtml = '
'; // https://stackoverflow.com/questions/46300108/innerhtml-closes-tags + boxHtml += `

${repo.name}

` + boxHtml += `

Number of commits ${numberOfCommits}

` + boxHtml += `

Last update (push) ${repo.pushed_at}

` + boxHtml += `

Default branch ${repo.default_branch}

` + boxHtml += `

Go to repo

` + boxHtml += '
' + projectsContainer.innerHTML += boxHtml; //closing the div tag + }) }) - }) } -const getCommits = (repos) => { - repos.forEach(repo => { - fetch(myCommitsUrl) +//get my commits +const getCommits = (url, callbackFunction) => { + //console.log(url) + fetch(url) .then(res => res.json()) .then(data => { - console.log(data) + callbackFunction (data) + + //console.log(data.length) }) - - }) - - } +} + + + diff --git a/code/style.css b/code/style.css index 095d8e75..8f291d24 100644 --- a/code/style.css +++ b/code/style.css @@ -2,3 +2,22 @@ body { background: #FFECE9; } +.grid-container { + display: grid; + grid-template-columns: repeat(12, 1fr); + grid-column: span 12; +} + +.box-repo { + display: grid; + grid-column: span 6; + column-gap: 1em; + row-gap: 1em; +} + + +.chart { + width: 100px; + height: 100px; +} + From dc1601ead31d1f85a66387625be3856e605a2dfb Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Tue, 28 Sep 2021 23:13:20 +0200 Subject: [PATCH 04/11] Added CSS grids to design --- code/index.html | 15 +++++++++++---- code/script.js | 2 +- code/style.css | 35 +++++++++++++++++++++++++++++++---- 3 files changed, 43 insertions(+), 9 deletions(-) diff --git a/code/index.html b/code/index.html index 5ec64d08..e9f20f2f 100644 --- a/code/index.html +++ b/code/index.html @@ -6,20 +6,27 @@ Project GitHub Tracker + + + - -

GitHub Tracker

+ +
+

GitHub Tracker

+

Projects:

+
+ - +
diff --git a/code/script.js b/code/script.js index 45b93f72..f087ce1c 100644 --- a/code/script.js +++ b/code/script.js @@ -61,7 +61,7 @@ const getPullRequests = (repos) => { getCommits(myPullRequest[0].commits_url,(data) => { const numberOfCommits = data.length //added function so the DOM do not self close tags - let boxHtml = '
'; // https://stackoverflow.com/questions/46300108/innerhtml-closes-tags + let boxHtml = `
`; // https://stackoverflow.com/questions/46300108/innerhtml-closes-tags boxHtml += `

${repo.name}

` boxHtml += `

Number of commits ${numberOfCommits}

` boxHtml += `

Last update (push) ${repo.pushed_at}

` diff --git a/code/style.css b/code/style.css index 8f291d24..97838199 100644 --- a/code/style.css +++ b/code/style.css @@ -1,5 +1,21 @@ body { - background: #FFECE9; + margin: 0; + padding: 0; + font-family: 'Barlow', sans-serif; +} + +img { + max-width: 100%; +} + +.header { +display: grid; +grid-column: span 12; +} + +.main-grid { + display: grid; + grid-template-columns: repeat(12, 1fr); } .grid-container { @@ -8,16 +24,27 @@ body { grid-column: span 12; } + .box-repo { + padding: 10px; + background-color: rgb(123, 160, 148); display: grid; - grid-column: span 6; - column-gap: 1em; - row-gap: 1em; + grid-column: span 12; + border-radius: 15px 35px; } +.header h1 { + font-size: 30px; +} .chart { + display: grid; + grid-column: span 12; width: 100px; height: 100px; } +.my-profile { + display: grid; + grid-column: span 12; +} \ No newline at end of file From c053120e623ac6a4ca6c8702210a7f23446c0088 Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Wed, 29 Sep 2021 22:35:49 +0200 Subject: [PATCH 05/11] CSS Styling. Adding charts. --- code/assets/github_tracker_icon.png | Bin 0 -> 7807 bytes code/chart.js | 48 ++++++--- code/index.html | 11 +- code/script.js | 63 ++++++------ code/style.css | 152 +++++++++++++++++++++++++--- 5 files changed, 212 insertions(+), 62 deletions(-) create mode 100644 code/assets/github_tracker_icon.png diff --git a/code/assets/github_tracker_icon.png b/code/assets/github_tracker_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..58fdf191d48229fed6f96b5c372944946a4e7757 GIT binary patch literal 7807 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 literal 0 HcmV?d00001 diff --git a/code/chart.js b/code/chart.js index dec35369..bff5d24b 100644 --- a/code/chart.js +++ b/code/chart.js @@ -5,27 +5,47 @@ const ctx = document.getElementById('chart').getContext('2d') -const drawChart = (amount) => { +// const drawChart = (amount) => { +// const config = { +// type: 'doughnut', +// data: { +// labels: [ +// 'HTML', +// 'CSS', +// 'JavaScript' +// ], +// datasets: [{ +// label: 'My First Dataset', +// data: [amount, 20 - amount], +// backgroundColor: [ +// 'rgb(255, 99, 132)', +// 'rgb(54, 162, 235)', +// 'rgb(54, 180, 235)', +// ], +// hoverOffset: 4 +// }] +// }, +// }; +// const myChart = new Chart(ctx, config); + +// } + + +const drawChartforRepo = (languages, element) => { const config = { type: 'doughnut', data: { - labels: [ - 'Finished projects', - 'Projects left', - ], + labels: Object.keys(languages), datasets: [{ - label: 'My First Dataset', - data: [amount,20-amount], - backgroundColor: [ - 'rgb(255, 99, 132)', - 'rgb(54, 162, 235)', - ], - hoverOffset: 4 + label: '# Frecuencies Words', + data: Object.keys(languages).map(function (key) { return languages[key]; }), + borderWidth: 1 }] - }, + } }; - const myChart = new Chart(ctx,config); + return new Chart(element, config); } + diff --git a/code/index.html b/code/index.html index e9f20f2f..e8cea0be 100644 --- a/code/index.html +++ b/code/index.html @@ -15,11 +15,8 @@
-

GitHub Tracker

- -

Projects:

-

-
+ + @@ -28,9 +25,11 @@

--> +
+
+
-
diff --git a/code/script.js b/code/script.js index f087ce1c..b56e2c12 100644 --- a/code/script.js +++ b/code/script.js @@ -1,39 +1,42 @@ const USER = 'Rosanna86' +const userContainer = document.getElementById('myProfile') const searchBtn = document.getElementById('repo-search') const REPOS_URL = `https://api.github.com/users/${USER}/repos` const USER_URL = `https://api.github.com/users/${USER}` const projectsContainer = document.getElementById('projects') -const userContainer = document.getElementById('myProfile') +const ldsripple = document.getElementById('loading') +const Auth = { headers: { authorization: '' } } +let charts =[]; let repos; + //profile image and info const userProfile = () => { - fetch(USER_URL) + fetch(USER_URL, Auth) .then(res => res.json()) .then(data => { console.log(data); userContainer.innerHTML = ` -

Username: ${data.login}

-

Full name: ${data.name}

-

Location: ${data.location}

- - ` +
+

${data.name}

+

@${data.login}

+

${data.location}

+
+
+
` }) } userProfile() const getRepos = () => { - fetch(REPOS_URL, { - - }) + fetch(REPOS_URL, Auth) .then(response => response.json()) .then(data => { //console.log(data) const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project-')) repos = forkedRepos - drawChart(forkedRepos.length) getPullRequests(repos) }) @@ -43,32 +46,37 @@ getRepos() //function to get the repos const getPullRequests = (repos) => { repos.forEach(repo => { - //console.log(repo) - fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls?per_page=100`, { //added 100 (was 30) - - }) + fetch(`https://api.github.com/repos/Technigo/${repo.name}/pulls?per_page=100`, Auth) //added 100 (was 30) .then(res => res.json()) .then(data => { - //console.log(repo.name) - //console.log(data) const myPullRequest = data.filter((pull) => { return pull.user.login === repo.owner.login }) console.log(myPullRequest) - if (myPullRequest.length === 0){ + if (myPullRequest.length === 0) { return - } - getCommits(myPullRequest[0].commits_url,(data) => { + } + getCommits(myPullRequest[0].commits_url, (data) => { const numberOfCommits = data.length //added function so the DOM do not self close tags let boxHtml = `
`; // https://stackoverflow.com/questions/46300108/innerhtml-closes-tags + boxHtml += `
` boxHtml += `

${repo.name}

` - boxHtml += `

Number of commits ${numberOfCommits}

` - boxHtml += `

Last update (push) ${repo.pushed_at}

` - boxHtml += `

Default branch ${repo.default_branch}

` + boxHtml += `

Number of commits: ${numberOfCommits}

` + boxHtml += `

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

` + boxHtml += `

Default branch: ${repo.default_branch}

` boxHtml += `

Go to repo

` - boxHtml += '
' + boxHtml += `
` + boxHtml += `
` + boxHtml += `
` projectsContainer.innerHTML += boxHtml; //closing the div tag + ldsripple.style.display = 'none' //loading icon + fetch(repo.languages_url, Auth) + .then(res => res.json()) + .then(data => { + const chartElement = document.getElementById('chart-'+repo.name) + charts.push(drawChartforRepo(data, chartElement)); + }) }) }) }) @@ -76,13 +84,10 @@ const getPullRequests = (repos) => { //get my commits const getCommits = (url, callbackFunction) => { - //console.log(url) - fetch(url) + fetch(url, Auth) .then(res => res.json()) .then(data => { - callbackFunction (data) - - //console.log(data.length) + callbackFunction(data) }) } diff --git a/code/style.css b/code/style.css index 97838199..bfc7a249 100644 --- a/code/style.css +++ b/code/style.css @@ -1,16 +1,23 @@ body { + background-color: #f0f0f0; margin: 0; padding: 0; font-family: 'Barlow', sans-serif; } -img { - max-width: 100%; +.header { + background-color: #7aa094; + display: grid; + grid-column: span 12; + justify-content: center; } -.header { -display: grid; -grid-column: span 12; +.icon_header { + padding: 10px 0px 10px 0px; + height: 50px; + display: inline; + display: grid; + grid-column: span 8/12; } .main-grid { @@ -22,29 +29,148 @@ grid-column: span 12; display: grid; grid-template-columns: repeat(12, 1fr); grid-column: span 12; + column-gap: 10px; + row-gap: 10px; } +.my-profile { + background-color: #f0f0f0; + display: grid; + grid-template-columns: repeat(12, 1fr); + grid-column: span 12; + border-radius: 25px 0px; + margin: 15px 0px 15px 0px; +} + +.profileinfo { + background-color: #f0f0f0; + grid-column: span 1/3; +} + +.profileimg { + grid-column: span 9/13; +} + +.profileimg img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 25px 0px; +} .box-repo { padding: 10px; - background-color: rgb(123, 160, 148); + background-color: #7aa094; display: grid; + grid-template-columns: repeat(12, 1fr); grid-column: span 12; - border-radius: 15px 35px; + border-radius: 25px 0px; +} + +.box-repo-left { + grid-column: 1/8; +} + +.box-repo-right { + grid-column: 9/12; } -.header h1 { - font-size: 30px; +.box-repo p { + margin-block-start: 0em; + margin-block-end: 0.2em; + font-size: 17px; } -.chart { +.box-repo-left h3 { + margin-block-start: 0.2em; + margin-block-end: 0.3em; + font-size: 25px; +} + +.box-repo-left a { + color: #fff; + text-decoration: none; + cursor: pointer; + font-size: 20px; +} + +.chartrepos { display: grid; - grid-column: span 12; - width: 100px; - height: 100px; + grid-column: 4/7; + width: 200px; + height: 200px; } .my-profile { display: grid; grid-column: span 12; +} + +/*Loading icon*/ + +.lds-ripple { + position: relative; + display: grid; + grid-column: 6/8; + width: 80px; + height: 80px; +} + +.lds-ripple div { + position: absolute; + border: 4px solid #7aa094; + opacity: 1; + border-radius: 50%; + animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite; +} + +.lds-ripple div:nth-child(2) { + animation-delay: -0.5s; +} + +@keyframes lds-ripple { + 0% { + top: 36px; + left: 36px; + width: 0; + height: 0; + opacity: 1; + } + 100% { + top: 0px; + left: 0px; + width: 72px; + height: 72px; + opacity: 0; + } +} + +/* tablet */ + +@media (min-width: 768px) { + .box-repo { + display: grid; + grid-column: span 6; + column-gap: 10px; + row-gap: 10px; + border-radius: 25px; + } +} + +/* desktop */ + +@media (min-width: 992px) { + .box-repo { + display: grid; + grid-column: span 6; + column-gap: 10px; + row-gap: 10px; + border-radius: 25px; + } + .profileimg img { + max-width: 500px; + max-height: 500px; + object-fit: cover; + border-radius: 25px 0px; + } } \ No newline at end of file From a3d8bbadf67e490b4717f571daf457b0934ca6fb Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Thu, 30 Sep 2021 21:49:16 +0200 Subject: [PATCH 06/11] Added more CSS, input-field and made it responsive and searchable --- code/style.css | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) diff --git a/code/style.css b/code/style.css index bfc7a249..a90e6496 100644 --- a/code/style.css +++ b/code/style.css @@ -20,6 +20,37 @@ body { grid-column: span 8/12; } +.search-container { + display: grid; + grid-template-columns: repeat(12, 1fr); + grid-column: span 12; +} + +.input-field { + padding: 10px 20px; + border-radius: 15px; + font-size: 15px; + color: #7aa094; + border: 1px solid #7aa094; + font-family: 'Barlow', sans-serif; +} + +.button-search { + float: right; + padding: 10px 20px; + border-radius: 15px; + background-color: #7aa094; + color: #fff; + font-size: 15px; + border: 1px solid #7aa094; + font-family: 'Barlow', sans-serif; +} + +.search-button:hover { + background-color: #7aa094; + color: #7aa094; +} + .main-grid { display: grid; grid-template-columns: repeat(12, 1fr); From 214bbe8924510f4b1072509b27a3a3c9d8bdf786 Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Thu, 30 Sep 2021 21:53:30 +0200 Subject: [PATCH 07/11] Added more CSS, input-field and made it responsive and searchable --- code/chart.js | 65 ++++++++++----------- code/index.html | 15 +++-- code/script.js | 34 +++++------ code/style.css | 151 +++++++++++++++++++++++++++++++++++------------- 4 files changed, 161 insertions(+), 104 deletions(-) diff --git a/code/chart.js b/code/chart.js index bff5d24b..3c4a4809 100644 --- a/code/chart.js +++ b/code/chart.js @@ -5,47 +5,40 @@ const ctx = document.getElementById('chart').getContext('2d') -// const drawChart = (amount) => { -// const config = { -// type: 'doughnut', -// data: { -// labels: [ -// 'HTML', -// 'CSS', -// 'JavaScript' -// ], -// datasets: [{ -// label: 'My First Dataset', -// data: [amount, 20 - amount], -// backgroundColor: [ -// 'rgb(255, 99, 132)', -// 'rgb(54, 162, 235)', -// 'rgb(54, 180, 235)', -// ], -// hoverOffset: 4 -// }] -// }, -// }; -// const myChart = new Chart(ctx, config); - -// } - - -const drawChartforRepo = (languages, element) => { +const drawChart = (amount) => { const config = { type: 'doughnut', data: { - labels: Object.keys(languages), + labels: [ + 'Finished projects', + 'Projects left', + ], datasets: [{ - label: '# Frecuencies Words', - data: Object.keys(languages).map(function (key) { return languages[key]; }), - borderWidth: 1 + label: 'My First Dataset', + data: [amount, 20 - amount], + backgroundColor: [ + '#a07a99', + '#a7c0b8', + ], + + + hoverOffset: 4 }] + }, + options: { + layout: { + padding: 25 + }, + plugins: { + legend: { + labels: { + font: { + size: 15 + } + } + } + } } }; - return new Chart(element, config); - + const myChart = new Chart(ctx, config); } - - - diff --git a/code/index.html b/code/index.html index e8cea0be..e04cb010 100644 --- a/code/index.html +++ b/code/index.html @@ -15,16 +15,15 @@
- +

GitHub Tracker

+
+
+ + +
+
- - - -
diff --git a/code/script.js b/code/script.js index b56e2c12..df5ea709 100644 --- a/code/script.js +++ b/code/script.js @@ -1,13 +1,13 @@ const USER = 'Rosanna86' const userContainer = document.getElementById('myProfile') -const searchBtn = document.getElementById('repo-search') +const searchField = document.getElementById('search-field') +const searchForm = document.getElementById('search-form') const REPOS_URL = `https://api.github.com/users/${USER}/repos` const USER_URL = `https://api.github.com/users/${USER}` const projectsContainer = document.getElementById('projects') const ldsripple = document.getElementById('loading') const Auth = { headers: { authorization: '' } } -let charts =[]; let repos; @@ -20,7 +20,7 @@ const userProfile = () => { userContainer.innerHTML = `

${data.name}

-

@${data.login}

+ @${data.login}

${data.location}

@@ -38,6 +38,7 @@ const getRepos = () => { const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project-')) repos = forkedRepos getPullRequests(repos) + drawChart(forkedRepos.length) }) } @@ -45,6 +46,7 @@ getRepos() //function to get the repos const getPullRequests = (repos) => { + projectsContainer.innerHTML = ''; repos.forEach(repo => { fetch(`https://api.github.com/repos/Technigo/${repo.name}/pulls?per_page=100`, Auth) //added 100 (was 30) .then(res => res.json()) @@ -52,7 +54,6 @@ const getPullRequests = (repos) => { const myPullRequest = data.filter((pull) => { return pull.user.login === repo.owner.login }) - console.log(myPullRequest) if (myPullRequest.length === 0) { return } @@ -60,23 +61,14 @@ const getPullRequests = (repos) => { const numberOfCommits = data.length //added function so the DOM do not self close tags let boxHtml = `
`; // https://stackoverflow.com/questions/46300108/innerhtml-closes-tags - boxHtml += `
` boxHtml += `

${repo.name}

` boxHtml += `

Number of commits: ${numberOfCommits}

` boxHtml += `

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

` boxHtml += `

Default branch: ${repo.default_branch}

` boxHtml += `

Go to repo

` - boxHtml += `
` - boxHtml += `
` - boxHtml += `
` + boxHtml += '
' projectsContainer.innerHTML += boxHtml; //closing the div tag ldsripple.style.display = 'none' //loading icon - fetch(repo.languages_url, Auth) - .then(res => res.json()) - .then(data => { - const chartElement = document.getElementById('chart-'+repo.name) - charts.push(drawChartforRepo(data, chartElement)); - }) }) }) }) @@ -91,11 +83,11 @@ const getCommits = (url, callbackFunction) => { }) } +//eventlistener on form-submit +searchForm.addEventListener('submit', (e) => { + e.preventDefault(); - - - - - // searchBtn.addEventListener('click', () => { - // getRepos() - // }) \ No newline at end of file + // this function filters your repos where name contains searchField.value. Where IndexOf returns the position of substring and -1 = doesn't exist in string + const found = repos.filter(r => r.name.indexOf(searchField.value) > -1); + getPullRequests(found); +}) \ No newline at end of file diff --git a/code/style.css b/code/style.css index a90e6496..71e76365 100644 --- a/code/style.css +++ b/code/style.css @@ -12,6 +12,19 @@ body { justify-content: center; } +.header-text { + color: #fff; + display: grid; + grid-column: span 2/8; + font-weight: 300; + font-size: 25px; +} + +form#search-form { + grid-column: span 12; + margin-bottom: 10px; +} + .icon_header { padding: 10px 0px 10px 0px; height: 50px; @@ -21,34 +34,39 @@ body { } .search-container { - display: grid; grid-template-columns: repeat(12, 1fr); grid-column: span 12; } .input-field { + margin: 7px 0px 8px 0px; + grid-column: 1/12; padding: 10px 20px; border-radius: 15px; font-size: 15px; color: #7aa094; border: 1px solid #7aa094; font-family: 'Barlow', sans-serif; + font-weight: 500; } .button-search { - float: right; + margin: 7px 0px 7px 0px; + grid-column: 2/4; padding: 10px 20px; border-radius: 15px; - background-color: #7aa094; color: #fff; + background-color: #56786d; font-size: 15px; border: 1px solid #7aa094; font-family: 'Barlow', sans-serif; + font-weight: 500; } -.search-button:hover { - background-color: #7aa094; - color: #7aa094; +.button-search:hover { + color: #364b45; + background-color: #56786d; + font-weight: 500; } .main-grid { @@ -75,11 +93,16 @@ body { .profileinfo { background-color: #f0f0f0; - grid-column: span 1/3; + grid-column: span 2/4; +} + +.profileinfo a { + color: black; + text-decoration: none; } .profileimg { - grid-column: span 9/13; + grid-column: 6/12; } .profileimg img { @@ -93,43 +116,38 @@ body { padding: 10px; background-color: #7aa094; display: grid; - grid-template-columns: repeat(12, 1fr); grid-column: span 12; border-radius: 25px 0px; } -.box-repo-left { - grid-column: 1/8; -} - -.box-repo-right { - grid-column: 9/12; -} - .box-repo p { + text-align:center; margin-block-start: 0em; margin-block-end: 0.2em; - font-size: 17px; + font-size: 15px; } -.box-repo-left h3 { +.box-repo h3 { + text-align:center; margin-block-start: 0.2em; margin-block-end: 0.3em; - font-size: 25px; + font-size: 22px; } -.box-repo-left a { +.box-repo a { + text-align:center; color: #fff; text-decoration: none; cursor: pointer; font-size: 20px; } -.chartrepos { + +.chart { + grid-column: span 12; + max-width: 100%; + max-height: 500px; display: grid; - grid-column: 4/7; - width: 200px; - height: 200px; } .my-profile { @@ -180,28 +198,83 @@ body { @media (min-width: 768px) { .box-repo { - display: grid; grid-column: span 6; - column-gap: 10px; - row-gap: 10px; - border-radius: 25px; + border-radius: 20px; } + + .chart { + grid-column: 4/10; + } + + .my-profile { + grid-template-areas: ". info ." + ". image ."; + grid-template-columns: 4fr 4fr 4fr; + } + + .profileimg { + grid-area: image; + } + + .profileimg img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 20px; + } + + .profileinfo { + grid-column: span 5/11; + grid-area: info; + } + + .profileinfo h2 { + margin-block-start: 0.2em; + margin-block-end: 0.2em; + } + + .profileinfo p { + margin-block-start: 0.3em; + } + } /* desktop */ - @media (min-width: 992px) { - .box-repo { + + + .header { + background-color: #7aa094; display: grid; - grid-column: span 6; - column-gap: 10px; - row-gap: 10px; - border-radius: 25px; + grid-column: span 12; + } + + .my-profile { + grid-template-areas: ". info image"; + grid-template-columns: 3fr 3fr 3fr 3fr; } + + .profileinfo { + text-align: right; + padding-right: 10px; + } + + .profileimg { + grid-area: image; + } + .profileimg img { - max-width: 500px; - max-height: 500px; - object-fit: cover; - border-radius: 25px 0px; + max-height: 200px; + + } + + .box-repo { + grid-column: span 4; + border-radius: 20px; } + + .grid-container { + grid-column: 2/12; + } + } \ No newline at end of file From c3c1e44e918509fdf111f3c70c3e9da7983aab9e Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Thu, 30 Sep 2021 21:57:11 +0200 Subject: [PATCH 08/11] removed token --- code/script.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/code/script.js b/code/script.js index df5ea709..1f1142d2 100644 --- a/code/script.js +++ b/code/script.js @@ -6,7 +6,7 @@ const REPOS_URL = `https://api.github.com/users/${USER}/repos` const USER_URL = `https://api.github.com/users/${USER}` const projectsContainer = document.getElementById('projects') const ldsripple = document.getElementById('loading') -const Auth = { headers: { authorization: '' } } +const Auth = { } let repos; From 0bf723bc74545ce1512f84693b180c5a3c9dbc67 Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Fri, 1 Oct 2021 11:36:36 +0200 Subject: [PATCH 09/11] Cleaned up my code and updated Readme file --- README.md | 23 +++++++++++++++++------ code/assets/github_tracker_icon.png | Bin 7807 -> 0 bytes code/script.js | 5 +---- code/style.css | 14 +++++++------- 4 files changed, 25 insertions(+), 17 deletions(-) delete mode 100644 code/assets/github_tracker_icon.png diff --git a/README.md b/README.md index 1613a3b0..0c4d63f7 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,24 @@ -# GitHub Tracker +# Project: GitHub-tracker -Replace this readme with your own information about your project. +This week, we want you to create a place to keep track of the GitHub repos that you're using here at Technigo. -Start by briefly describing the assignment in a sentence or two. Keep it short and to the point. +## How did I do it? +I started the project by going through the material and videos. I really struggled mentally this week. So I decided early on that I will focus on blue level. -## The problem +What I learned: +* This week it was a lot of JS and API requests. I have learned about fetch, API:S, finding info in an API and filtering. And how to add a gitHub token so you have limitless requests.👩‍💻 -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? +* This week I had a problem to understand the connection between the code. I really had to narrow in all down to small small small pieces. BUT after Maks Wednesday live session I got more of a hang of it, the cheese sandwich comparison really made it more clear to me. + +## When I hit a dead end or a problem +When a problem arose, I either googled, used stack-overflow or Chrome dev-tools. And I have talked a lot to my fellow Zebra colleagues. And I also had a 1:1 call support with Maks 🙌🏻 + +My own reflection +This week was really intense and I had a really big problem mentally. But in the end I solved everything and my page turned out alright 🙂 ## View it live +Here it is: https://rosanna-github-tracker.netlify.app/ -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. +## Sources and inspiration +https://developer.chrome.com/docs/devtools/javascript/ +https://stackoverflow.com/c/technigo/questions/2917 diff --git a/code/assets/github_tracker_icon.png b/code/assets/github_tracker_icon.png deleted file mode 100644 index 58fdf191d48229fed6f96b5c372944946a4e7757..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 7807 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 diff --git a/code/script.js b/code/script.js index 1f1142d2..b322e61a 100644 --- a/code/script.js +++ b/code/script.js @@ -6,17 +6,15 @@ const REPOS_URL = `https://api.github.com/users/${USER}/repos` const USER_URL = `https://api.github.com/users/${USER}` const projectsContainer = document.getElementById('projects') const ldsripple = document.getElementById('loading') -const Auth = { } +const Auth = { headers: { authorization: 'token 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' } } let repos; - //profile image and info const userProfile = () => { fetch(USER_URL, Auth) .then(res => res.json()) .then(data => { - console.log(data); userContainer.innerHTML = `

${data.name}

@@ -34,7 +32,6 @@ const getRepos = () => { fetch(REPOS_URL, Auth) .then(response => response.json()) .then(data => { - //console.log(data) const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project-')) repos = forkedRepos getPullRequests(repos) diff --git a/code/style.css b/code/style.css index 71e76365..2c3451fa 100644 --- a/code/style.css +++ b/code/style.css @@ -5,6 +5,7 @@ body { font-family: 'Barlow', sans-serif; } +/*header*/ .header { background-color: #7aa094; display: grid; @@ -33,6 +34,7 @@ form#search-form { grid-column: span 8/12; } +/*search field*/ .search-container { grid-template-columns: repeat(12, 1fr); grid-column: span 12; @@ -69,6 +71,7 @@ form#search-form { font-weight: 500; } +/*main grid*/ .main-grid { display: grid; grid-template-columns: repeat(12, 1fr); @@ -82,6 +85,7 @@ form#search-form { row-gap: 10px; } +/*profile*/ .my-profile { background-color: #f0f0f0; display: grid; @@ -112,6 +116,7 @@ form#search-form { border-radius: 25px 0px; } +/*repos*/ .box-repo { padding: 10px; background-color: #7aa094; @@ -142,7 +147,7 @@ form#search-form { font-size: 20px; } - +/*chart*/ .chart { grid-column: span 12; max-width: 100%; @@ -150,13 +155,8 @@ form#search-form { display: grid; } -.my-profile { - display: grid; - grid-column: span 12; -} /*Loading icon*/ - .lds-ripple { position: relative; display: grid; @@ -194,8 +194,8 @@ form#search-form { } } -/* tablet */ +/* tablet */ @media (min-width: 768px) { .box-repo { grid-column: span 6; From 529738ed7092b44d162b597aa53f586b73b81a9d Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Fri, 1 Oct 2021 11:40:55 +0200 Subject: [PATCH 10/11] Added favicon --- code/assets/github_tracker_icon.png | Bin 0 -> 7807 bytes code/index.html | 3 ++- code/script.js | 2 +- 3 files changed, 3 insertions(+), 2 deletions(-) create mode 100644 code/assets/github_tracker_icon.png diff --git a/code/assets/github_tracker_icon.png b/code/assets/github_tracker_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..58fdf191d48229fed6f96b5c372944946a4e7757 GIT binary patch literal 7807 zcmbW62U8PH)b2y*ARy9|u2Mn?Akv$mOONzk4WTO~^cFyh2r2}SYAl4%dk=_zDbfW3 zp_gE2p(`RF`f~5wxgX%&nVp?IGyD9`mf5qjCk<+<&&0sZ0001(3?Ay30{|4Ds|ul` zxw5dJ*QBnRTOqo(Ar?PuyXG2L5hvm^sYtaYW!CObr0wziptSX&FAh zTYQOFXgN*UF8SkvNN8ZwS)m^?zK%$cVY4g|9HKH5d8LY6r2l9Pfdk9gz7_X8AZ}JB zV<@`Qq{AahfJ9e_LiptFr=ogF5I{9`H(z7JVBq$olgFH zc^uo_-mYx%As&J>@XPHhjO^pn_~m^BA~2+L8pj0=ORiH@vGet=Ns{=<4+Xx1Z~~2kGS)kMcgF)exM!h zc<3~smq^}i(3l%_p7uU^?puiB{DjzsOaxn> zR+4qbE!O=XS)A_JPg9MAc?cnAP%bdUr~7uH6J()@mwhWMCO=1{<}PEB9!--7Tgn_s zRfswlbcgMACaJ-jFWi-#9AdS1!NtGlz`gH>>#zW1fi+rW8$v*>(7di#9Ik<@*KX5? z9wv)>nb^3=^i_6rgmazlc*Wq*PnFZhE**Z#UO1=e$mMj}baRnBIajJ1mO6L$(It%q z?<~nu)AmDA1sb!DHSKN*g$*Xi358%dQQ*B-whpFHr^)+07}LlOOm=3D=PEkgxA#Wwxm{!CQ8|hqsL&aacLFcpxSuVF2-HP8UN0}H zSwWKSyEbxIaa7_+TRbTuP~oGoi~b)XoE1fL8c#LRHA~q2LC;DzL!@k5cYDTXc*H(W zl^C7D$57^+2zF$U!AC>u6$)R5Xs+^R4-%gV`q~{tLqw?Y%%A2Av%UQ7#CGl-%=&+p zqCepMoLKX!%^i~i5&n-Yd{yO1{FK4+_zvEJY#}cZ=DffVq--jF`E`f4ugR0Gd#;JD z!WuAcGhyhllU3zo@$9CuEdQT*(&?q(jd>@fJHW}E{x&d_xH`W1IyX& zP_Mp*hHar z_)))8fvZ@L6?bl}(NIM2;#4@hdzwD#=UABBz)Af5^*WbXDs9rxv#rBVJDQ2sXsGMg z;Iyx|LA_)@mys6#ukHp%qTmCE&H&l4SG!(nrBjv~EwwL&{xI_@Kkw7cnU(B3p)IU=>LnbOGNy@b5YC#WX25`4WIlr2!v7|Qf z6l{;(bx3>FcYIJR(P$Z*mi+-}rT*0I;E}2s_xvuWeBDY_Z9#WsGHuC1fbOWU>D5X3 zykw^4b6~PSTMMO*GC3auPPwWacuFm}n+671q2;U*8+L^&tS^H$-C%_0>7LKeKc%QQ zD#sN#$nbGuOKYc&zzG}6{T~8&qixNST`mtcHa6aoFS^3T?yJ}Q z*{=bO4=7WKM>-!^_Z8@jsu*)$HIbBK4wL;3jq~cnjGUQ;aL;Z-H5?vI(kd`r z3jV$v*^GveIW11|+Y&oD_06Ibg)<;$aNR+{1tH@x0j>iheU)o(!ji`K-$BmYb<VgrnA5S-KioJwZOl;0H2&f_Hh5iZPaC9L*u}K)j{{mw7L^lVxQdXcoHc6u>0|$N$co4Ht*DuADeJf8&5?L|! z2gA9v&~W<%wxW=Umw`UB{p5e>OXF1qf}kZ^ z-+LA>iQ5@Pm_&QWWW16SlJ&TX<*>lHP>W5vH2F^fbn3e)iyf`EsZ$PV1fjXP{>r*= zaQjoleP7W))ph!}Zgu)tN+8MbtfAhqWO7^c%yQ<2HM<}*mflk3aUHG{1S9n4(zLu+ zXbK7AIfT*3&2?boJ zy8p$$y}GzNiePJY>0Z^a9v>eru2XOzx=3PXtDT@^WA^3M9q3qY@Pdci*}N{fT_ohQ zDQ#}S>DkoNs_P*5(DaO!cxOO4nSzwO8m#d{e`;P*Nv+FGaY?5K86#n+k9;7HqA1S1`aDR<%(l47`)wjcN z#p4lT!NF2Wkfnu*VMg=JdSSfW5W5X@AS2E@7+F|YctLdIPmdExCa>IQ$FUb1UOGCa zwH_bnjs|-VE1w5O<09igB~$HRHa~IH4zC`+^LKcP`eX!)nF!5E4XaY5^0|ZTkmeup z7)YsN!?KhV75%L&|I1y4wRQG55_JFRv^?GytjhemB^<9ed{w`=e@biW^N=D1d^ z>9?adtG~bf5%cT7W)O5Xi zFs&hg;>Zly&Lh$S7T6V$rA^5H99($8Y29EJ;QTn~$8~Ik@xlN%tDSu5AEV3{Vsx>g zvt3Adch29-&VvBwpK28E_88@;RhMx8GIP2={>=+D^E13@Oo_d_;)LT$!%_Tv23F;r zJ#+nK_9ZLA`hg|`3U$d2<@MSA?;XPfYV0F{4{M&{{G`ZL+JVVWU7Vo6AI95!GbnW> zWR@*{pde*Rw`iF)>iD@U5t<+-;%hRe-Gr9)PONo#Z6jDgfD{$K zuYuS(HU(BtJOR~;WOfr_VPxo;U?yL_%auOAF?8R0YWX)MgV$1Tv5S)M5wohr6e3;Q?wrP2s8> zwN0gSwY}SdWw)fUnwxZ^qxajxd(pht%bbo{$Y*sZi8s$=7$^myQ|VLIRT$sYzJmX< zfDkkdn<(tEingQZMwxo^&b6006e5;f(wgX9*uvq3$Ioc&X6M$x+FJx|l*o-?;Kdn# z79>!xI%>vZ{^_+y_uq?Jz;zK*&b)j(oB*O;EGLfbVScl#=G@?0dCWi6DeH0{A#vw8 zosI109)w92z;#fk-VF|E+0l+APT5_=j5`rQ47D2#6jak%{{6sG}j zJil(`+JwfB6iY#3rS}~c$RL}2NJhex)}wf87#AkG^nkDS%Lp9+D6b^qwjDVyo|X@g zX-kI}1dOXX!&Q5mx+K-QUyVQmCa?Vmy6;Vs>FTH?c2usw;$UZ1zD8KVx&x>xxMV5e zH_FYxTz_Z4Qr%^_6xXr7GNp8&3FSAEV$FlNHXVsCo8#agSU^HDpFFu5+o|QHp?i+7 zHT-B9y=_*XEY-={UCoMNY{g4mc|zqw@zg2aHq9n)iP@5$W51XO1^4S}4c}CAX5gy* z#DQRc&7F`!QA<5_LrbI30G&yPBGoJd{(IlM&F5eb5QKW9q2_;VFRrh>{53OE2*-6?ng4GJ?X!!1~ARhRTID0Yim1V>KM+x~_xf-W?~FC#0`P z4C_*3{>kpG;Wa+F+?2XU7Tpx4RFoRSm`DL$O}y>?k$?X zMfG`J+G_=k8c5_BALeKm!yeTyx;nb^sBAe(`9GVZnpZ|WQTt^Me)zGP~&Ag?XPzf8IFtCsA}w>Z@EXH z9Dn|nhIeJ>8Pfj-%f797|4{O!ehvYsp@5?9Ut5W<7M1+f!m#pGZ>eGJ2Lish2L=b9 zlqj-Ai}K9q)+*3BQbU*V{hRw))K-Ltf4vxZjYNKPO*NB^7xTGCT8Ob4?66rK8IJVl zh<(-iwavzWs;w+Y{x9ICgICdK?U?$}*lQ@;wDKY~T+N%ggKsb9980b*7OnVdi8ij8 zzsDG?{R@bq$e9DD6{z?ck8Tyi`RntNZvx1_F?=ARPbd9sLV;CLjP1^(m1Q>%m3U@{ zXiVlPe6eFrl{|6!pJ6y9vLWd$_|pU7Hu0QQslyYOmbS3Xo}r8P;4y#o?xT-EoiBpY z2JP!zo1%Mi8WUWM{{0n=KNeB2H>;t?D{AXj2=z;YP3As&HnqX&>AfVMU!U)F_%i-! zJjO$6l$g(LxG3`A;h){=HNwkOHY!OdM)TsK#a4VlY^_0yBO%Q~_^4(mbNHdw?aaLM*G-xnma89<;v(-@uEQlX?wX+MMYQS!jW3CQ+G_Z6 z!S;e6X{ybb41)qkaom^H)BHJEy4kLaCC}5bzDqQITU=XAbyy!=^CgxAjT2$qDP&UI zEP@!wTr2_Z^c}O(%_n3*AHJZLFL`)^7{yaCND3f*Qmlv}^w&~k8hsl|##)lpixXS1LA$RR&hvJhObiVJNPa={(*Gx_5Cg zf48hBYKT6)_bos&BsgI-vEuujFj8YvwD6bS`c`oK7NSQ9;JfgB*{+$N9SIEgw4!HB zvRsz6<{LsnDAX**;*M2l?l$JsuMtk^*yCe_T0$pTf4lxZn`^P+c;b~emYGohB4My6 z@9*?s@KOz{ip|&dKey>qQ&9h!f<8xTp%>XPa*@lFzB}6dsGHU-CYO)f2DlP9x<xQh_Q-x@wR?;}{z zWUYie|5+Bi!b$q;zM$@**)C@46EO}-5l=16<<^@uF{4N|n!)$U$4LBh33+OhT@fXg zOVDlWPH#r+K24XNWK?qjHp`}FH`nYH#;Zg&-?fc{Xbx6OI2a2!F%X}pmMnxMng9Al zx;)JV=6Wsm(MHIpSMzLJM*$%vJ z3&!fSqlL5f zj^jmg3>iU*kE4v=jB$r!6BjYfVVb>uA15!+8m$fJYr{h^{vv+@Hn|wn5tf|QEqk{m z9Beh7Df;ZhQ)-KFmfd~`m(o`teBCDp(71b--htTB<~{ZIphJ7i5#(Vn9%V*UW%_>I z^g$K$qXeNJP{9@v%l?a>iUpACzX&8=hvi-t0yymn2>#v}#Of-bgjXh;~M`zj2 z^l>uTnkicxrn%svu~}zRuceL=U}}yHoknroo1Oc|RY4l=pLmHgQqtcCYX z=rgRZ2!xw~2L6cnefTQ(LZ*yXg{aS0&-wTj53+VJE$L@T-Zx2k4L) z{f{w2X%Fm&r!|`&Ce9-v^NTH-Rmbff*7D^FA31GTmy1=LH|0nV@A3&xM?X=3uhT=& zGurlF`Fed+NxepiCryE*h_gC;UsK#8LiJtzjcdhyCvL0dv%_~5bbfSRg?>p+efNxk zw>C|$ZN4_#J?Y?}FdsIso*1T{V)S+}Qw&!Dh^SD0O&Hy(OL8eC*xS&msyXyOjXGM`ayu1QiQB%pKHgm6# zC){CE?X%e|Qp<^-ozB&FTAn2hT3H4Vz7@VH_bsv0)F@Xf*A(QN>>{tyEOR^wD~ zg4=lix%BZyKr*dUo@bqZL@=A!)L+X7d`|SY&*`psfvx0>(i5gbaRCuQgIS1#1N&#XqAJn^1fQu_I<`w{kG@Bjo@sAo2T-&yR5vnEQ8s$4m;e++QrK1UCObT-v1v z3s^+na`cdQ`ttY!)hP}wxNwfZ#}*JxqatsO2%BaUOiSo_y^3ZEQJ@ z4>&EZ(D)O}BrnX{IKv#NSc7>pWpHC(;n=6~u66>XD=5xWT`E?O9AzS%c#qpAz{l~% zwb6~C8=+8isD=ov#rC)9B0WudT8Qj$pZM1e8M4z2&}bK?q^THFohVB*eOkQ`IKBLh ziD&hR$nH;T29&4gaM_2s`z@3S%8MUy>xdSM^k>?@=A(PIi+7mY-=}?}xtbkh5~H*d$SV4#@d!rnOP}}_o=3repDDBJ`HIRg+p74sDPaA@pP9`&b|5INKxl@a z+pW8%uB24&>A+nDdX$JmG^tJrmdf^9+&o*}*@4P1SU^?(?d6R?AQ$&ehi-HfJrI6;m7Th8fj2bK1QCZy132 z%Aq&A_(z6dQ|Gm(CIBvK!|c1?jiIkG?Xgon$7|1rh4hzYZ}Lwy0C?Fz zqc4``k>_@DML&&XczY1Y$zK0ZX1s|*rI_e4)hZU^JxR};OEBQ76uWz$x91UZGBtae zKAkTQV;N<{~mJnw!Y!B5RgP)0Q;#2@BS5)$2n2P4WNmiZ-ZG8d2kpsllYd|zE zWZvhsW{W2SNvTSRB?j6``YW95ZVJlYa;9m+OL}VAgua@pClJ|SR}@KSv43tL3!p>w z5%G8XEkifm?P=m^fv`fQ98XdQ!xTjrbM)4?`jDM}&hHpdCPblOb7r$8<$7akN3K#> z`lGW|ckKfSs6uM?HO__1BjF@^94n^J;`HuEQz_E$PgW4U%4V=+ZVo&v^y|6ao1Uxr z#_f#H=p!eqs(IAM%Y_UtBuZ%iqe{(Aba>vx2^!56`;eC1_Jk~9G&$iI<6&sEw)k2Kpuu2S$f_z)>`%}eakrs1Y)ttr=zy`L665ibQA(Tc zYhXV#FUry|h%P`MRgSlVpu`($2__n|7HIUvt2!b>qHryQl6n z9p2z>M<*wtgKnZF@!4F8dMD%W0VXTx!sn7}pE^FZx1W9J+nffK+=`8Ha9mH%09xUi z2e}_`);=ly_X+IGWh9=zYArzG|C_sc^e~-zu`_eVEQ6yZtZp$lIP1LEoFPfk63LoP z$Co~FzPP61lSF7wOe;;Ho@Ix|O4|8UEDLz$(y`+i@!Bs_-Fwm{y#-PNoOYu$6y_2lm~u z2Hdnnb5id6`n|J9EPnDb8lguE__a>DU{Sh1H6q7wQV#l? sTLX~|s<}`87m3*aKO~;#&szW`pl3ft$ZpLk@&DKjbWL??v|JPZ2Lm|5KmY&$ literal 0 HcmV?d00001 diff --git a/code/index.html b/code/index.html index e04cb010..e36f6f69 100644 --- a/code/index.html +++ b/code/index.html @@ -5,7 +5,8 @@ - Project GitHub Tracker + Rosanna GitHub Tracker + diff --git a/code/script.js b/code/script.js index b322e61a..c11be706 100644 --- a/code/script.js +++ b/code/script.js @@ -6,7 +6,7 @@ const REPOS_URL = `https://api.github.com/users/${USER}/repos` const USER_URL = `https://api.github.com/users/${USER}` const projectsContainer = document.getElementById('projects') const ldsripple = document.getElementById('loading') -const Auth = { headers: { authorization: 'token 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' } } +const Auth = { } let repos; From c6bb30a0bc091613b5d16909933b51fc64e3fc6a Mon Sep 17 00:00:00 2001 From: Rosanna Dahlberg Date: Wed, 13 Oct 2021 12:41:16 +0200 Subject: [PATCH 11/11] Updated placeholder in inputfield after 1:1 with Jennie --- code/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/code/index.html b/code/index.html index e36f6f69..e004ccc1 100644 --- a/code/index.html +++ b/code/index.html @@ -19,7 +19,7 @@

GitHub Tracker

- +