diff --git a/background.html b/background.html new file mode 100644 index 0000000..e7dd729 --- /dev/null +++ b/background.html @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/index.html b/index.html index 3b9ba8b..3fc1d66 100644 --- a/index.html +++ b/index.html @@ -11,6 +11,6 @@
- + diff --git a/manifest.json b/manifest.json index 4d279ab..78f0e7e 100644 --- a/manifest.json +++ b/manifest.json @@ -11,14 +11,20 @@ "48": "icons/splitscreen-48.png", "128": "icons/splitscreen-128.png" }, + "background": { + "page": "background.html" + }, + "browser_action": { + "default_icon": { + "16": "icons/splitscreen-16.png" + }, + "default_title": "Click to open Split Screen" + }, "permissions": [ "management", "storage", "webRequest", "webRequestBlocking", "" - ], - "chrome_url_overrides": { - "newtab": "index.html" - } -} \ No newline at end of file + ] +} diff --git a/src/bg.js b/src/bg.js new file mode 100644 index 0000000..68b0670 --- /dev/null +++ b/src/bg.js @@ -0,0 +1,45 @@ +'use strict'; +(function () { + const _LOG_ = localStorage.log; + const UA = navigator.userAgent; + const WebExtensions = UA.includes("Chrome") ? chrome : browser; + const manifest = WebExtensions.runtime.getManifest(); + if (_LOG_) { + console.log(...logGen(null, manifest.name, manifest.version + " start")); + }; + WebExtensions.browserAction.onClicked.addListener((tab) => { + if (_LOG_) { + console.log(...logGen(tab.id, "browserAction.onClicked", "")); + } + WebExtensions.tabs.create({ url:"/index.html", active: true }, (newTab) => { + if (!handleError("tabs.create")()) { + console.log(...logGen(tab.id, "tabs.create", " ok")); + } else { + console.log(...logGen(tab.id, "tabs.create", " failed")); + } + }); + }); + function handleError(label) { + return () => { + if (WebExtensions.runtime.lastError) { + if (_LOG_) { + console.error(...logGen(label, "chrome.runtime.lastError", WebExtensions.runtime.lastError.message)); + } + return true; + } + return false; + }; + }; + function logColor(tabId) { + const _r = tabId % 64; + return "color:#" + ((_r >> 4 & 3) << 22 | (_r >> 2 & 3) << 14 | (_r & 3) << 6 | 1048576).toString(16); + } + function logGen(tabId, eventName, message) { + if (tabId) { + return ["tabId %c" + tabId + "%c [" + eventName + "]%c " + message, logColor(tabId), "color:#f60b91", ""]; + } else { + return ["%c%c[" + eventName + "]%c " + message, logColor(tabId), "color:#f60b91", ""]; + } + } +})(); + diff --git a/webpack.config.js b/webpack.config.js index 76a86f5..5af56d8 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -2,11 +2,14 @@ var path = require('path') var webpack = require('webpack') module.exports = { - entry: './src/main.js', + entry: { + bg: './src/bg.js', + main: './src/main.js' + }, output: { path: path.resolve(__dirname, './dist'), publicPath: '/dist/', - filename: 'build.js' + filename: '[name].js', }, module: { rules: [ @@ -16,7 +19,7 @@ module.exports = { 'vue-style-loader', 'css-loader' ], - }, { + }, { test: /\.vue$/, loader: 'vue-loader', options: {