feat(#34): add lougout button and changed button styles

fga-eps-mds · Sep 16, 2019 · 9e77cea · 9e77cea
1 parent ffad6c7
commit 9e77cea
Show file tree

Hide file tree

Showing 7 changed files with 176 additions and 0 deletions.
diff --git a/extension/.vscode/settings.json b/extension/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "git.ignoreLimitWarning": true
+}
diff --git a/extension/manifest.json b/extension/manifest.json
@@ -0,0 +1,27 @@
+{
+    "name": "GitBreakdown",
+    "version": "0.4",
+    "description": "GitBreakdown Chrome extension",
+    "permissions": ["declarativeContent", "storage"],
+    "background": 
+    {
+        "scripts": ["scripts/background.js"],
+        "persistent": false
+    },
+    "content_scripts": 
+    [{
+        "matches": 
+        [
+            "http://github.com/*",
+            "https://github.com/*",
+            "http://*.github.com/*",
+            "https://*.github.com/*"
+        ],
+        "js": ["scripts/oauth.js"]
+    }],
+    "browser_action": 
+    {
+        "default_popup": "popup.html"
+    },
+    "manifest_version": 2
+  }
diff --git a/extension/popup.html b/extension/popup.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <style>
+            button 
+            {
+                height: 50px;
+                width: 160px;
+                border: 1px solid gray;
+                background: none;
+                text-transform: uppercase;
+                border-radius: 8px;
+                font-weight: 700;
+                color:steelblue;
+                letter-spacing: 1px;
+                font-size:inherit;
+                transition: all 0.3s;
+                -webkit-transition: all 0.3s;
+                -moz-transition: all 0.3s;
+                outline: none;
+            }
+            button:hover
+            {
+                color: white;
+                background-color: steelblue;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="app">
+            <h1>GitBreakdown</h1>
+            <button id="loginButton">Log in to GitHub</button>
+            <button id="logoutButton">Logout</button>
+        </div>
+        <script type="module" src="scripts/popup.js"> </script>
+    </body>
+</html>
diff --git a/extension/scripts/background.js b/extension/scripts/background.js
@@ -0,0 +1,25 @@
+// Copyright 2018 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+'use strict'
+
+chrome.runtime.onInstalled.addListener(function() 
+{
+
+})
+
+chrome.declarativeContent.onPageChanged.removeRules(undefined, function() 
+{
+  chrome.declarativeContent.onPageChanged.addRules([
+  {
+    conditions: [new chrome.declarativeContent.PageStateMatcher(
+    {
+      pageUrl: {hostEquals: 'developer.chrome.com'},
+    })
+    ],
+        actions: [new chrome.declarativeContent.ShowPageAction()]
+  }])
+})
+
+
diff --git a/extension/scripts/constants.js b/extension/scripts/constants.js
@@ -0,0 +1,5 @@
+export default 
+{
+    CLIENT_ID: '75c7ceaa2fd180fdceb3',
+    CLIENT_SECRET: 'f70bab3c05d93de9a682de4e6874ca3a2ba680e0'
+}
diff --git a/extension/scripts/oauth.js b/extension/scripts/oauth.js
@@ -0,0 +1,40 @@
+const CLIENT_ID = '75c7ceaa2fd180fdceb3'
+const CLIENT_SECRET = 'f70bab3c05d93de9a682de4e6874ca3a2ba680e0'
+
+const getLoginUrl = (code) =>
+    `https://github.com/login/oauth/access_token?client_id=${CLIENT_ID}&client_secret=${CLIENT_SECRET}&code=${code}`
+
+const saveAcessToken = (token) => 
+{
+    chrome.storage.sync.set({'oauth2_token': token.access_token}, function() 
+    {
+        console.log('Token salvo')
+    })
+}
+
+const getAccessToken = (code) => 
+{
+    fetch(getLoginUrl(code), 
+    {
+        method: 'POST',
+        headers: 
+        {
+            'Accept': 'application/json',
+            'Content-Type': 'application/json; charset=utf-8'
+        },
+    })
+        .then(response => response.json())
+        .then(obj => saveAcessToken(obj))
+        .catch(error=>console.error(error))
+}
+
+const init = () => 
+{
+    if(location.search.match(/\?code=([\w\/\-]+)/))
+    {
+        let code = location.search.match(/\?code=([\w\/\-]+)/)[1]
+        getAccessToken(code)
+    }
+}
+
+init()
diff --git a/extension/scripts/popup.js b/extension/scripts/popup.js
@@ -0,0 +1,39 @@
+import constants from './constants.js'
+
+const url = 
+`https://github.com/login/oauth/authorize?response_type=code&client_id=${constants.CLIENT_ID}&scope=repo`
+
+document.getElementById('loginButton').addEventListener("click", function() 
+{
+    window.open(url)
+}, false)
+
+document.getElementById('logoutButton').addEventListener("click", function()
+{
+    chrome.storage.sync.set({'oauth2_token': null}, function()
+    {
+        console.log("Token removido com sucesso")
+    })
+    window.close()
+})
+
+document.addEventListener('DOMContentLoaded', function() 
+{
+
+})
+
+chrome.storage.sync.get('oauth2_token', function(res) 
+{
+    if (res.oauth2_token != undefined)
+    {
+        console.log("Token salvo: " + res.oauth2_token)
+        let loginButton = document.getElementById('loginButton')
+        loginButton.parentNode.removeChild(loginButton)
+    }
+    else
+    {
+        console.log("Token nao disponivel")
+        let logoutButton = document.getElementById('logoutButton')
+        logoutButton.parentNode.removeChild(logoutButton)
+    }
+});