Add "system" theme setting for MacOS
This commit is contained in:
parent
089a232a60
commit
fd36720079
13 changed files with 174 additions and 35 deletions
|
@ -208,6 +208,7 @@
|
|||
switch (theme) {
|
||||
case 'dark':
|
||||
case 'light':
|
||||
case 'system':
|
||||
return theme;
|
||||
case 'android-dark':
|
||||
return 'dark';
|
||||
|
@ -231,7 +232,11 @@
|
|||
window.Events = {
|
||||
getDeviceName: () => textsecure.storage.user.getDeviceName(),
|
||||
|
||||
getThemeSetting: () => storage.get('theme-setting', 'light'),
|
||||
getThemeSetting: () =>
|
||||
storage.get(
|
||||
'theme-setting',
|
||||
window.platform === 'darwin' ? 'system' : 'light'
|
||||
),
|
||||
setThemeSetting: value => {
|
||||
storage.put('theme-setting', value);
|
||||
onChangeTheme();
|
||||
|
@ -326,6 +331,19 @@
|
|||
`New version detected: ${currentVersion}; previous: ${lastVersion}`
|
||||
);
|
||||
|
||||
const themeSetting = window.Events.getThemeSetting();
|
||||
const newThemeSetting = mapOldThemeToNew(themeSetting);
|
||||
|
||||
if (
|
||||
window.isBeforeVersion(lastVersion, 'v1.25.0') &&
|
||||
window.platform === 'darwin' &&
|
||||
newThemeSetting === window.systemTheme
|
||||
) {
|
||||
window.Events.setThemeSetting('system');
|
||||
} else {
|
||||
window.Events.setThemeSetting(newThemeSetting);
|
||||
}
|
||||
|
||||
if (window.isBeforeVersion(lastVersion, 'v1.25.0')) {
|
||||
// Stickers flags
|
||||
await Promise.all([
|
||||
|
@ -334,6 +352,7 @@
|
|||
]);
|
||||
}
|
||||
|
||||
// This one should always be last - it could restart the app
|
||||
if (window.isBeforeVersion(lastVersion, 'v1.15.0-beta.5')) {
|
||||
await window.Signal.Logs.deleteAll();
|
||||
window.restart();
|
||||
|
@ -411,10 +430,6 @@
|
|||
};
|
||||
startSpellCheck();
|
||||
|
||||
const themeSetting = window.Events.getThemeSetting();
|
||||
const newThemeSetting = mapOldThemeToNew(themeSetting);
|
||||
window.Events.setThemeSetting(newThemeSetting);
|
||||
|
||||
try {
|
||||
await Promise.all([
|
||||
ConversationController.load(),
|
||||
|
|
|
@ -9,7 +9,23 @@ $(document).on('keyup', e => {
|
|||
});
|
||||
|
||||
const $body = $(document.body);
|
||||
$body.addClass(`${window.theme}-theme`);
|
||||
|
||||
async function applyTheme() {
|
||||
'use strict';
|
||||
|
||||
const theme = await window.getThemeSetting();
|
||||
$body.removeClass('light-theme');
|
||||
$body.removeClass('dark-theme');
|
||||
$body.addClass(`${theme === 'system' ? window.systemTheme : theme}-theme`);
|
||||
}
|
||||
|
||||
applyTheme();
|
||||
|
||||
window.subscribeToSystemThemeChange(() => {
|
||||
'use strict';
|
||||
|
||||
applyTheme();
|
||||
});
|
||||
|
||||
window.view = new Whisper.ConfirmationDialogView({
|
||||
message: i18n('audioPermissionNeeded'),
|
||||
|
|
|
@ -9,7 +9,23 @@ $(document).on('keyup', e => {
|
|||
});
|
||||
|
||||
const $body = $(document.body);
|
||||
$body.addClass(`${window.theme}-theme`);
|
||||
|
||||
async function applyTheme() {
|
||||
'use strict';
|
||||
|
||||
const theme = await window.getThemeSetting();
|
||||
$body.removeClass('light-theme');
|
||||
$body.removeClass('dark-theme');
|
||||
$body.addClass(`${theme === 'system' ? window.systemTheme : theme}-theme`);
|
||||
}
|
||||
|
||||
applyTheme();
|
||||
|
||||
window.subscribeToSystemThemeChange(() => {
|
||||
'use strict';
|
||||
|
||||
applyTheme();
|
||||
});
|
||||
|
||||
// eslint-disable-next-line strict
|
||||
const getInitialData = async () => ({
|
||||
|
|
|
@ -8,6 +8,14 @@
|
|||
|
||||
window.Whisper = window.Whisper || {};
|
||||
|
||||
function resolveTheme() {
|
||||
const theme = storage.get('theme-setting') || 'light';
|
||||
if (window.platform === 'darwin' && theme === 'system') {
|
||||
return window.systemTheme;
|
||||
}
|
||||
return theme;
|
||||
}
|
||||
|
||||
Whisper.AppView = Backbone.View.extend({
|
||||
initialize() {
|
||||
this.inboxView = null;
|
||||
|
@ -15,14 +23,18 @@
|
|||
|
||||
this.applyTheme();
|
||||
this.applyHideMenu();
|
||||
|
||||
window.subscribeToSystemThemeChange(() => {
|
||||
this.applyTheme();
|
||||
});
|
||||
},
|
||||
events: {
|
||||
'click .openInstaller': 'openInstaller', // NetworkStatusView has this button
|
||||
openInbox: 'openInbox',
|
||||
},
|
||||
applyTheme() {
|
||||
const theme = resolveTheme();
|
||||
const iOS = storage.get('userAgent') === 'OWI';
|
||||
const theme = storage.get('theme-setting') || 'light';
|
||||
this.$el
|
||||
.removeClass('light-theme')
|
||||
.removeClass('dark-theme')
|
||||
|
|
|
@ -88,7 +88,9 @@
|
|||
$(document.body)
|
||||
.removeClass('dark-theme')
|
||||
.removeClass('light-theme')
|
||||
.addClass(`${theme}-theme`);
|
||||
.addClass(
|
||||
`${theme === 'system' ? window.systemTheme : theme}-theme`
|
||||
);
|
||||
window.setThemeSetting(theme);
|
||||
},
|
||||
});
|
||||
|
@ -143,8 +145,10 @@
|
|||
audioNotificationDescription: i18n('audioNotificationDescription'),
|
||||
isAudioNotificationSupported: Settings.isAudioNotificationSupported(),
|
||||
isHideMenuBarSupported: Settings.isHideMenuBarSupported(),
|
||||
hasSystemTheme: window.platform === 'darwin',
|
||||
themeLight: i18n('themeLight'),
|
||||
themeDark: i18n('themeDark'),
|
||||
themeSystem: i18n('themeSystem'),
|
||||
hideMenuBar: i18n('hideMenuBar'),
|
||||
clearDataHeader: i18n('clearDataHeader'),
|
||||
clearDataButton: i18n('clearDataButton'),
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue