diff options
author | Stefan Malzner <stefan@adlk.io> | 2018-11-22 11:36:11 +0100 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2018-11-22 11:36:11 +0100 |
commit | fd7954fef99d59ca0aa9f2b468afea3463ef2202 (patch) | |
tree | dd83cc2efd0e8ec54679b4db80ed1b5dd086feb6 /src/webview | |
parent | Fix isFullScreen typo (diff) | |
download | ferdium-app-fd7954fef99d59ca0aa9f2b468afea3463ef2202.tar.gz ferdium-app-fd7954fef99d59ca0aa9f2b468afea3463ef2202.tar.zst ferdium-app-fd7954fef99d59ca0aa9f2b468afea3463ef2202.zip |
feat(App): Add option to enable dark mode for supported services
Diffstat (limited to 'src/webview')
-rw-r--r-- | src/webview/darkmode.js | 28 | ||||
-rw-r--r-- | src/webview/plugin.js | 33 |
2 files changed, 58 insertions, 3 deletions
diff --git a/src/webview/darkmode.js b/src/webview/darkmode.js new file mode 100644 index 000000000..9830ef33c --- /dev/null +++ b/src/webview/darkmode.js | |||
@@ -0,0 +1,28 @@ | |||
1 | import path from 'path'; | ||
2 | import fs from 'fs-extra'; | ||
3 | |||
4 | const ID = 'franz-theme-dark-mode'; | ||
5 | |||
6 | export function injectDarkModeStyle(recipePath) { | ||
7 | const darkModeStyle = path.join(recipePath, 'darkmode.css'); | ||
8 | if (fs.pathExistsSync(darkModeStyle)) { | ||
9 | const data = fs.readFileSync(darkModeStyle); | ||
10 | const styles = document.createElement('style'); | ||
11 | styles.id = ID; | ||
12 | styles.innerHTML = data.toString(); | ||
13 | |||
14 | document.querySelector('head').appendChild(styles); | ||
15 | } | ||
16 | } | ||
17 | |||
18 | export function removeDarkModeStyle() { | ||
19 | const style = document.querySelector(`#${ID}`); | ||
20 | |||
21 | if (style) { | ||
22 | style.remove(); | ||
23 | } | ||
24 | } | ||
25 | |||
26 | export function isDarkModeStyleInjected() { | ||
27 | return !!document.querySelector(`#${ID}`); | ||
28 | } | ||
diff --git a/src/webview/plugin.js b/src/webview/plugin.js index ee8cedbab..e6fdc4efd 100644 --- a/src/webview/plugin.js +++ b/src/webview/plugin.js | |||
@@ -6,10 +6,14 @@ import { isDevMode } from '../environment'; | |||
6 | import RecipeWebview from './lib/RecipeWebview'; | 6 | import RecipeWebview from './lib/RecipeWebview'; |
7 | 7 | ||
8 | import Spellchecker from './spellchecker'; | 8 | import Spellchecker from './spellchecker'; |
9 | import { injectDarkModeStyle, isDarkModeStyleInjected, removeDarkModeStyle } from './darkmode'; | ||
9 | import './notifications'; | 10 | import './notifications'; |
10 | 11 | ||
11 | const debug = require('debug')('Franz:Plugin'); | 12 | const debug = require('debug')('Franz:Plugin'); |
12 | 13 | ||
14 | window.franzSettings = {}; | ||
15 | let serviceData; | ||
16 | |||
13 | ipcRenderer.on('initializeRecipe', (e, data) => { | 17 | ipcRenderer.on('initializeRecipe', (e, data) => { |
14 | const modulePath = path.join(data.recipe.path, 'webview.js'); | 18 | const modulePath = path.join(data.recipe.path, 'webview.js'); |
15 | // Delete module from cache | 19 | // Delete module from cache |
@@ -17,7 +21,14 @@ ipcRenderer.on('initializeRecipe', (e, data) => { | |||
17 | try { | 21 | try { |
18 | // eslint-disable-next-line | 22 | // eslint-disable-next-line |
19 | require(modulePath)(new RecipeWebview(), data); | 23 | require(modulePath)(new RecipeWebview(), data); |
20 | debug('Initialize Recipe'); | 24 | debug('Initialize Recipe', data); |
25 | |||
26 | serviceData = data; | ||
27 | |||
28 | if (data.isDarkModeEnabled) { | ||
29 | injectDarkModeStyle(data.recipe.path); | ||
30 | debug('Add dark theme styles'); | ||
31 | } | ||
21 | } catch (err) { | 32 | } catch (err) { |
22 | debug('Recipe initialization failed', err); | 33 | debug('Recipe initialization failed', err); |
23 | } | 34 | } |
@@ -33,11 +44,27 @@ new ContextMenuListener((info) => { // eslint-disable-line | |||
33 | }); | 44 | }); |
34 | 45 | ||
35 | ipcRenderer.on('settings-update', (e, data) => { | 46 | ipcRenderer.on('settings-update', (e, data) => { |
36 | spellchecker.toggleSpellchecker(data.enableSpellchecking); | ||
37 | debug('Settings update received', data); | 47 | debug('Settings update received', data); |
48 | |||
49 | spellchecker.toggleSpellchecker(data.enableSpellchecking); | ||
50 | window.franzSettings = data; | ||
51 | }); | ||
52 | |||
53 | ipcRenderer.on('service-settings-update', (e, data) => { | ||
54 | debug('Service settings update received', data); | ||
55 | |||
56 | if (data.isDarkModeEnabled && !isDarkModeStyleInjected()) { | ||
57 | injectDarkModeStyle(serviceData.recipe.path); | ||
58 | |||
59 | debug('Enable service dark mode'); | ||
60 | } else if (!data.isDarkModeEnabled && isDarkModeStyleInjected()) { | ||
61 | removeDarkModeStyle(); | ||
62 | |||
63 | debug('Disable service dark mode'); | ||
64 | } | ||
38 | }); | 65 | }); |
39 | 66 | ||
40 | // initSpellche | 67 | // initSpellchecker |
41 | 68 | ||
42 | document.addEventListener('DOMContentLoaded', () => { | 69 | document.addEventListener('DOMContentLoaded', () => { |
43 | ipcRenderer.sendToHost('hello'); | 70 | ipcRenderer.sendToHost('hello'); |