Simplified javascript
This commit is contained in:
parent
155b4e12ef
commit
ddbbf4bb72
60
js/main.js
60
js/main.js
@ -1,7 +1,5 @@
|
|||||||
/*jshint esversion: 6 */
|
/*jshint esversion: 6 */
|
||||||
|
|
||||||
var light = false;
|
|
||||||
|
|
||||||
window.onload = function() {
|
window.onload = function() {
|
||||||
reorganize_html();
|
reorganize_html();
|
||||||
create_theme_switcher();
|
create_theme_switcher();
|
||||||
@ -65,34 +63,46 @@ function reorganize_html() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function create_theme_switcher() {
|
function create_theme_switcher() {
|
||||||
// If no theme cookie is found, set dark by default
|
// set the correct CSS depending on the cookie, dark is default
|
||||||
if (Cookies.get('theme') == null) {
|
var light = isThemeLight();
|
||||||
Cookies.set('theme', 'dark');
|
$('body').append('<div class="themeBtn"><i class="fas fa-'
|
||||||
}
|
.concat(light ? 'moon' : 'sun').concat('"></i></div>'));
|
||||||
|
$('head').append('<link id="theme" rel="stylesheet" href="./css/'
|
||||||
|
.concat(light ? 'light' : 'dark').concat('.css">'));
|
||||||
|
|
||||||
// set the css and button depending on the cookie found, dark is default
|
// switch CSS files and button icon, set new cookie on theme switcher click
|
||||||
if (Cookies.get('theme') == 'light') {
|
|
||||||
$('body').append('<div class="themeBtn"><i class="fas fa-moon"></i></div>');
|
|
||||||
$('head').append('<link id="theme" rel="stylesheet" href="./css/light.css">');
|
|
||||||
} else {
|
|
||||||
$('body').append('<div class="themeBtn"><i class="fas fa-sun"></i></div>');
|
|
||||||
$('head').append('<link id="theme" rel="stylesheet" href="./css/dark.css">');
|
|
||||||
}
|
|
||||||
|
|
||||||
// switch CSS files and button icon, set new cookie
|
|
||||||
$('.themeBtn').click(function() {
|
$('.themeBtn').click(function() {
|
||||||
if (Cookies.get('theme') == 'dark') {
|
console.log("Theme change");
|
||||||
$('link[href="./css/dark.css"]').attr('href', './css/light.css');
|
var light = !isThemeLight();
|
||||||
$('.themeBtn').html('<i class="fas fa-moon"></i>');
|
console.log(light);
|
||||||
Cookies.set('theme', 'light');
|
$("#theme").first().attr('href', './css/'
|
||||||
} else {
|
.concat(light ? 'light' : 'dark')
|
||||||
$('link[href="./css/light.css"]').attr('href', './css/dark.css');
|
.concat('.css'));
|
||||||
$('.themeBtn').html('<i class="fas fa-sun"></i>');
|
$('.themeBtn').html('<i class="fas fa-'
|
||||||
Cookies.set('theme', 'dark');
|
.concat(light ? 'moon' : 'sun')
|
||||||
}
|
.concat('"></i>'));
|
||||||
|
Cookies.set('light-theme', light ? 'true' : 'false');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function isThemeLight() {
|
||||||
|
// set the css and button depending on the cookie found, dark is default
|
||||||
|
var light;
|
||||||
|
switch (Cookies.get('light-theme')) {
|
||||||
|
case 'true':
|
||||||
|
light = true;
|
||||||
|
break;
|
||||||
|
case null: // If no theme cookie is found, set dark by default
|
||||||
|
Cookies.set('light-theme', false);
|
||||||
|
/* falls through */
|
||||||
|
default:
|
||||||
|
light = false;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return light;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
function isEmpty(el) {
|
function isEmpty(el) {
|
||||||
return !$.trim(el.html());
|
return !$.trim(el.html());
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user