44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import { LitElement } from 'lit-element';
|
|
import { DomTools } from './domtools.classes.domtools';
|
|
import * as plugins from './domtools.plugins';
|
|
|
|
export class ThemeManager {
|
|
public domtoolsRef: DomTools;
|
|
|
|
public goBrightBoolean = false;
|
|
public preferredColorSchemeMediaMatch = window.matchMedia('(prefers-color-scheme: light)');
|
|
|
|
public themeObservable = new plugins.smartrx.rxjs.ReplaySubject<boolean>(1);
|
|
|
|
constructor(domtoolsRefArg: DomTools) {
|
|
this.domtoolsRef = domtoolsRefArg;
|
|
|
|
// lets care
|
|
this.goBrightBoolean = this.preferredColorSchemeMediaMatch.matches;
|
|
this.preferredColorSchemeMediaMatch.addEventListener('change', eventArg => {
|
|
this.goBrightBoolean = eventArg.matches;
|
|
this.updateAllConnectedElements();
|
|
});
|
|
this.updateAllConnectedElements();
|
|
}
|
|
|
|
private async updateAllConnectedElements() {
|
|
document.body.style.background = this.goBrightBoolean ? '#fff' : '#000';
|
|
this.themeObservable.next(this.goBrightBoolean);
|
|
}
|
|
|
|
public goBright() {
|
|
this.goBrightBoolean = true;
|
|
this.updateAllConnectedElements();
|
|
}
|
|
|
|
public goDark() {
|
|
this.goBrightBoolean = false;
|
|
this.updateAllConnectedElements();
|
|
}
|
|
|
|
public toggleDarkBright() {
|
|
this.goBrightBoolean = !this.goBrightBoolean;
|
|
this.updateAllConnectedElements();
|
|
}
|
|
} |