From 94ac8f53a2a46bae3e6dcd2c96f0206cc0fa48aa Mon Sep 17 00:00:00 2001
From: Tijl <85572877+xTTLegend@users.noreply.github.com>
Date: Sat, 24 Dec 2022 01:38:21 +0100
Subject: [PATCH] big update

---
 .gitignore        |  2 ++
 assets/logo.png   |  0
 config.js.example |  6 ++++++
 manifest.json     |  2 +-
 popup-func.js     | 41 ++++++++---------------------------------
 popup.css         | 36 ++++++++++++++++++------------------
 popup.html        | 15 +++++++++------
 popup.js          | 36 ++++++++++++++++++++++++++++++++++++
 8 files changed, 80 insertions(+), 58 deletions(-)
 create mode 100644 .gitignore
 delete mode 100644 assets/logo.png
 create mode 100644 config.js.example
 create mode 100644 popup.js

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..0d58dff
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,2 @@
+*.png
+config.js
\ No newline at end of file
diff --git a/assets/logo.png b/assets/logo.png
deleted file mode 100644
index e69de29..0000000
diff --git a/config.js.example b/config.js.example
new file mode 100644
index 0000000..1234f43
--- /dev/null
+++ b/config.js.example
@@ -0,0 +1,6 @@
+var config = {
+  shlinkUrl: 'https://example.com',
+  shlinkOutUrl : 'https://example.com',
+  shlinkAppUrl : 'https://app.shlink.io/server/xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'
+  shlinkApiKey: 'xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'
+}
\ No newline at end of file
diff --git a/manifest.json b/manifest.json
index 3c7f2d9..18a65fb 100644
--- a/manifest.json
+++ b/manifest.json
@@ -7,7 +7,7 @@
       "service_worker": "background.js"
     },
     "action": {
-      "default_icon": "assets/icon.png",
+      "default_icon": "assets/my-icon.png",
       "default_title": "redirect",
       "default_popup": "popup.html"
     },
