Refactor extension to webpack
This change is the biggest in the history of the project. The entire
project has been refactored so it is built with webpack.
This involves:
- Creating webpack and npm config files.
- Fixing some bugs in the code due to the fact that webpack uses strict
mode.
- Merging some pieces of code which were shared throughout the codebase
(not exhaustive, more work should be done in this direction).
- Splitting the console_inject.js file into separate files (it had 1000+
lines).
- Adapting all the build-related files (Makefile, bash scripts, etc.)
- Changing the docs to explain the new build process.
- Changing the Zuul playbook/roles to adapt to the new build process.
Change-Id: I16476d47825461c3a318b3f1a1eddb06b2df2e89
diff --git a/src/contentScripts/communityConsole/darkMode.js b/src/contentScripts/communityConsole/darkMode.js
new file mode 100644
index 0000000..d10a77c
--- /dev/null
+++ b/src/contentScripts/communityConsole/darkMode.js
@@ -0,0 +1,49 @@
+import {createExtBadge} from './utils.js';
+
+export function injectDarkModeButton(rightControl, previousDarkModeOption) {
+ var darkThemeSwitch = document.createElement('material-button');
+ darkThemeSwitch.classList.add('TWPT-dark-theme', 'TWPT-btn--with-badge');
+ darkThemeSwitch.setAttribute('button', '');
+ darkThemeSwitch.setAttribute(
+ 'title', chrome.i18n.getMessage('inject_ccdarktheme_helper'));
+
+ darkThemeSwitch.addEventListener('click', e => {
+ chrome.storage.sync.get(null, currentOptions => {
+ currentOptions.ccdarktheme_switch_status = !previousDarkModeOption;
+ chrome.storage.sync.set(currentOptions, _ => {
+ location.reload();
+ });
+ });
+ });
+
+ var switchContent = document.createElement('div');
+ switchContent.classList.add('content');
+
+ var icon = document.createElement('material-icon');
+
+ var i = document.createElement('i');
+ i.classList.add('material-icon-i', 'material-icons-extended');
+ i.textContent = 'brightness_4';
+
+ icon.appendChild(i);
+ switchContent.appendChild(icon);
+ darkThemeSwitch.appendChild(switchContent);
+
+ var badgeContent = createExtBadge();
+
+ darkThemeSwitch.appendChild(badgeContent);
+
+ rightControl.style.width =
+ (parseInt(window.getComputedStyle(rightControl).width) + 58) + 'px';
+ rightControl.insertAdjacentElement('afterbegin', darkThemeSwitch);
+}
+
+export function isDarkThemeOn(options) {
+ if (!options.ccdarktheme) return false;
+
+ if (options.ccdarktheme_mode == 'switch')
+ return options.ccdarktheme_switch_status;
+
+ return window.matchMedia &&
+ window.matchMedia('(prefers-color-scheme: dark)').matches;
+}