laravel-jstools
Version:
JS tools for building front-side of Laravel applications
95 lines (94 loc) • 4.35 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.DashlyService = void 0;
const laravel_jstools_di_1 = require("laravel-jstools-di");
const DashlyThemeEnum_1 = require("./DashlyThemeEnum");
class DashlyService extends laravel_jstools_di_1.Service {
setTheme(theme) {
const isDark = window.matchMedia(`(prefers-color-scheme: ${DashlyThemeEnum_1.DashlyThemeEnum.dark})`).matches;
if (theme === DashlyThemeEnum_1.DashlyThemeEnum.auto && isDark) {
document.documentElement.dataset.theme = isDark ? DashlyThemeEnum_1.DashlyThemeEnum.dark : DashlyThemeEnum_1.DashlyThemeEnum.light;
}
else {
document.documentElement.dataset.theme = theme;
}
localStorage.setItem('theme', theme);
}
getPreferredTheme() {
if (localStorage.getItem('theme') != null) {
return localStorage.getItem('theme');
}
return document.documentElement.dataset.theme;
}
showActiveTheme(theme) {
const activeBtn = document.querySelector(`[data-theme-value="${theme}"]`);
document.querySelectorAll('[data-theme-value]').forEach((element) => {
element.classList.remove('active');
});
if (activeBtn) {
activeBtn.classList.add('active');
}
}
reloadPage() {
window.location.reload();
}
enableThemeSwitcher() {
const themeSwitcher = document.getElementById('themeSwitcher');
this.setTheme(this.getPreferredTheme());
if (typeof themeSwitcher !== 'undefined') {
window.matchMedia(`(prefers-color-scheme: ${DashlyThemeEnum_1.DashlyThemeEnum.dark})`).addEventListener('change', (e) => {
if (localStorage.getItem('theme') != null) {
if (localStorage.getItem('theme') === DashlyThemeEnum_1.DashlyThemeEnum.auto) {
this.reloadPage();
}
}
});
window.addEventListener('load', () => {
this.showActiveTheme(this.getPreferredTheme());
document.querySelectorAll('[data-theme-value]').forEach((element) => {
element.addEventListener('click', () => {
const theme = element.getAttribute('data-theme-value');
localStorage.setItem('theme', theme);
this.reloadPage();
});
});
});
}
}
setSidebarBehaviour(sidebarBehaviour) {
document.documentElement.dataset.sidebarBehaviour = sidebarBehaviour;
localStorage.setItem('sidebarBehaviour', sidebarBehaviour);
}
getPreferredSidebarBehaviour() {
if (localStorage.getItem('sidebarBehaviour') != null) {
return localStorage.getItem('sidebarBehaviour');
}
return document.documentElement.dataset.sidebarBehaviour;
}
showActiveSidebarBehaviour(sidebarBehaviour) {
const activeBtn = document.querySelector(`[data-sidebar-behaviour-value="${sidebarBehaviour}"]`);
document.querySelectorAll('[data-sidebar-behaviour-value]').forEach((element) => {
element.classList.remove('active');
});
if (activeBtn) {
activeBtn.classList.add('active');
}
}
enableSidebarBehaviourChanger() {
const sidebarBehaviourChanger = document.getElementById('sidebarBehaviourChanger');
this.setSidebarBehaviour(this.getPreferredSidebarBehaviour());
if (typeof sidebarBehaviourChanger !== 'undefined') {
window.addEventListener('load', () => {
this.showActiveSidebarBehaviour(this.getPreferredSidebarBehaviour());
document.querySelectorAll('[data-sidebar-behaviour-value]').forEach((element) => {
element.addEventListener('click', () => {
const sidebarBehaviour = element.getAttribute('data-sidebar-behaviour-value');
localStorage.setItem('sidebarBehaviour', sidebarBehaviour);
this.reloadPage();
});
});
});
}
}
}
exports.DashlyService = DashlyService;