Skip to content

Commit 3d80403

Browse files
committed
New: Switch to night/light mode when the OS does it
1 parent 9297d00 commit 3d80403

22 files changed

+90
-7
lines changed

CHANGELOG.md

+1
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
1414
- Change page using an input range [`527999c`](https://github.com/ollm/OpenComic/commit/527999ccacf16beea2387f7eef2f6cb7648fb2d5)
1515
- Go to page writing it in a dialog [`2d7a028`](https://github.com/ollm/OpenComic/commit/2d7a02853d27752094555275e77cdc7ad2ca3771)
1616
- Global zoom in the slide reading [`da36774`](https://github.com/ollm/OpenComic/commit/da3677414846e04d9d540ad9ed79f9e66b1175a2)
17+
- Switch to night/light mode when the OS does it
1718

1819
##### 🐛 Bug Fixes
1920

languages/ca.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "Només si l'última lectura és de la biblioteca.",
195195
"startOnStartup": "Iniciar OpenComic a l'inici"
196196
},
197+
"theme": {
198+
"systemNightMode": "Canviar al mode nit/clar quan el sistema operatiu ho faci"
199+
},
197200
"releases": {
198201
"main": "Comprovar noves versions",
199202
"checkReleases": "Comprovar si hi ha una nova versió en iniciar OpenComic",

languages/cs.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/de.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/en.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "Only if last reading is from the library",
195195
"startOnStartup": "Start OpenComic on startup"
196196
},
197+
"theme": {
198+
"systemNightMode": "Switch to night/light mode when the OS does it"
199+
},
197200
"releases": {
198201
"main": "Check for new versions",
199202
"checkReleases": "Check if there is a new version when starting OpenComic",

languages/es.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "Sólo si la última lectura es de la biblioteca",
195195
"startOnStartup": "Iniciar OpenComic al inicio"
196196
},
197+
"theme": {
198+
"systemNightMode": "Cambiar al modo noche/claro cuando el sistema operativo lo haga"
199+
},
197200
"releases": {
198201
"main": "Comprobar nuevas versiones",
199202
"checkReleases": "Comprobar si existe una nueva versión al iniciar OpenComic",

languages/fr.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/hu.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/it.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/ja.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/pt-br.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/ru.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/th.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "เฉพาะการอ่านล่าสุดจากห้องสมุด",
195195
"startOnStartup": "เปิด OpenComic เมื่อเริ่มต้นระบบ"
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "ตรวจหาเวอร์ชั่นใหม่",
199202
"checkReleases": "ตรวจหาเวอร์ชั่นใหม่เมื่อเปิด OpenComic",

languages/vi.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

languages/zh-hans.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "仅当来自库的最后一次阅读时",
195195
"startOnStartup": "开机启动时打开 OpenComic"
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "检查新版本",
199202
"checkReleases": "启动 OpenComic 时检查是否有新版本",

languages/zh-hant.json

+3
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,9 @@
194194
"startOnlyFromLibrary": "",
195195
"startOnStartup": ""
196196
},
197+
"theme": {
198+
"systemNightMode": ""
199+
},
197200
"releases": {
198201
"main": "",
199202
"checkReleases": "",

scripts/dom.js

+8-6
Original file line numberDiff line numberDiff line change
@@ -1274,19 +1274,21 @@ function selectElement(element)
12741274

12751275
//Enable/Disable night mode
12761276

1277-
function nightMode()
1277+
function nightMode(force = null)
12781278
{
1279-
if($('.app').hasClass('night-mode'))
1279+
let _app = document.querySelector('.app');
1280+
1281+
if((force === null && _app.classList.contains('night-mode')) || force === false)
12801282
{
1281-
$('.app').removeClass('night-mode');
1282-
$('.button-night-mode').html('light_mode');
1283+
_app.classList.remove('night-mode');
1284+
dom.queryAll('.button-night-mode').html('light_mode');
12831285
handlebarsContext.nightMode = false;
12841286
storage.updateVar('config', 'nightMode', false);
12851287
}
12861288
else
12871289
{
1288-
$('.app').addClass('night-mode');
1289-
$('.button-night-mode').html('dark_mode');
1290+
_app.classList.add('night-mode');
1291+
dom.queryAll('.button-night-mode').html('dark_mode');
12901292
handlebarsContext.nightMode = true;
12911293
storage.updateVar('config', 'nightMode', true);
12921294
}

scripts/opencomic.js

+1
Original file line numberDiff line numberDiff line change
@@ -288,6 +288,7 @@ window.onload = function() {
288288
loadLanguage(config.language);
289289

290290
template.loadInQuery('body', 'body.html');
291+
theme.systemNightMode();
291292

292293
titleBar.start();
293294
titleBar.setColors();

scripts/storage.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
var changes = 62; // Update this if readingPagesConfig is updated
1+
var changes = 63; // Update this if readingPagesConfig is updated
22

33
var readingPagesConfig = {
44
readingConfigName: '',
@@ -77,6 +77,7 @@ var storageDefault = {
7777
theme: 'material-design',
7878
themeColor: 'blue',
7979
nightMode: false,
80+
systemNightMode: false,
8081
zoomFactor: 1,
8182
foldersFirst: true,
8283
view: 'module',

scripts/theme.js

+22
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,27 @@ function setColor(color)
3131
titleBar.setColors();
3232
}
3333

34+
var nightMode;
35+
36+
function _systemNightMode()
37+
{
38+
if(config.systemNightMode)
39+
{
40+
if(nightMode.matches)
41+
dom.nightMode(true);
42+
else
43+
dom.nightMode(false);
44+
}
45+
}
46+
47+
function systemNightMode()
48+
{
49+
nightMode = window.matchMedia('(prefers-color-scheme: dark)');
50+
nightMode.addEventListener('change', _systemNightMode);
51+
52+
_systemNightMode();
53+
}
54+
3455
function start()
3556
{
3657
events.events();
@@ -76,5 +97,6 @@ function start()
7697

7798
module.exports = {
7899
setColor: setColor,
100+
systemNightMode: systemNightMode,
79101
start: start,
80102
};

templates/settings.content.right.html

+10
Original file line numberDiff line numberDiff line change
@@ -209,6 +209,16 @@ <h2 class="headline-small">{{language.settings.startupBehavior.main}}</h2>
209209
</div>
210210
</div>
211211

212+
<h2 class="headline-small">{{language.global.theme}}</h2>
213+
214+
<div class="menu-simple-text gamepad-item">
215+
<span>{{language.settings.theme.systemNightMode}}</span>
216+
<div class="switch{{#if config.systemNightMode}} a{{/if}}" on="settings.set('systemNightMode', true)" off="settings.set('systemNightMode', false)">
217+
<div></div>
218+
<svg viewBox="0 0 52 32"><path d="M 8,0 C 3.58,0 0,3.58 0,8 0,12.42 3.58,16 8,16 8,16 8,16 8,16 12.42,16 16,12.42 16,8 16,3.58 12.42,0 8,0 8,0 8,0 8,0 Z"></path></svg>
219+
</div>
220+
</div>
221+
212222
<h2 class="headline-small">{{language.settings.releases.main}}</h2>
213223

214224
<div class="menu-simple-text gamepad-item">

themes/material-design/actions.css

+1
Original file line numberDiff line numberDiff line change
@@ -1482,6 +1482,7 @@
14821482
fill: var(--md-sys-color-on-primary);
14831483
d: path('M 8,-4 C 1.37,-4 -4,1.37 -4,8 -4,14.63 1.37,20 8,20 8,20 8,20 8,20 14.63,20 20,14.63 20,8 20,1.37 14.63,-4 8,-4 8,-4 8,-4 8,-4 Z');
14841484
transform: translate(28px, 8px);
1485+
transition: fill 0.2s;
14851486
}
14861487

14871488
.switch.animeOn > svg path

0 commit comments

Comments
 (0)