89 lines
2.3 KiB
TypeScript
89 lines
2.3 KiB
TypeScript
import { MorphFeature } from 'morphux';
|
|
import { Main } from './main';
|
|
|
|
export type Tabs = 'dashboard' | 'calibration' | 'cameralogs' | 'unitylogs';
|
|
export class TabController {
|
|
private _Main: Main;
|
|
|
|
container: HTMLDivElement = document.querySelector('.ntsh_tabs');
|
|
|
|
currentTabId: Tabs;
|
|
|
|
constructor(main: Main) {
|
|
this._Main = main;
|
|
|
|
this.registerNavigationListener();
|
|
}
|
|
|
|
private tabListeners: Map<Tabs, (visible: boolean) => void> = new Map();
|
|
registerListener(tabId: Tabs, callback: (visible: boolean) => void) {
|
|
if (this.tabListeners.has(tabId))
|
|
throw new Error(
|
|
`Listener for tab id ${tabId} has already been registered!`
|
|
);
|
|
|
|
this.tabListeners.set(tabId, callback);
|
|
callback(this.currentTabId == tabId);
|
|
}
|
|
|
|
async showTab(tabId: Tabs) {
|
|
if (this.currentTabId == tabId) return;
|
|
|
|
if (
|
|
tabId !== 'dashboard' &&
|
|
!document.body.classList.contains('ntsh_service')
|
|
) {
|
|
const confirmed = await MorphFeature.Confirm({
|
|
title: 'Service Mode Required',
|
|
message: `You need to be in service mode to access tab ${tabId}, switch to Service Mode now?`,
|
|
});
|
|
if (!confirmed) return this.showTab('dashboard');
|
|
|
|
const succeed = await this._Main.MenuBar.toggleServiceMode(true);
|
|
if (!succeed) return this.showTab('dashboard');
|
|
}
|
|
|
|
this._Main.MenuBar.menubar.setSelected(tabId);
|
|
|
|
if (this.tabListeners.has(this.currentTabId))
|
|
this.tabListeners.get(this.currentTabId)(false);
|
|
if (this.tabListeners.has(tabId)) this.tabListeners.get(tabId)(true);
|
|
this.currentTabId = tabId;
|
|
|
|
this.container
|
|
.querySelectorAll('.ntsh_tab')
|
|
.forEach((tab) => tab.classList.remove('ntsh_tab-visible'));
|
|
|
|
this.container
|
|
.querySelector(`.ntsh_tab[tabid="${tabId}"]`)
|
|
.classList.add('ntsh_tab-visible');
|
|
|
|
window.history.pushState(
|
|
{ tab: tabId },
|
|
'',
|
|
`/${tabId}${window.location.search}`
|
|
);
|
|
|
|
var tabName = {
|
|
dashboard: 'Dashboard',
|
|
calibration: 'Calibration',
|
|
cameralogs: 'Camera Logs',
|
|
unitylogs: 'Unity Logs',
|
|
}[tabId];
|
|
document.title = `NTSH Control - ${tabName}`;
|
|
}
|
|
|
|
private registerNavigationListener() {
|
|
window.addEventListener('popstate', (event) => {
|
|
const state = event.state;
|
|
if (state && state.tab) this.showTab(state.tab);
|
|
});
|
|
|
|
var startTab = window.location.pathname
|
|
.replace('/', '')
|
|
.split('/')
|
|
.shift() as Tabs;
|
|
this.showTab(startTab.length > 0 ? startTab : 'dashboard');
|
|
}
|
|
}
|