diff --git a/popup-func.js b/popup-func.js
index bd3f39c..037c0fb 100644
--- a/popup-func.js
+++ b/popup-func.js
@@ -1,35 +1,7 @@
-const searchButton = document.getElementById('searchButton');
-if (searchButton) {
-    searchButton.addEventListener('click', () => {
-        searchRedirect();
-    })
-}
-const newButton = document.getElementById('newButton');
-if (newButton) {
-    newButton.addEventListener('click', () => {
-        newRedirect();
-    })
-}
-
-function searchRedirect() {
-    const request = new XMLHttpRequest();
-    const url = 'https://url.example.com/rest/v3/short-urls';
-    request.open('GET', url);
-    request.setRequestHeader('X-Api-Key', 'apikeyhere');
-    request.send();
-    request.onload = (e) => {
-        var shortUrls = request.response
-        chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => {
-            let url = tabs[0].url;
-            alert(shortUrls)
-        });
-    }
-}
-
-function newRedirect() {
+function newRedirect () {
     chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => {
         let currentUrl = tabs[0].url;
-        const url = 'https://url.example.com/rest/v3/short-urls';
+        const url = `${config.shlinkUrl}/rest/v3/short-urls`;
         let sendData = {
             "longUrl": currentUrl,
             "tags": ["Added by BOTv1"]
@@ -37,12 +9,15 @@ function newRedirect() {
         const request = new XMLHttpRequest();
         request.open('POST', url);
         request.setRequestHeader('accept', 'application/json');
-        request.setRequestHeader('X-Api-Key', 'apikeyhere');
+        request.setRequestHeader('X-Api-Key', `${config.shlinkApiKey}`);
         request.setRequestHeader('Content-type', 'application/json');
         request.send(JSON.stringify(sendData));
         request.onload = (e) => {
-            var responseData = request.response;
-            document.getElementById("p1link").innerHTML = responseData;
+            var shortUrlOut = document.getElementById("output-shortUrl")
+            var responseData = JSON.parse(request.response);
+            shortUrlOut.value = `${config.shlinkOutUrl}/${responseData.shortCode}`;
+            var shlinkAppBtnRdUrl = `${config.shlinkAppUrl}/short-code/${responseData.shortCode}/visits`;
+            document.getElementById("p1qr-code").src = `${config.shlinkUrl}/${responseData.shortCode}/qr-code?size=160&format=png&margin=2&errorCorrection=L`;
         }
     });
 }
\ No newline at end of file
diff --git a/popup.css b/popup.css
index 9ab62d8..3c40314 100644
--- a/popup.css
+++ b/popup.css
@@ -1,22 +1,22 @@
 .container {
-    width: 360px;
-    color: #314d3e;
-  }
+  width: 420px;
+  color: #314d3e;
+}
   
-  .title {
-    font-size: 16px;
-    font-weight: bold;
-    padding: 10px;
-  }
+.title {
+  font-size: 16px;
+  font-weight: bold;
+  padding: 10px;
+}
   
-  .textbox {
-    width: 100%;
-    font-size: 10px;
-    margin: 0;
-    padding: 0px 2px;
-  }
+.textbox {
+  width: 100%;
+  font-size: 10px;
+  margin: 0;
+  padding: 0px 2px;
+}
   
-  .textbox:focus {
-    outline: 0;
-    border-color: #66afe9;
-  }
\ No newline at end of file
+.textbox:focus {
+  outline: 0;
+  border-color: #66afe9;
+}
\ No newline at end of file
diff --git a/popup.html b/popup.html
index 3a5abf5..d6bf9b3 100644
--- a/popup.html
+++ b/popup.html
@@ -1,10 +1,13 @@
 <link href="popup.css" rel="stylesheet" type="text/css" />
-<script type="module" src="popup-func.js"></script>
-
+<script src="popup-func.js"></script>
 <div class="container">
   <div>
-    <div class="title">redirect</div>
-    <button id="newButton">New</button><button id="searchButton">Search</button>
-    <p id="p1link">[click new to generate a link]</p>
+    <div class="title">Redirect Extention</div>
+    <button id="newButton">New</button>
+    <input id="output-shortUrl" type="text" disabled>
+    <button id="copyShortUrl-btn">Copy ShortUrl</button> <button id="openShlinkApp-btn">Open App</button>
+    <img id="p1qr-code" src="">
   </div>
-</div>
\ No newline at end of file
+</div>
+<script src="config.js"></script>
+<script src="popup.js"></script>
\ No newline at end of file
diff --git a/popup.js b/popup.js
new file mode 100644
index 0000000..16acac1
--- /dev/null
+++ b/popup.js
@@ -0,0 +1,36 @@
+var shlinkAppBtnRdUrl = `${config.shlinkAppUrl}`;
+
+const searchButton = document.getElementById('searchButton');
+if (searchButton) {
+    searchButton.addEventListener('click', () => {
+        searchRedirect();
+    });
+}
+
+const newButton = document.getElementById('newButton');
+if (newButton) {
+    newButton.addEventListener('click', () => {
+        newRedirect();
+    });
+}
+
+const copyShortUrlBtn = document.getElementById('copyShortUrl-btn');
+if (copyShortUrlBtn) {
+    copyShortUrlBtn.addEventListener('click', () => {
+        copyShortUrl();
+    });
+}
+
+const openShlinkAppBtn = document.getElementById('openShlinkApp-btn');
+if (openShlinkAppBtn) {
+    copyShortUrlBtn.addEventListener('click', () => {
+        chrome.tabs.create({url:shlinkAppBtnRdUrl});
+    });
+}
+
+function copyShortUrl () {
+    var shortUrlOut = document.getElementById("output-shortUrl");
+    shortUrlOut.select();
+    shortUrlOut.setSelectionRange(0, 99999);
+    navigator.clipboard.writeText(shortUrlOut.value);
+}
\ No newline at end of file