diff --git a/README.md b/README.md
index 1613a3b0..646e565c 100644
--- a/README.md
+++ b/README.md
@@ -1,13 +1,11 @@
# GitHub Tracker
-
-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 task was to fetch repos from GitHub and use the information on the website.
## The problem
+I had a methodological approach to the problem and solved one task at the time. I thing the fetching and the javaScript part of the task went really well, but i have struggled a bit with the CSS part. I did'nt have the same methodological approach to the CSS, i guess i miss calculated how difficult it was. So i had to redo some things in the very end.
-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?
+I'm still not so pleased with the CSS turnout. If i had more time i would make the username and profile picture appear nicer, in line.
## 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://elegant-curran-a4a3c9.netlify.app
diff --git a/code/app.js b/code/app.js
new file mode 100644
index 00000000..3207e7a8
--- /dev/null
+++ b/code/app.js
@@ -0,0 +1,108 @@
+const USER = ''; // !!! Place your user over here !!!
+const REPOS_URL = `https://api.github.com/users/${USER}/repos`;
+
+const projectsContainer = document.getElementById('projects');
+
+const fetchRepositories = () => {
+ fetch(REPOS_URL)
+ .then((res) => res.json())
+ .then((data) => {
+ const technigoRepositories = data.filter(
+ (repo) => repo.name.includes('project-') && repo.fork
+ );
+
+ technigoRepositories.forEach((repo) => {
+ projectsContainer.innerHTML += `
+
+ `;
+
+ // // Approach number 1
+ // fetchPullRequestsSingle(repo);
+ });
+
+ // Approach number 2
+ fetchPullRequestsArray(technigoRepositories);
+
+ // Draw chart with technigoRepos data
+ drawBarChart(technigoRepos);
+ });
+};
+
+// // Approach number 1
+// const fetchPullRequestsSingle = (singleRepository) => {
+// fetch(singleRepository);
+// };
+
+// Approach number 2
+const fetchPullRequestsArray = (allRepositories) => {
+ allRepositories.forEach((repo) => {
+ const PULL_URL = `https://api.github.com/repos/Technigo/${repo.name}/pulls?per_page=100`;
+
+ fetch(PULL_URL)
+ .then((res) => res.json())
+ .then((data) => {
+ const myPullRequest = data.find(
+ (pull) => pull.user.login === repo.owner.login
+ );
+
+ // Detect if we have pull request or not.
+ // If yes - call fetchCommits function
+ // If no - inform user that no pull request was yet done
+ if (myPullRequest) {
+ fetchCommits(myPullRequest.commits_url, repo.name);
+ } else {
+ document.getElementById(`commit-${repo.name}`).innerHTML =
+ 'No pull request yet done :(';
+ }
+ });
+ });
+};
+
+const fetchCommits = (myCommitsUrl, myRepoName) => {
+ fetch(myCommitsUrl)
+ .then((res) => res.json())
+ .then((data) => {
+ document.getElementById(`commit-${myRepoName}`).innerHTML += data.length;
+ });
+};
+
+fetchRepositories();
+
+
+
+/* TODO:
+1. få ut infon om commits på sidan
+2. få ut commitsen i den rätta rutan
+
+
+3. titta på hur Max hanterade "dates" från lektionen
+*/
+
+
+// Trying to push up into the innerHTML projects
+ /* console.log('FETCHED COMMITS', fetchedCommits)
+ document.getElementById(`commit-${repo.name}`).innerHTML =
+ `Number of commits in this project: ${fetchedCommits.length}`; */
+ /* projects.innerHTML += `
+ Number of commits in this project: ${fetchedCommits.length}
+ `
+
+
+
+ document.getElementById(`commits-${pullRequest.commits_url}`).innerHTML = `There are ${fetchedCommits.length} commits`)};
+
+
+ooops, there are no commits in this projet
+
+ document.getElementById(`commits-${pullRequest.commits_url}`).innerHTML += `Number of commits: ${fetchedCommits.commits_url}`;
+
+_____________
+ No Commit Yet
+
+ document.getElementById(`commits-${fetchedCommits.name}`).innerHTML += `Antalet Commits: ${fetchedCommits.length}`;
\ No newline at end of file
diff --git a/code/chart.js b/code/chart.js
index 92e85a30..ada37134 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 to go',
+ ],
+ datasets: [{
+ label: 'My First Dataset',
+ data: [amount, 19-amount],
+ backgroundColor: [
+ 'rgb(161, 168, 143)',
+ 'rgb(119, 133, 161)',
+ ],
+ hoverOffset: 4
+ }]
+ }
+ };
+
+ const chart = new Chart(ctx, config)
+}
\ No newline at end of file
diff --git a/code/index.html b/code/index.html
index 2fb5e0ae..b5dc3d45 100644
--- a/code/index.html
+++ b/code/index.html
@@ -6,15 +6,32 @@
Project GitHub Tracker
GitHub Tracker
- Projects:
-
+ GitHub
+ GitHub Tracker
+
+
+
+
+ Forked Technigo Projects:
+
+
+
+
diff --git a/code/script.js b/code/script.js
index e69de29b..a0017f19 100644
--- a/code/script.js
+++ b/code/script.js
@@ -0,0 +1,83 @@
+const projects = document.getElementById("projects")
+const profile = document.getElementById("profile")
+const profileContainer = document.getElementById("profile-container")
+const projectContainer = document.getElementById("project-container")
+const userName = 'HedvigM'
+
+
+//^^^^^^^^^^^^^^^^^^^^^^ REPOS ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^//
+
+const repos = `https://api.github.com/users/${userName}/repos`
+fetch(repos)
+ .then(response => response.json())
+ .then(data => {
+ console.log(data)
+ //Fetching only the forked repos and the ones starts with "project" from my GitHub account.
+ const forkedRepos = data.filter(repo => repo.fork && repo.name.startsWith('project'))
+
+
+ //Username and userpic
+ profileContainer.innerHTML+= `
+ ${data[0].owner.login}
+
+
+
${repo.name.substring(8).replace("-"," ")}
+
+
+
The default branch is: ${repo.default_branch}
+
The latest push: ${new Date(repo.pushed_at).toLocaleDateString()}
+
No pull request is yet made 🤷
+
There are no commits yet...
+