diff --git a/src/background.ts b/src/background.ts
new file mode 100644
index 0000000..e69de29
diff --git a/src/html/manifest.json b/src/html/manifest.json
new file mode 100644
index 0000000..bc261a5
--- /dev/null
+++ b/src/html/manifest.json
@@ -0,0 +1,43 @@
+{
+ "background": {
+ "persistent": false,
+ "scripts": ["background.js"]
+ },
+ "browser_action": {
+ "default_icon": {
+ "19": "graphics/wakatime-logo-19.png",
+ "38": "graphics/wakatime-logo-38.png"
+ },
+ "default_popup": "popup.html",
+ "default_title": "WakaTime"
+ },
+ "browser_specific_settings": {
+ "gecko": {
+ "id": "addon@wakatime.com",
+ "strict_min_version": "48.0"
+ }
+ },
+ "description": "Automatic time tracking for Chrome.",
+ "devtools_page": "devtools.html",
+ "homepage_url": "https://wakatime.com",
+ "icons": {
+ "16": "graphics/wakatime-logo-16.png",
+ "48": "graphics/wakatime-logo-48.png",
+ "128": "graphics/wakatime-logo-128.png"
+ },
+ "manifest_version": 2,
+ "name": "WakaTime",
+ "options_ui": {
+ "chrome_style": false,
+ "page": "options.html"
+ },
+ "permissions": [
+ "https://api.wakatime.com/*",
+ "https://wakatime.com/*",
+ "alarms",
+ "tabs",
+ "storage",
+ "idle"
+ ],
+ "version": "2.0.1"
+}
diff --git a/src/html/options.html b/src/html/options.html
new file mode 100644
index 0000000..8e99b17
--- /dev/null
+++ b/src/html/options.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+ WakaTime options
+
+
+
+
+
+
+
+
+
diff --git a/src/html/popup.html b/src/html/popup.html
new file mode 100644
index 0000000..47579fc
--- /dev/null
+++ b/src/html/popup.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+ WakaTime
+
+
+
+
+
+
+
+
+
diff --git a/src/options.tsx b/src/options.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/src/app.tsx b/src/popup.tsx
similarity index 100%
rename from src/app.tsx
rename to src/popup.tsx
diff --git a/webpack.config.ts b/webpack.config.ts
index 6ec7995..8a4d43e 100644
--- a/webpack.config.ts
+++ b/webpack.config.ts
@@ -4,15 +4,24 @@ import * as webpack from 'webpack';
import { CleanWebpackPlugin } from 'clean-webpack-plugin';
import CopyPlugin from 'copy-webpack-plugin';
+type BrowserTypes = 'chrome' | 'firefox';
+
const publicFolder = join(__dirname, 'public');
const cssFolder = join(publicFolder, 'css');
const fontFolder = join(publicFolder, 'fonts');
-export default (): webpack.Configuration[] => {
- const cfgs: webpack.Configuration[] = [];
- const chromeExtCfg: webpack.Configuration = {
+const graphicsFolder = join(__dirname, 'graphics');
+const srcFolder = join(__dirname, 'src');
+const htmlFolder = join(srcFolder, 'html');
+const manifestFile = join(__dirname, 'manifest.json');
+
+const getConfigByBrowser = (isProd: boolean, browser: BrowserTypes): webpack.Configuration => {
+ const cfg: webpack.Configuration = {
entry: {
- app: [join(__dirname, 'src', 'app.tsx')],
+ background: [join(srcFolder, 'background.ts')],
+ options: [join(srcFolder, 'options.tsx')],
+ popup: [join(srcFolder, 'popup.tsx')],
},
+ mode: isProd ? 'production' : 'development',
module: {
rules: [
{
@@ -23,7 +32,7 @@ export default (): webpack.Configuration[] => {
},
output: {
filename: '[name].js',
- path: join(__dirname, 'dist', 'chrome'),
+ path: join(__dirname, 'dist', browser),
},
plugins: [
new CleanWebpackPlugin(),
@@ -31,6 +40,10 @@ export default (): webpack.Configuration[] => {
patterns: [
{ from: cssFolder, to: 'public/css' },
{ from: fontFolder, to: 'public/fonts' },
+ { from: graphicsFolder, to: 'graphics' },
+ { from: htmlFolder },
+ // TODO: Create a mechanism to have a firefox manifest vs chrome
+ { from: manifestFile },
],
}),
],
@@ -38,7 +51,9 @@ export default (): webpack.Configuration[] => {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
},
};
- cfgs.push(chromeExtCfg);
-
- return cfgs;
+ return cfg;
+};
+export default (env: Record): webpack.Configuration[] => {
+ const isProd = env.mode === 'production';
+ return [getConfigByBrowser(isProd, 'chrome'), getConfigByBrowser(isProd, 'firefox')];
};