diff --git a/build.js b/build.js index 2eb65946..1b41d5aa 100755 --- a/build.js +++ b/build.js @@ -30,6 +30,7 @@ const pink = chalk.hex('#fa759e') const green = chalk.hex('#6FCF97') const gold = chalk.hex('#FFCA00') const lightBlue = chalk.hex('#4a81bc') +const purple = chalk.hex('#00f000') const normalText = blue const emphasis = pink.bold @@ -46,6 +47,7 @@ const commands = [ command: `npm run scss -- ${watchFlag}` }, bundleCommand('popup', gold), + bundleCommand('not-a-webpage', gold), bundleCommand('background', lightBlue), ] diff --git a/html/not-a-webpage.html b/html/not-a-webpage.html new file mode 100644 index 00000000..01e0c503 --- /dev/null +++ b/html/not-a-webpage.html @@ -0,0 +1,31 @@ + + + + Roar + + + + + +
+
+
+
+
Roar does not work on this tab because it is not a web page.
+
Please open Roar on a web page to try again.
+
+ +
+
+
+ + + diff --git a/html/popup.html b/html/popup.html index 92ea394c..2f32d663 100644 --- a/html/popup.html +++ b/html/popup.html @@ -8,7 +8,13 @@
-
+
+
+ +
+
diff --git a/scss/components/authenticating.scss b/scss/components/authenticating.scss index 97e1a60d..b82760ac 100644 --- a/scss/components/authenticating.scss +++ b/scss/components/authenticating.scss @@ -1,6 +1,7 @@ .authenticating { background-color: var(--background-color); + min-height: 388px; height: 100%; width: 100%; diff --git a/src/background/run.ts b/src/background/run.ts index 076102ba..69ff9a0c 100644 --- a/src/background/run.ts +++ b/src/background/run.ts @@ -13,6 +13,7 @@ import { AppStore, create } from './store' import { listeners } from './listeners' import * as apiHandlers from './api-handlers' +import { activeTab } from '../selectors' import { monitorChrome } from './monitorChrome' declare global { @@ -30,6 +31,17 @@ export function run(backgroundWindow: Window): void { store.on(listener, listeners[listener]!) } + store.subscribe(() => { + const state = store.getState() + const feedbackTarget = activeTab(state) + if (feedbackTarget) { + if (feedbackTarget.feedbackTargetType === 'tab' && !feedbackTarget.parsedUrl) { + return browser.browserAction.setPopup({ popup: '/html/not-a-webpage.html' }) + } + } + return browser.browserAction.setPopup({ popup: '/html/popup.html' }) + }) + // Monitor various events managed by the chrome API, dispatching relevant information to the store // see https://developer.chrome.com/docs/extensions/reference/ monitorChrome() diff --git a/src/not-a-webpage/index.ts b/src/not-a-webpage/index.ts new file mode 100644 index 00000000..232bbabc --- /dev/null +++ b/src/not-a-webpage/index.ts @@ -0,0 +1 @@ +document.getElementById('close-btn')!.addEventListener('click', () => window.close())