From 32f02a6cdd1e0249203c800319f2d55071f9eaaf Mon Sep 17 00:00:00 2001
From: toal13 <tomoyo.tomoyo.m@gmail.com>
Date: Sat, 26 Feb 2022 12:04:09 +0100
Subject: [PATCH 1/6] add js, html and css

---
 .gitignore                |   2 +
 code/GitHub-Mark-32px.png | Bin 0 -> 1714 bytes
 code/chart.js             |  29 +++++++++++
 code/github-logo.png      | Bin 0 -> 8640 bytes
 code/index.html           |  38 +++++++++++---
 code/output               |  89 ++++++++++++++++++++++++++++++++
 code/script.js            | 106 ++++++++++++++++++++++++++++++++++++++
 code/style.css            | 102 ++++++++++++++++++++++++++++++++++--
 code/token.js             |   0
 9 files changed, 357 insertions(+), 9 deletions(-)
 create mode 100644 .gitignore
 create mode 100644 code/GitHub-Mark-32px.png
 create mode 100644 code/github-logo.png
 create mode 100644 code/output
 create mode 100644 code/token.js

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 00000000..58702a2e
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,2 @@
+// .gitignore file
+code/secret.js
\ No newline at end of file
diff --git a/code/GitHub-Mark-32px.png b/code/GitHub-Mark-32px.png
new file mode 100644
index 0000000000000000000000000000000000000000..8b25551a97921681334176ee143b41510a117d86
GIT binary patch
literal 1714
zcmaJ?X;2eq7*4oFu!ne{XxAht2qc?8LXr|_LPCfTpaBK7K$c{I0Ld=NLIOeuC;@2)
zZ$K%a)k+m-s0>xHmKxL%0V&0TRzzznhgyqrIC$F)0{WwLXLrBvd*^wc_uSc%h%m9E
z{W5z3f#4_!7RvAyFh6!S_*<8qJ%KOIm?#E|L=rJQq=gB5C6WLG5;c?r%V0>EmEH#X
z5eSwPRa6WXBMs#$5H%GtW2go-in9p>zW@UYDN<n!NPv@68XoE4nX@E7rR0&KnNm=S
z2Exgz;A|}%nH?6T$WB#ol%xQEz|X+N1=KJG0S0xNM#nYqNK?98d~Y_>NWc^XOXZQ?
z1QjEV00I#$3^1wQUJ8&-2UsjB-G|9y(LDhMNN3PM{APL4eYi{(m*ERcUnJa{R+-3^
z34^A6;U^v`8N*O6ji%S@sd{fJqD`XFIUJ5zgTe5^5nj414F(y!G&=H(f)Lgzv?>%+
zAsWD}2qhpH7>|TU`X&W6IxDNuO_vET7|j5oG&&VDr!)hUO8+0KR?nh!m<)a!?|%yG
zqOwq!CWCcIhE{<$E|F|@g>nP6FoYr6C<IBHsbWMjf+4zO1O);kS%8}qQm8a$gZmUi
zD&<NvIt<b%V2O}N!ZoNWm69uB(tX){2A{*><8>D?ID9%&5J(4oSbR1I^byW*g@__U
z4QsF&uJSEcFeleM3~ChjEQGbHOjsGDMbyAl(p=Ttv9RaVo8~I#js@@Y9C^_2U})yn
zzSHU%6FxuY?d;&<huP7GHTb-1@xlJO(B`!HdyxqFQHH(?73$<tXlZL#R;c$4@H*dP
z+g2Gl(SNi>65MyR({^lU*3$z$ZllDb(o&<7d;A_`h<Vt-co_6}4qhm4NL!6;QN;~C
ziOs0?+tNQdT6JgR$TNMl?(B>2U+3~BJ2Hv`{W}KEU801#cv_B|9Cm!ynR{S`AMsSn
z;7E=B;mb!wx$L;S>yGXG^6=&WlQn9$s?&L%Y1D8TI^MlKB1DqsEng$>f4=xYWBoPI
z_S1p!sJ#d2?YI4kPA{k}Eby?F=f-J9zIc`YDl^pzjVm~9ebE?Hn?t0Nx+la|D0MB;
z9)2xv1G>a1|A9kQ>~DV<Q;Z7ho$L^b&Ea$Dj%<sAD|e;zY><=X3-4yC&n!m8-3K#P
z{X@<rb5Hi2cU~WVHh|a|UznA=S2T~Zo%gX~ts(4Xc-Qdmw#zoiO^=#q#=Wa8_3kfM
zx=ub`8M3t4OXkYbtXVWMfw<I@{5w`SwWrV;vC8G9bB*bHN)Yk(=-utUw^Ilfg?CQ4
zGSWYIztN#z924;3n11kgM76CXFCp;!j+#P#S@z&Wc|z;)$KPUozl=B>0zRuQsy$+N
ziSCoLJU{Z$nQy4A4Y5UJ07$5FA~qL2%Q+cLaqDU?Lz3?=BC5;Nk6BbTmmceEaM>-Z
zi>O&-dSE=%ex;vcvCOk{*JQ5^_<YkKqpS$DAH0F(H<X7Bw`87_MOS)Pg#68pNxjDa
zB;jK$zmn_sWuB8y_{V!r7^(ToKe<wuXyxcEh_xT;sDAHiUbnkXO@U&w%;a;~8w^_5
z7JIw!*5j{umb8@5D<0X|rEcyQ=TV&ZS&EAftyyndd$Eih%<?R`$2~8S4QJH5$fAeG
z=l34zf}D3MsipO=ZSVHf&ktr)HOpO__7^nu7LNz%%Lk<ETz#8t6H|H@2wg%He@aa`
zq1}V7F@MGV3R$*cH!B-|SZ5VW<W<&vWR!!JM4Cx^@#nE|aNkx=5~sx;c)F*Skd>4M
z4lW7%l9IqY(z7pV(?I@@8=KPFO82)O{VDI18-*d-k$YmI^XiuPs_LuFw<^ZcD}yP5
c*NrbeloN*74g`U%%F6r~k%+>C^#XapzmV0H-2eap

literal 0
HcmV?d00001

diff --git a/code/chart.js b/code/chart.js
index 92e85a30..060c3987 100644
--- a/code/chart.js
+++ b/code/chart.js
@@ -1,4 +1,33 @@
 //DOM-selector for the canvas 👇
 const ctx = document.getElementById('chart').getContext('2d')
 
+
 //"Draw" the chart here 👇
+const activateChart = (projects) => {
+console.log(projects)
+const labels = [
+  'Completed projects',
+  'Total projects',
+  ];
+
+  const data = {
+    labels: labels,
+    datasets: [{
+      label: 'Progress',
+      backgroundColor: ['rgb(255, 99, 132)','rgb(100, 5, 100)'],
+      borderColor: 'rgb(255, 99, 132)',
+      data: [projects, 19-projects],
+    }]
+  };
+
+  const config = {
+    type: 'doughnut',
+    data: data,
+    options: {}
+  };
+  new Chart(
+    document.getElementById('chart'),
+    config
+    );
+  }
+  
\ No newline at end of file
diff --git a/code/github-logo.png b/code/github-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..9490ffc6d2e158b266f719d58365905c1c5060cb
GIT binary patch
literal 8640
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

literal 0
HcmV?d00001

diff --git a/code/index.html b/code/index.html
index 2fb5e0ae..4e709d33 100644
--- a/code/index.html
+++ b/code/index.html
@@ -1,21 +1,47 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Project GitHub Tracker</title>
   <link rel="stylesheet" href="./style.css" />
+  <script src="http://cdn.jsdelivr.net/npm/chart.js"></script>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Comforter&family=Fuzzy+Bubbles:wght@700&family=Montserrat:wght@300;400;700&family=Oswald:wght@300;500;600&family=Pacifico&family=Roboto:wght@300;400&family=Rock+Salt&family=Rowdies:wght@700&display=swap"
+    rel="stylesheet">
 </head>
+
 <body>
-  <h1>GitHub Tracker</h1>
-  <h2>Projects:</h2>
-  <main id="projects"></main>
+  <header class="navigation-bar">
+    <!-- <a href="https://github.com/github"> -->
+    <h1>GitHub Tracker</h1>
+    </a>
+  </header>
+  <div class="big-container">
+    <div class="info-contain">
+      <div id="profile-info" class="profile-container"></div>
+      <div class="chart-container">
+        <h2>Progress</h2>
+        <canvas id="chart" class="chart"></canvas>
+      </div>
+    </div>
 
-  <!-- This will be used to draw the chart 👇 -->
-  <canvas id="chart"></canvas>
+    <div class="projects-container">
+      <h2>Projects</h2>
 
-  <script src="./script.js"></script>
+      <div class="project-list">
+        <main id="projects" class="projects"></main>
+
+      </div>
+    </div>
+  </div>
+
+  <script src="./secret.js"></script>
   <script src="./chart.js"></script>
+  <script src="./token.js"></script>
+  <script src="./script.js"></script>
 </body>
+
 </html>
\ No newline at end of file
diff --git a/code/output b/code/output
new file mode 100644
index 00000000..a337fb57
--- /dev/null
+++ b/code/output
@@ -0,0 +1,89 @@
+allow_forking: true
+archive_url: "https://api.github.com/repos/toal13/project-business-site/{archive_format}{/ref}"
+archived: false
+assignees_url: "https://api.github.com/repos/toal13/project-business-site/assignees{/user}"
+blobs_url: "https://api.github.com/repos/toal13/project-business-site/git/blobs{/sha}"
+branches_url: "https://api.github.com/repos/toal13/project-business-site/branches{/branch}"
+clone_url: "https://github.com/toal13/project-business-site.git"
+collaborators_url: "https://api.github.com/repos/toal13/project-business-site/collaborators{/collaborator}"
+comments_url: "https://api.github.com/repos/toal13/project-business-site/comments{/number}"
+commits_url: "https://api.github.com/repos/toal13/project-business-site/commits{/sha}"
+compare_url: "https://api.github.com/repos/toal13/project-business-site/compare/{base}...{head}"
+contents_url: "https://api.github.com/repos/toal13/project-business-site/contents/{+path}"
+contributors_url: "https://api.github.com/repos/toal13/project-business-site/contributors"
+created_at: "2022-01-23T16:12:15Z"
+default_branch: "master"
+deployments_url: "https://api.github.com/repos/toal13/project-business-site/deployments"
+description: null
+disabled: false
+downloads_url: "https://api.github.com/repos/toal13/project-business-site/downloads"
+events_url: "https://api.github.com/repos/toal13/project-business-site/events"
+fork: true
+forks: 0
+forks_count: 0
+forks_url: "https://api.github.com/repos/toal13/project-business-site/forks"
+full_name: "toal13/project-business-site"
+git_commits_url: "https://api.github.com/repos/toal13/project-business-site/git/commits{/sha}"
+git_refs_url: "https://api.github.com/repos/toal13/project-business-site/git/refs{/sha}"
+git_tags_url: "https://api.github.com/repos/toal13/project-business-site/git/tags{/sha}"
+git_url: "git://github.com/toal13/project-business-site.git"
+has_downloads: true
+has_issues: false
+has_pages: false
+has_projects: true
+has_wiki: true
+homepage: null
+hooks_url: "https://api.github.com/repos/toal13/project-business-site/hooks"
+html_url: "https://github.com/toal13/project-business-site"
+id: 451158190
+is_template: false
+issue_comment_url: "https://api.github.com/repos/toal13/project-business-site/issues/comments{/number}"
+issue_events_url: "https://api.github.com/repos/toal13/project-business-site/issues/events{/number}"
+issues_url: "https://api.github.com/repos/toal13/project-business-site/issues{/number}"
+keys_url: "https://api.github.com/repos/toal13/project-business-site/keys{/key_id}"
+labels_url: "https://api.github.com/repos/toal13/project-business-site/labels{/name}"
+language: "CSS"
+languages_url: "https://api.github.com/repos/toal13/project-business-site/languages"
+license: null
+merges_url: "https://api.github.com/repos/toal13/project-business-site/merges"
+milestones_url: "https://api.github.com/repos/toal13/project-business-site/milestones{/number}"
+mirror_url: null
+name: "project-business-site"
+node_id: "R_kgDOGuQgrg"
+notifications_url: "https://api.github.com/repos/toal13/project-business-site/notifications{?since,all,participating}"
+open_issues: 0
+open_issues_count: 0
+owner: {login: 'toal13', id: 91566202, node_id: 'U_kgDOBXUweg', avatar_url: 'https://avatars.githubusercontent.com/u/91566202?v=4', gravatar_id: '', …}
+private: false
+pulls_url: "https://api.github.com/repos/toal13/project-business-site/pulls{/number}"
+pushed_at: "2022-01-29T19:48:50Z"
+releases_url: "https://api.github.com/repos/toal13/project-business-site/releases{/id}"
+size: 19693
+ssh_url: "git@github.com:toal13/project-business-site.git"
+stargazers_count: 0
+stargazers_url: "https://api.github.com/repos/toal13/project-business-site/stargazers"
+statuses_url: "https://api.github.com/repos/toal13/project-business-site/statuses/{sha}"
+subscribers_url: "https://api.github.com/repos/toal13/project-business-site/subscribers"
+subscription_url: "https://api.github.com/repos/toal13/project-business-site/subscription"
+svn_url: "https://github.com/toal13/project-business-site"
+tags_url: "https://api.github.com/repos/toal13/project-business-site/tags"
+teams_url: "https://api.github.com/repos/toal13/project-business-site/teams"
+topics: []
+trees_url: "https://api.github.com/repos/toal13/project-business-site/git/trees{/sha}"
+updated_at: "2022-01-29T19:36:22Z"
+url: "https://api.github.com/repos/toal13/project-business-site"
+visibility: "public"
+watchers: 0
+watchers_count: 0
+[[Prototype]]: Object
+2: {id: 454313860, node_id: 'R_kgDOGxRHhA', name: 'project-chatbot', full_name: 'toal13/project-chatbot', private: false, …}
+3: {id: 462003502, node_id: 'R_kgDOG4mdLg', name: 'project-github-tracker', full_name: 'toal13/project-github-tracker', private: false, …}
+4: {id: 456101513, node_id: 'R_kgDOGy-OiQ', name: 'project-guess-who', full_name: 'toal13/project-guess-who', private: false, …}
+5: {id: 448514498, node_id: 'R_kgDOGrvJwg', name: 'project-news-site', full_name: 'toal13/project-news-site', private: false, …}
+6: {id: 462883011, node_id: 'R_kgDOG5cIww', name: 'project-weather-app', full_name: 'toal13/project-weather-app', private: false, …}
+7: {id: 462241115, node_id: 'R_kgDOG409Ww', name: 'unit-tests', full_name: 'toal13/unit-tests', private: false, …}
+length: 8
+[[Prototype]]: Array(0)
+fiveserver.js:1 [Five Server] connected.
+
+
diff --git a/code/script.js b/code/script.js
index e69de29b..215f46ed 100644
--- a/code/script.js
+++ b/code/script.js
@@ -0,0 +1,106 @@
+//-----API-----//
+const userName = 'toal13'
+//let reponame =''
+const authorName = 'Tomoyo Alvåg'
+const API_URL = `https://api.github.com/users/${userName}/repos`;
+const USER_API = `https://api.github.com/users/${userName}`;
+
+//-----DOM-----//
+const profileInfo = document.getElementById("profile-info")
+const projectsContainer = document.getElementById("projects")
+
+// const API_TOKEN = TOKEN || process.env.API_KEY;
+console.log(TOKEN)
+
+const options = {
+    method: 'GET', //POST, PATCH, DELETE
+    headers: {
+        Authorization: `token ${TOKEN}`
+    }
+}
+
+
+//------profile-----//
+const getUser = () => {
+    fetch(USER_API, options)
+        .then(res => res.json())
+        .then((data) => {
+            // console.log(data)
+            profileInfo.innerHTML += `
+            <h3><a href="${API_URL}" target="_blank">${data.login}</a></h3>
+            <img src = "${data.avatar_url}" class="user-picture"/>
+       `
+        })
+}
+
+
+//-----repos-----//
+const getRepos = () => {
+    fetch(API_URL, options)
+        .then(res => res.json())
+        .then(data => {
+            // console.log(data)
+
+            const forkedRepos = data.filter((repo) => repo.fork && repo.name.startsWith('project-'));
+
+
+            forkedRepos.forEach((repo) => {
+                projectsContainer.innerHTML +=
+                    `<div class="project-list">
+                       <h3>Project Name:${repo.name}</h3>
+                       <a href = ${repo.html_url}> ${repo.name} </a>
+                       <p> Main branch: ${repo.default_branch}</p>
+                       
+                       <p> Latest push : ${repo.pushed_at.slice(0, 10)}, ${repo.pushed_at.slice(11, 16)}</p>
+                       <p id="pull-${repo.name}"></p>
+                       <p id="commit-${repo.name}">Commits: </p>
+                       </div>`;
+                // console.log(repo.commits_url)
+            });
+            fetchPullRequests(forkedRepos)
+            activateChart(forkedRepos.length)
+        });
+
+
+
+};
+//
+
+
+
+//Remember to pass along your filtered repos as an argument when
+//you are calling this function
+
+//-----My pull request-----//
+const fetchPullRequests = (allRepos) => {
+    allRepos.forEach((repo) => {
+        const PULL_URL = `https://api.github.com/repos/Technigo/${repo.name}/pulls?per_page=100`;
+
+        fetch(PULL_URL, options)
+            .then((res) => res.json())
+            .then((data) => {
+                const myPullRequest = data.find(
+                    (pull) => pull.user.login === repo.owner.login);
+                    // console.log(myPullRequest)
+                if (myPullRequest) {
+                    getCommits(myPullRequest.commits_url, repo.name);
+                } else {
+                    document.getElementById(`commit-${repo.name}`).innerHTML = 'Group project';
+                }
+                // console.log(myPullRequest)
+            });
+    });
+};
+
+
+//-----Function to get amount of commit-----// 
+const getCommits = (myCommitsUrl, myRepoName) => {
+    fetch(myCommitsUrl, options)
+    .then((res) => res.json())
+    .then((data) => {
+            document.getElementById(`commit-${myRepoName}`).innerHTML += [data.length];
+        });
+};
+
+getRepos();
+getUser();
\ No newline at end of file
diff --git a/code/style.css b/code/style.css
index 7c8ad447..08a816be 100644
--- a/code/style.css
+++ b/code/style.css
@@ -1,3 +1,99 @@
-body {
-  background: #FFECE9;
-}
\ No newline at end of file
+ body {
+  background: #74959A;
+  color: #495371;
+  min-width: 325px;
+  font-family: 'Oswald', sans-serif;
+}
+
+.big-container {
+  margin: 5% 0;
+
+}
+.big-container {
+    display: grid;
+    grid-template-columns: 1fr 2fr;
+    margin: 2%;
+  }
+/* ===============
+    Header
+=============== */
+h1 {
+  text-align: center;
+  text-decoration: none;
+  font-size: 50px;
+}
+/* ===============
+    Profile
+=============== */
+.profile-container {
+  text-align: center;
+}
+
+img {
+  width: 50%;
+  height: 50%;
+  border-radius: 50%;
+  border: 1px solid white;
+  filter: grayscale(40%);
+}
+
+.info-contain {
+  margin-top: 50px;
+}
+
+h3 {
+  font-size: 30px;
+  text-decoration: none;
+}
+
+/* ===============
+    Chart
+=============== */
+.chart-container {
+  width: 70%;
+  margin: 30% 0 10% 15%;
+}
+
+/* ===============
+    Project
+=============== */
+h2 {
+  text-align: center;
+  font-size: 30px;
+}
+.projects {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr); 
+  grid-auto-rows: auto; 
+  grid-gap: 1rem;
+  }
+.project-list {
+  padding: 20px;
+  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2); 
+  border-radius: 5px;
+  backdrop-filter: blur(5px);
+  border-radius: 25px;
+  text-align: center;
+  margin: 10px; 
+  grid-auto-flow: column;
+  flex-wrap: wrap;
+  background: #FEECE9;
+  
+}
+
+
+/* .navigation-bar {
+width: 100%;
+height: 80px;
+margin-bottom: 50px;
+}
+
+.logo {
+  display: inline-block;
+  vertical-align: top;
+  width: 50px;
+  height: 50px;
+  margin-top: 15px;
+} */
+
+/* DESKTOP LAYOUT */
\ No newline at end of file
diff --git a/code/token.js b/code/token.js
new file mode 100644
index 00000000..e69de29b

From ad22367b15dcee1b425b979b129934b7e390e83d Mon Sep 17 00:00:00 2001
From: toal13 <tomoyo.tomoyo.m@gmail.com>
Date: Sat, 26 Feb 2022 13:08:01 +0100
Subject: [PATCH 2/6] update link

---
 code/index.html | 2 +-
 code/script.js  | 3 +--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/code/index.html b/code/index.html
index 4e709d33..8f6f1516 100644
--- a/code/index.html
+++ b/code/index.html
@@ -7,7 +7,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Project GitHub Tracker</title>
   <link rel="stylesheet" href="./style.css" />
-  <script src="http://cdn.jsdelivr.net/npm/chart.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
   <link
     href="https://fonts.googleapis.com/css2?family=Comforter&family=Fuzzy+Bubbles:wght@700&family=Montserrat:wght@300;400;700&family=Oswald:wght@300;500;600&family=Pacifico&family=Roboto:wght@300;400&family=Rock+Salt&family=Rowdies:wght@700&display=swap"
     rel="stylesheet">
diff --git a/code/script.js b/code/script.js
index 215f46ed..f7197475 100644
--- a/code/script.js
+++ b/code/script.js
@@ -9,8 +9,7 @@ const USER_API = `https://api.github.com/users/${userName}`;
 const profileInfo = document.getElementById("profile-info")
 const projectsContainer = document.getElementById("projects")
 
-// const API_TOKEN = TOKEN || process.env.API_KEY;
-console.log(TOKEN)
+
 
 const options = {
     method: 'GET', //POST, PATCH, DELETE

From 29233c6c36fda2ed01676bd298a0ccf25a24d826 Mon Sep 17 00:00:00 2001
From: toal13 <tomoyo.tomoyo.m@gmail.com>
Date: Sat, 26 Feb 2022 13:31:08 +0100
Subject: [PATCH 3/6] updated css

---
 code/index.html | 4 ++--
 code/script.js  | 4 ++--
 code/style.css  | 3 ---
 3 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/code/index.html b/code/index.html
index 8f6f1516..d99168cb 100644
--- a/code/index.html
+++ b/code/index.html
@@ -31,8 +31,8 @@ <h2>Progress</h2>
     <div class="projects-container">
       <h2>Projects</h2>
 
-      <div class="project-list">
-        <main id="projects" class="projects"></main>
+      <div id="projects" class="projects">
+       
 
       </div>
     </div>
diff --git a/code/script.js b/code/script.js
index f7197475..3ecbad95 100644
--- a/code/script.js
+++ b/code/script.js
@@ -45,8 +45,8 @@ const getRepos = () => {
 
             forkedRepos.forEach((repo) => {
                 projectsContainer.innerHTML +=
-                    `<div class="project-list">
-                       <h3>Project Name:${repo.name}</h3>
+                    `<div id= "projects">
+                       <h3>${repo.name}</h3>
                        <a href = ${repo.html_url}> ${repo.name} </a>
                        <p> Main branch: ${repo.default_branch}</p>
                        
diff --git a/code/style.css b/code/style.css
index 08a816be..3d157b30 100644
--- a/code/style.css
+++ b/code/style.css
@@ -66,8 +66,6 @@ h2 {
   grid-template-columns: repeat(2, 1fr); 
   grid-auto-rows: auto; 
   grid-gap: 1rem;
-  }
-.project-list {
   padding: 20px;
   box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2); 
   border-radius: 5px;
@@ -75,7 +73,6 @@ h2 {
   border-radius: 25px;
   text-align: center;
   margin: 10px; 
-  grid-auto-flow: column;
   flex-wrap: wrap;
   background: #FEECE9;
   

From dfc27722a4fea40deb51d1edcf80a2e733a4baa7 Mon Sep 17 00:00:00 2001
From: toal13 <tomoyo.tomoyo.m@gmail.com>
Date: Sat, 26 Feb 2022 21:20:19 +0100
Subject: [PATCH 4/6] updated project

---
 code/chart.js                             |   8 +-
 code/{GitHub-Mark-32px.png => github.png} | Bin
 code/index.html                           |   6 +-
 code/script.js                            |  10 +-
 code/style.css                            | 168 +++++++++++++++++-----
 5 files changed, 141 insertions(+), 51 deletions(-)
 rename code/{GitHub-Mark-32px.png => github.png} (100%)

diff --git a/code/chart.js b/code/chart.js
index 060c3987..c320bfa8 100644
--- a/code/chart.js
+++ b/code/chart.js
@@ -14,8 +14,8 @@ const labels = [
     labels: labels,
     datasets: [{
       label: 'Progress',
-      backgroundColor: ['rgb(255, 99, 132)','rgb(100, 5, 100)'],
-      borderColor: 'rgb(255, 99, 132)',
+      backgroundColor: ['rgb(57, 138, 185)','rgb(28, 101, 140)'],
+      borderColor: 'rgb(238, 238, 238)',
       data: [projects, 19-projects],
     }]
   };
@@ -23,7 +23,9 @@ const labels = [
   const config = {
     type: 'doughnut',
     data: data,
-    options: {}
+    options: {
+      
+    }
   };
   new Chart(
     document.getElementById('chart'),
diff --git a/code/GitHub-Mark-32px.png b/code/github.png
similarity index 100%
rename from code/GitHub-Mark-32px.png
rename to code/github.png
diff --git a/code/index.html b/code/index.html
index d99168cb..78d111a1 100644
--- a/code/index.html
+++ b/code/index.html
@@ -30,13 +30,13 @@ <h2>Progress</h2>
 
     <div class="projects-container">
       <h2>Projects</h2>
-
       <div id="projects" class="projects">
-       
-
       </div>
     </div>
   </div>
+  <footer>
+    <h4>Technigo Week 7 Github Tracker</h4>
+  </footer>
 
   <script src="./secret.js"></script>
   <script src="./chart.js"></script>
diff --git a/code/script.js b/code/script.js
index 3ecbad95..ba82a685 100644
--- a/code/script.js
+++ b/code/script.js
@@ -26,7 +26,7 @@ const getUser = () => {
         .then((data) => {
             // console.log(data)
             profileInfo.innerHTML += `
-            <h3><a href="${API_URL}" target="_blank">${data.login}</a></h3>
+            <h2><img src = "./github.png"><a href="https://github.com/${userName}" target="_blank">${data.login}</a></h2>
             <img src = "${data.avatar_url}" class="user-picture"/>
        `
         })
@@ -46,11 +46,9 @@ const getRepos = () => {
             forkedRepos.forEach((repo) => {
                 projectsContainer.innerHTML +=
                     `<div id= "projects">
-                       <h3>${repo.name}</h3>
-                       <a href = ${repo.html_url}> ${repo.name} </a>
-                       <p> Main branch: ${repo.default_branch}</p>
-                       
-                       <p> Latest push : ${repo.pushed_at.slice(0, 10)}, ${repo.pushed_at.slice(11, 16)}</p>
+                       <h3><a href = ${repo.html_url}> ${repo.name} </a></h3>
+                       <p>Default branch: ${repo.default_branch}</p>
+                       <p>Latest push: ${repo.pushed_at.slice(0, 10)}, ${repo.pushed_at.slice(11, 16)}</p>
                        <p id="pull-${repo.name}"></p>
                        <p id="commit-${repo.name}">Commits: </p>
                        </div>`;
diff --git a/code/style.css b/code/style.css
index 3d157b30..2bdc8b86 100644
--- a/code/style.css
+++ b/code/style.css
@@ -1,27 +1,43 @@
  body {
-  background: #74959A;
-  color: #495371;
+  color: #2C3844;
   min-width: 325px;
   font-family: 'Oswald', sans-serif;
+  background-color: #BBBFCA;
 }
 
-.big-container {
-  margin: 5% 0;
+a {
+  text-decoration: none;
+  display: inline-block;
+	padding: 0.3em;
+	transition: .3s;
+	transform: scale(1);
+  color: #2C3844;
+}
+
+h2 {
+  text-align: center;
+  font-size: 30px;
+  margin-top: 0;
+}
 
+.big-container a:hover {
+  transform: scale(1.20);
+  color:  #ff9800;
 }
+
 .big-container {
-    display: grid;
-    grid-template-columns: 1fr 2fr;
-    margin: 2%;
+   margin: 2%;
   }
+
 /* ===============
     Header
 =============== */
+
 h1 {
   text-align: center;
-  text-decoration: none;
   font-size: 50px;
 }
+
 /* ===============
     Profile
 =============== */
@@ -29,41 +45,106 @@ h1 {
   text-align: center;
 }
 
-img {
-  width: 50%;
-  height: 50%;
+
+.user-picture{
+  width: 40%;
+  height: 40%;
   border-radius: 50%;
   border: 1px solid white;
   filter: grayscale(40%);
-}
-
-.info-contain {
-  margin-top: 50px;
-}
 
-h3 {
-  font-size: 30px;
-  text-decoration: none;
 }
 
 /* ===============
     Chart
 =============== */
+
 .chart-container {
   width: 70%;
-  margin: 30% 0 10% 15%;
+  margin: 10% 0 10% 15%;
 }
 
 /* ===============
     Project
 =============== */
-h2 {
+
+.projects {
+  display: block;
+  padding: 20px;
+  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2); 
+  border-radius: 25px;
   text-align: center;
-  font-size: 30px;
+  margin: 10px; 
+  background: #E8E8E8;
 }
-.projects {
+
+footer {
+  height: 80px;
+  background-color: #495464;
+  text-align: center;
+  font-size: 20px;
+  color: #E8E8E8;
+  padding-top: 5PX;
+  width: 100%;
+  bottom: 0;
+}
+
+/* =================
+Tablet layout
+================= */
+@media (min-width: 668px) and (max-width: 1024px) {
+  .projects-list {
+    text-align: center;
+  }
+  .chart-container {
+    margin: 10% 0 10% 15%;
+  }
+
+  .user-picture{
+    width: 40%;
+    height: 40%;
+  }
+
+  .chart-container {
+    width: 50%;
+    margin: 5% 0 5% 27%;
+  }
+  .projects{
+    display: grid;
+     grid-template-columns: 1fr 1fr;
+    grid-auto-rows: auto; 
+    grid-gap: 1rem;
+    padding: 20px;
+    box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2); 
+    border-radius: 5px;
+    backdrop-filter: blur(5px);
+    border-radius: 25px;
+    text-align: center;
+    margin: 10px; 
+    flex-wrap: wrap;
+    background: #E8E8E8;
+  }
+
+}
+/* =================
+Desktop layout
+================= */
+@media (min-width:1025px) {
+  
+  h3 {
+    font-size: 30px;
+    text-decoration: none;
+  }
+  
+  .big-container {
+    display: grid;
+    grid-template-columns: 1fr 2fr; 
+    margin: 2%;
+  }
+
+ .projects{
   display: grid;
-  grid-template-columns: repeat(2, 1fr); 
+   grid-template-columns: 1fr 1fr;
   grid-auto-rows: auto; 
   grid-gap: 1rem;
   padding: 20px;
@@ -74,23 +155,32 @@ h2 {
   text-align: center;
   margin: 10px; 
   flex-wrap: wrap;
-  background: #FEECE9;
-  
+  background: #E8E8E8;
 }
 
 
-/* .navigation-bar {
-width: 100%;
-height: 80px;
-margin-bottom: 50px;
-}
+  .user-picture{
+    width: 60%;
+    height: 60%;
+  }
+  .info-contain {
+   margin-top: -14px;
+  }
 
-.logo {
-  display: inline-block;
-  vertical-align: top;
-  width: 50px;
-  height: 50px;
-  margin-top: 15px;
-} */
+  .chart-container {
+    width: 70%;
+    margin: 30% 0 10% 15%;
+  }
 
-/* DESKTOP LAYOUT */
\ No newline at end of file
+  footer {
+  clear: both;
+  height: 80px;
+  background-color: #495464;
+  text-align: center;
+  font-size: 20px;
+  color: #E8E8E8;
+  padding-top: 10PX;
+  width: 100%;
+  bottom: 0;
+  }
+}
\ No newline at end of file

From ec2cb868a2a43b736d423cb383901bf30805ff31 Mon Sep 17 00:00:00 2001
From: toal13 <tomoyo.tomoyo.m@gmail.com>
Date: Sun, 27 Feb 2022 09:17:58 +0100
Subject: [PATCH 5/6] add some comment

---
 code/chart.js   |  7 +++----
 code/index.html |  1 -
 code/script.js  | 51 +++++++++++++++++++++----------------------------
 code/style.css  |  3 +--
 4 files changed, 26 insertions(+), 36 deletions(-)

diff --git a/code/chart.js b/code/chart.js
index c320bfa8..c42ef84b 100644
--- a/code/chart.js
+++ b/code/chart.js
@@ -2,7 +2,7 @@
 const ctx = document.getElementById('chart').getContext('2d')
 
 
-//"Draw" the chart here 👇
+//Chart
 const activateChart = (projects) => {
 console.log(projects)
 const labels = [
@@ -23,10 +23,9 @@ const labels = [
   const config = {
     type: 'doughnut',
     data: data,
-    options: {
-      
-    }
+    options: {}
   };
+
   new Chart(
     document.getElementById('chart'),
     config
diff --git a/code/index.html b/code/index.html
index 78d111a1..c1cd4152 100644
--- a/code/index.html
+++ b/code/index.html
@@ -15,7 +15,6 @@
 
 <body>
   <header class="navigation-bar">
-    <!-- <a href="https://github.com/github"> -->
     <h1>GitHub Tracker</h1>
     </a>
   </header>
diff --git a/code/script.js b/code/script.js
index ba82a685..26dc4b9a 100644
--- a/code/script.js
+++ b/code/script.js
@@ -1,16 +1,18 @@
-//-----API-----//
-const userName = 'toal13'
-//let reponame =''
-const authorName = 'Tomoyo Alvåg'
-const API_URL = `https://api.github.com/users/${userName}/repos`;
-const USER_API = `https://api.github.com/users/${userName}`;
+
 
 //-----DOM-----//
 const profileInfo = document.getElementById("profile-info")
 const projectsContainer = document.getElementById("projects")
 
 
+//-----Global variables -----//
+const userName = 'toal13'
+const authorName = 'Tomoyo Alvåg'
+const API_URL = `https://api.github.com/users/${userName}/repos`;
+const USER_API = `https://api.github.com/users/${userName}`;
+
 
+//-----Token-----//
 const options = {
     method: 'GET', //POST, PATCH, DELETE
     headers: {
@@ -19,12 +21,11 @@ const options = {
 }
 
 
-//------profile-----//
+//------Profile-----//
 const getUser = () => {
     fetch(USER_API, options)
         .then(res => res.json())
         .then((data) => {
-            // console.log(data)
             profileInfo.innerHTML += `
             <h2><img src = "./github.png"><a href="https://github.com/${userName}" target="_blank">${data.login}</a></h2>
             <img src = "${data.avatar_url}" class="user-picture"/>
@@ -33,16 +34,15 @@ const getUser = () => {
 }
 
 
-//-----repos-----//
+//-----Repos-----//
 const getRepos = () => {
     fetch(API_URL, options)
         .then(res => res.json())
         .then(data => {
-            // console.log(data)
-
+          //-----Filter repos-----//
             const forkedRepos = data.filter((repo) => repo.fork && repo.name.startsWith('project-'));
 
-
+          //-----Show repos in projectsContainer-----//
             forkedRepos.forEach((repo) => {
                 projectsContainer.innerHTML +=
                     `<div id= "projects">
@@ -52,45 +52,37 @@ const getRepos = () => {
                        <p id="pull-${repo.name}"></p>
                        <p id="commit-${repo.name}">Commits: </p>
                        </div>`;
-                // console.log(repo.commits_url)
             });
+            //-----Initiate next function and chart-----// 
             fetchPullRequests(forkedRepos)
             activateChart(forkedRepos.length)
         });
-
-
-
 };
-//
 
 
-
-//Remember to pass along your filtered repos as an argument when
-//you are calling this function
-
 //-----My pull request-----//
 const fetchPullRequests = (allRepos) => {
     allRepos.forEach((repo) => {
         const PULL_URL = `https://api.github.com/repos/Technigo/${repo.name}/pulls?per_page=100`;
-
         fetch(PULL_URL, options)
-            .then((res) => res.json())
-            .then((data) => {
-                const myPullRequest = data.find(
-                    (pull) => pull.user.login === repo.owner.login);
-                    // console.log(myPullRequest)
+        .then((res) => res.json())
+        .then((data) => {
+            //-----Check if i have a pullrequest for that repo user login and repo owner-----//
+            const myPullRequest = data.find(
+                (pull) => pull.user.login === repo.owner.login);
+                //-----If yes, start function getCommits-----//
                 if (myPullRequest) {
                     getCommits(myPullRequest.commits_url, repo.name);
+                    //----If not, assume and print Group project-----//
                 } else {
                     document.getElementById(`commit-${repo.name}`).innerHTML = 'Group project';
                 }
-                // console.log(myPullRequest)
             });
     });
 };
 
 
-//-----Function to get amount of commit-----// 
+//-----Function to get amount of commit. Print on page.-----// 
 const getCommits = (myCommitsUrl, myRepoName) => {
     fetch(myCommitsUrl, options)
     .then((res) => res.json())
@@ -99,5 +91,6 @@ const getCommits = (myCommitsUrl, myRepoName) => {
         });
 };
 
+//-----Initiate on page load-----//
 getRepos();
 getUser();
\ No newline at end of file
diff --git a/code/style.css b/code/style.css
index 2bdc8b86..bcdb2a78 100644
--- a/code/style.css
+++ b/code/style.css
@@ -52,7 +52,6 @@ h1 {
   border-radius: 50%;
   border: 1px solid white;
   filter: grayscale(40%);
-
 }
 
 /* ===============
@@ -158,11 +157,11 @@ Desktop layout
   background: #E8E8E8;
 }
 
-
   .user-picture{
     width: 60%;
     height: 60%;
   }
+  
   .info-contain {
    margin-top: -14px;
   }

From 0918489adffa7e34164a32fd6d16d97a519fc72f Mon Sep 17 00:00:00 2001
From: toal13 <tomoyo.tomoyo.m@gmail.com>
Date: Sun, 27 Feb 2022 15:33:02 +0100
Subject: [PATCH 6/6] create readme

---
 README.md            |  12 ++++++++----
 code/github-logo.png | Bin 8640 -> 0 bytes
 code/script.js       |   1 -
 3 files changed, 8 insertions(+), 5 deletions(-)
 delete mode 100644 code/github-logo.png

diff --git a/README.md b/README.md
index 1613a3b0..4056550b 100644
--- a/README.md
+++ b/README.md
@@ -1,13 +1,17 @@
 # GitHub Tracker
 
-Replace this readme with your own information about your project.
+This week I create a place to keep track of the GitHub repos.
+HTML,CSS and javascript.
 
-Start by briefly describing the assignment in a sentence or two. Keep it short and to the point.
 
 ## The problem
+I started with fetching the information  through API.
+then I tried to figure out how to filter the information I needed.
+When I had information i displayed it on the site.
+Styled with CSS (mobile first).
 
-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?
+If I had more time I would try to include a search bar and also which languages the projects includes.
 
 ## 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://silly-mestorf-a038ed.netlify.app/
diff --git a/code/github-logo.png b/code/github-logo.png
deleted file mode 100644
index 9490ffc6d2e158b266f719d58365905c1c5060cb..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 8640
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

diff --git a/code/script.js b/code/script.js
index 26dc4b9a..121c1cfe 100644
--- a/code/script.js
+++ b/code/script.js
@@ -1,5 +1,4 @@
 
-
 //-----DOM-----//
 const profileInfo = document.getElementById("profile-info")
 const projectsContainer = document.getElementById("projects")