From 972080cae3479d124622939ec8a4358264f66ee7 Mon Sep 17 00:00:00 2001 From: Martin Kalcher Date: Fri, 28 Jan 2022 08:57:50 +0100 Subject: [PATCH 1/2] chrome compat --- background.js | 1 + content_script.js | 22 +++++++--------------- manifest.json | 8 +++++++- options/index.html | 7 ++++--- options/script.js | 27 +++++++-------------------- storage.js | 42 ++++++++++++++++++++++++++++++++++++++++++ 6 files changed, 68 insertions(+), 39 deletions(-) create mode 100644 background.js create mode 100644 storage.js diff --git a/background.js b/background.js new file mode 100644 index 0000000..0bd3244 --- /dev/null +++ b/background.js @@ -0,0 +1 @@ +trektorRuntime.onMessage((args) => fetch(...args).then((response) => response.json())); diff --git a/content_script.js b/content_script.js index 83a76cc..bb34f65 100644 --- a/content_script.js +++ b/content_script.js @@ -1,11 +1,3 @@ -let engine; - -if (window.browser !== undefined) { - engine = browser; -} else { - engine = chrome; -} - function addButton() { const sidebar = document.querySelector(".window-sidebar") const button = document.createElement('span'); @@ -37,7 +29,7 @@ const mappings = { function onClick() { let trelloApiKey = "afadffe77f745496f80ebb4bf460c615" - engine.storage.local.get().then(result => { + trektorStorage.get(['trello', 'toggl']).then(result => { const trelloToken = result.trello const togglToken = result.toggl @@ -94,12 +86,12 @@ function onClick() { url = new URL("https://api.track.toggl.com/api/v8/workspaces") const togglAuth = btoa(`${togglToken}:api_token`) - fetch(url.toString(), { + trektorRuntime.sendMessage([url.toString(), { headers: { 'Authorization': `Basic ${togglAuth}`, 'Content-Type': 'application/json' } - }).then(response => response.json()).then(response => { + }]).then(response => { for (var i in response) { if (response[i]["name"] == "aboutsource") { var wid = response[i]["id"] @@ -111,12 +103,12 @@ function onClick() { } url = new URL(`https://api.track.toggl.com/api/v8/workspaces/${wid}/projects`) - fetch(url.toString(), { + trektorRuntime.sendMessage([url.toString(), { headers: { 'Authorization': `Basic ${togglAuth}`, 'Content-Type': 'application/json' } - }).then(response => response.json()).then(response => { + }]).then(response => { for (var i in response) { if (response[i]["name"].endsWith(`(${labelShort})`)) { var pid = response[i]["id"] @@ -128,14 +120,14 @@ function onClick() { "pid": pid } } - fetch(url.toString(), { + trektorRuntime.sendMessage([url.toString(), { method: 'POST', headers: { 'Authorization': `Basic ${togglAuth}`, 'Content-Type': 'application/json' }, body: JSON.stringify(data) - }) + }]) } } }) diff --git a/manifest.json b/manifest.json index 6d9c6ed..40cec08 100644 --- a/manifest.json +++ b/manifest.json @@ -13,11 +13,17 @@ "*://trello.com/*" ], "js": [ + "storage.js", "content_script.js" ] } ], - + "background": { + "scripts": [ + "storage.js", + "background.js" + ] + }, "permissions": [ "*://api.trello.com/*", "*://*.toggl.com/*", diff --git a/options/index.html b/options/index.html index f21cce0..d8da5ba 100644 --- a/options/index.html +++ b/options/index.html @@ -11,8 +11,9 @@

Trektor settings

Trello Token generieren
-
Toggl Token (ziemlich weit runter scrollen)
-


- +
Toggl Token (ziemlich weit runter scrollen)
+


+ + diff --git a/options/script.js b/options/script.js index 065c504..f5d32fb 100644 --- a/options/script.js +++ b/options/script.js @@ -1,27 +1,14 @@ -let engine; - -if (window.browser !== undefined) { - engine = browser; -} else { - engine = chrome; -} - -const trelloTextField = document.querySelector("#trello_token") -const togglTextField = document.querySelector("#toggl_token") +let trelloTextField = document.querySelector("#trello_token") +let togglTextField = document.querySelector("#toggl_token") trelloTextField.addEventListener("input", onChange) togglTextField.addEventListener("input", onChange) -function onChange() { - engine.storage.local.set({ - "trello": trelloTextField.value, - "toggl": togglTextField.value - }) - console.log(`set trello token to ${togglTextField.value}`) - console.log(`set toggl token to ${togglTextField.value}`) +function onChange(e) { + trektorStorage.set({[e.target.name]: e.target.value}); } -engine.storage.local.get().then(result => { - trelloTextField.value = result["trello"] - togglTextField.value = result["toggl"] +trektorStorage.get(['trello', 'toggl']).then(result => { + trelloTextField.value = result.trello; + togglTextField.value = result.toggl; }) diff --git a/storage.js b/storage.js new file mode 100644 index 0000000..6683b10 --- /dev/null +++ b/storage.js @@ -0,0 +1,42 @@ +class ChromeStorage { + constructor() { + this.storage = chrome.storage.local; + } + get(keys) { + return new Promise((resolve) => { + this.storage.get(keys, resolve); + }) + } + set(values) { + return new Promise((resolve) => { + this.storage.set(values, resolve); + }) + } +} + +class ChromeRuntime { + constructor() { + this.runtime = chrome.runtime; + } + + sendMessage(msg) { + return new Promise((resolve) => { + this.runtime.sendMessage(msg, resolve); + }); + } + + onMessage(callback) { + this.runtime.onMessage.addListener((msg, sender, respond) => { + callback(msg).then((response) => { respond(response) }); + return true; + }); + } +} + +if (window.chrome !== undefined) { + window.trektorStorage = new ChromeStorage(); + window.trektorRuntime = new ChromeRuntime(); +} else { + window.trektorStorage = browser.storage.local; + window.trektorRuntime = browser.runtime; +} From af28d733cbf4766cb91f424b3af0dacbff4656b0 Mon Sep 17 00:00:00 2001 From: Martin Kalcher Date: Fri, 28 Jan 2022 09:28:15 +0100 Subject: [PATCH 2/2] minor cleanup --- background.js | 13 ++++++++++++- content_script.js | 14 +++++++------- manifest.json | 4 ++-- options/index.html | 2 +- options/script.js | 4 ++-- storage.js => trektor.js | 20 ++++++++++++++++---- 6 files changed, 40 insertions(+), 17 deletions(-) rename storage.js => trektor.js (65%) diff --git a/background.js b/background.js index 0bd3244..b8a73f5 100644 --- a/background.js +++ b/background.js @@ -1 +1,12 @@ -trektorRuntime.onMessage((args) => fetch(...args).then((response) => response.json())); +trektor.runtime.onMessage((msg) => { + switch (msg.action) { + case 'fetchJSON': + return fetchJSON(...msg.args); + default: + return Promise.reject('unknown action'); + } +}); + +function fetchJSON(url, options = {}) { + return fetch(url, options).then((response) => response.json()); +} diff --git a/content_script.js b/content_script.js index bb34f65..dbde5ff 100644 --- a/content_script.js +++ b/content_script.js @@ -29,7 +29,7 @@ const mappings = { function onClick() { let trelloApiKey = "afadffe77f745496f80ebb4bf460c615" - trektorStorage.get(['trello', 'toggl']).then(result => { + trektor.storage.get(['trello', 'toggl']).then(result => { const trelloToken = result.trello const togglToken = result.toggl @@ -86,12 +86,12 @@ function onClick() { url = new URL("https://api.track.toggl.com/api/v8/workspaces") const togglAuth = btoa(`${togglToken}:api_token`) - trektorRuntime.sendMessage([url.toString(), { + trektor.fetchJSON(url.toString(), { headers: { 'Authorization': `Basic ${togglAuth}`, 'Content-Type': 'application/json' } - }]).then(response => { + }).then(response => { for (var i in response) { if (response[i]["name"] == "aboutsource") { var wid = response[i]["id"] @@ -103,12 +103,12 @@ function onClick() { } url = new URL(`https://api.track.toggl.com/api/v8/workspaces/${wid}/projects`) - trektorRuntime.sendMessage([url.toString(), { + trektor.fetchJSON(url.toString(), { headers: { 'Authorization': `Basic ${togglAuth}`, 'Content-Type': 'application/json' } - }]).then(response => { + }).then(response => { for (var i in response) { if (response[i]["name"].endsWith(`(${labelShort})`)) { var pid = response[i]["id"] @@ -120,14 +120,14 @@ function onClick() { "pid": pid } } - trektorRuntime.sendMessage([url.toString(), { + trektor.fetchJSON(url.toString(), { method: 'POST', headers: { 'Authorization': `Basic ${togglAuth}`, 'Content-Type': 'application/json' }, body: JSON.stringify(data) - }]) + }) } } }) diff --git a/manifest.json b/manifest.json index 40cec08..939d602 100644 --- a/manifest.json +++ b/manifest.json @@ -13,14 +13,14 @@ "*://trello.com/*" ], "js": [ - "storage.js", + "trektor.js", "content_script.js" ] } ], "background": { "scripts": [ - "storage.js", + "trektor.js", "background.js" ] }, diff --git a/options/index.html b/options/index.html index d8da5ba..743838d 100644 --- a/options/index.html +++ b/options/index.html @@ -13,7 +13,7 @@

Trektor settings

Trello Token generieren

Toggl Token (ziemlich weit runter scrollen)



- + diff --git a/options/script.js b/options/script.js index f5d32fb..37fc709 100644 --- a/options/script.js +++ b/options/script.js @@ -5,10 +5,10 @@ trelloTextField.addEventListener("input", onChange) togglTextField.addEventListener("input", onChange) function onChange(e) { - trektorStorage.set({[e.target.name]: e.target.value}); + trektor.storage.set({[e.target.name]: e.target.value}); } -trektorStorage.get(['trello', 'toggl']).then(result => { +trektor.storage.get(['trello', 'toggl']).then(result => { trelloTextField.value = result.trello; togglTextField.value = result.toggl; }) diff --git a/storage.js b/trektor.js similarity index 65% rename from storage.js rename to trektor.js index 6683b10..936e86b 100644 --- a/storage.js +++ b/trektor.js @@ -33,10 +33,22 @@ class ChromeRuntime { } } +window.trektor = { + storage: null, + runtime: null, + + fetchJSON(url, options = {}) { + return this.runtime.sendMessage({ + action: 'fetchJSON', + args: [url, options], + }); + }, +}; + if (window.chrome !== undefined) { - window.trektorStorage = new ChromeStorage(); - window.trektorRuntime = new ChromeRuntime(); + window.trektor.storage = new ChromeStorage(); + window.trektor.runtime = new ChromeRuntime(); } else { - window.trektorStorage = browser.storage.local; - window.trektorRuntime = browser.runtime; + window.trektor.storage = browser.storage.local; + window.trektor.runtime = browser.runtime; }