jellyfish-web/src/components/layoutManager.js
2020-08-05 19:24:22 +01:00

61 lines
1.6 KiB
JavaScript

import browser from 'browser';
import appSettings from 'appSettings';
import events from 'events';
function setLayout(instance, layout, selectedLayout) {
if (layout === selectedLayout) {
instance[layout] = true;
document.documentElement.classList.add('layout-' + layout);
} else {
instance[layout] = false;
document.documentElement.classList.remove('layout-' + layout);
}
}
class LayoutManager {
setLayout(layout, save) {
if (!layout || layout === 'auto') {
this.autoLayout();
if (save !== false) {
appSettings.set('layout', '');
}
} else {
setLayout(this, 'mobile', layout);
setLayout(this, 'tv', layout);
setLayout(this, 'desktop', layout);
if (save !== false) {
appSettings.set('layout', layout);
}
}
events.trigger(this, 'modechange');
}
getSavedLayout(layout) {
return appSettings.get('layout');
}
autoLayout() {
// Take a guess at initial layout. The consuming app can override
if (browser.mobile) {
this.setLayout('mobile', false);
} else if (browser.tv || browser.xboxOne || browser.ps4) {
this.setLayout('tv', false);
} else {
this.setLayout(this.defaultLayout || 'tv', false);
}
}
init() {
const saved = this.getSavedLayout();
if (saved) {
this.setLayout(saved, false);
} else {
this.autoLayout();
}
}
}
export default new LayoutManager();