From: Ruben Beltran del Rio Date: Sun, 27 Sep 2020 16:14:53 +0000 (+0200) Subject: Add chrome compatibility X-Git-Url: https://git.r.bdr.sh/rbdr/junction/commitdiff_plain/a94a5407e22b3287db369edad92679f98bc2cb52?ds=sidebyside;hp=-c Add chrome compatibility --- a94a5407e22b3287db369edad92679f98bc2cb52 diff --git a/CHANGELOG.md b/CHANGELOG.md index 0d49813..f8a499d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Added - This changelog - Firefox extension configuration +- Chrome extension configuration - Rudimentary state control in the extension [Unreleased]: https://gitlab.com/rbdr/junction/compare/v1.0.0...HEAD diff --git a/README.md b/README.md index 9e420d3..036203a 100644 --- a/README.md +++ b/README.md @@ -11,3 +11,9 @@ on the `This Firefox` option. Then click on `Load Temporary Add-On` and point the browser to the `extension/manifest.json` file. This will enable the extension and will allow you to use the inspector to debug. + +### Testing on Chrome + +In order to test on chrome, first go to `chrome://extensions/`. Make sure +`Developer mode` is enabled. Then click `Load Unpacked` and point the browser +to the `extension` directory. diff --git a/extension/junction.js b/extension/junction.js index 7de7c28..575a716 100644 --- a/extension/junction.js +++ b/extension/junction.js @@ -1,5 +1,6 @@ const internals = { + promisesSupported: !!(window.browser), isInCallState: false, icons: { @@ -26,12 +27,11 @@ const internals = { internals.isInCallState = true; internals.setIcon('hangUp'); - const tabs = await browser.tabs.query({ - currentWindow: true, - active: true - }); + console.log('setting tabs'); + const activeTabs = await internals.getActiveTabs(); - internals.createAudioElement(browser.runtime.getURL('sounds/tada.wav')); + console.log(activeTabs[0].url); // placeholder while we connect backend. + internals.createAudioElement(internals.getRoot().runtime.getURL('sounds/tada.wav')); }, hangUp() { @@ -41,11 +41,12 @@ const internals = { internals.isInCallState = false; }, - createAudioElement(source) { + createAudioElement(source, type = 'audio/wav') { const audioElement = document.createElement('audio'); audioElement.src = source; audioElement.autoplay = 'autoplay'; + audioElement.type = type; document.querySelector('body').appendChild(audioElement); }, @@ -55,10 +56,37 @@ const internals = { setIcon(iconSet) { - browser.browserAction.setIcon({ + internals.getRoot().browserAction.setIcon({ path: internals.icons[iconSet] }); - } + }, + + getRoot() { + + return window.browser || window.chrome; + }, + + // Chrome doesn't yet implement the promise based tabs.query :'( + + getActiveTabs() { + + const query = { + currentWindow: true, + active: true + }; + + if (internals.promisesSupported) { + return internals.getRoot().tabs.query(query); + } + + return new Promise((resolve, reject) => { + + internals.getRoot().tabs.query(query, (tabs) => { + + return resolve(tabs); + }); + }); + }, }; -browser.browserAction.onClicked.addListener(internals.onClick); +internals.getRoot().browserAction.onClicked.addListener(internals.onClick);