fanbinit/rhymix
1
0
Fork 0
mirror of https://github.com/Lastorder-DC/rhymix.git synced 2026-01-06 10:11:38 +09:00
Code Issues Projects Releases Packages Wiki Activity

Fix #1704 detect color scheme as early as possible

Browse source
This commit is contained in:
Kijin Sung 2021-06-20 02:10:08 +09:00
parent 93fa7a46ce
commit 2c81be51c3
2 changed files with 29 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

35
common/js/common.js
View file

@ -352,17 +352,6 @@ jQuery(function($) {
}
});
/* Detect color scheme */
var body_element = $('body');
/* If there is color_scheme class in the body, color scheme settings were already applied. */
if(!body_element.hasClass('color_scheme_light') && !body_element.hasClass('color_scheme_dark')) {
var color_scheme = XE.cookie.get('rx_color_scheme');
if (color_scheme !== 'light' && color_scheme !== 'dark') {
color_scheme = (window.matchMedia && window.matchMedia('(prefers-color-scheme:dark)').matches) ? 'dark' : 'light';
}
body_element.addClass('color_scheme_' + color_scheme);
}
/* Editor preview replacement */
$(".editable_preview").addClass("rhymix_content xe_content").attr("tabindex", 0);
$(".editable_preview").on("click", function() {
@ -794,6 +783,30 @@ function setColorScheme(color_scheme) {
$('body').addClass('color_scheme_' + color_scheme).removeClass('color_scheme_' + (color_scheme === 'dark' ? 'light' : 'dark'));
}
}
function detectColorScheme() {
// Return if a color scheme is already selected.
var body_element = $('body');
if(body_element.hasClass('color_scheme_light') || body_element.hasClass('color_scheme_dark')) {
return;
}
// Detect the cookie.
var color_scheme = XE.cookie.get('rx_color_scheme');
// Detect the device color scheme.
var match_media = window.matchMedia ? window.matchMedia('(prefers-color-scheme:dark)') : null;
if (color_scheme !== 'light' && color_scheme !== 'dark') {
color_scheme = (match_media && match_media.matches) ? 'dark' : 'light';
}
// Set the body class according to the detected color scheme.
body_element.addClass('color_scheme_' + color_scheme);
// Add an event listener to detect changes to the device color scheme.
match_media && match_media.addListener && match_media.addListener(function(e) {
if (e.matches) {
body_element.removeClass('color_scheme_light').addClass('color_scheme_dark');
} else {
body_element.removeClass('color_scheme_dark').addClass('color_scheme_light');
}
});
}
/* 미리보기 */
function doDocumentPreview(obj) {

9
common/tpl/common_layout.html
View file

@ -45,7 +45,11 @@
<meta property="{$og_metadata['property']}" content="{$og_metadata['content']}" />
</block>
{Context::getHtmlHeader()|noescape}
</head>
<!-- BODY START -->
<body{Context::getBodyClass()|noescape}>
<!-- COMMON JS VARIABLES -->
<script>
var default_url = "{\Rhymix\Framework\URL::encodeIdna(Context::getDefaultUrl())}";
@ -58,11 +62,8 @@
var enforce_ssl = {$site_module_info->security === 'always' ? 'true' : 'false'};
var cookies_ssl = {config('session.use_ssl_cookies') ? 'true' : 'false'};
var rewrite_level = {intval(\Rhymix\Framework\Router::getRewriteLevel())};
if (detectColorScheme) detectColorScheme();
</script>
</head>
<!-- BODY START -->
<body{Context::getBodyClass()|noescape}>
<!-- PAGE CONTENT -->
{Context::getBodyHeader()|noescape}