96 lines
2.5 KiB
TypeScript
96 lines
2.5 KiB
TypeScript
var TabController: TabController = {
|
|
elements: {
|
|
menu: document.querySelector('.tabmenu'),
|
|
pages: document.querySelector('.tabpages')
|
|
},
|
|
|
|
setTitle(title: string) {
|
|
var titleElement = document.querySelector('title');
|
|
titleElement.innerText = `Undecked - ${title}`;
|
|
},
|
|
|
|
show(tabname: string) {
|
|
TabController.elements.menu.querySelectorAll('.item').forEach((element: HTMLDivElement) => {
|
|
var tab = element.getAttribute('tab');
|
|
if (tab == tabname) element.classList.add('active');
|
|
else element.classList.remove('active');
|
|
});
|
|
TabController.elements.pages.querySelectorAll('.item').forEach((element: HTMLDivElement) => {
|
|
var tab = element.getAttribute('tab');
|
|
if (tab == tabname) element.classList.add('active');
|
|
else element.classList.remove('active');
|
|
});
|
|
|
|
if (tabname == 'pages') {
|
|
var pageID = PageHandler.currentPageID;
|
|
|
|
history.pushState(null, null, `/pages/pageID`);
|
|
TabController.setTitle(`Page ${pageID}`);
|
|
} else {
|
|
history.pushState(null, null, `/${tabname}`);
|
|
|
|
TabController.setTitle(tabname.charAt(0).toUpperCase() + tabname.slice(1));
|
|
}
|
|
},
|
|
|
|
registerListeners() {
|
|
TabController.elements.menu.querySelectorAll('.item').forEach((element: HTMLDivElement) => {
|
|
var tab = element.getAttribute('tab');
|
|
element.onclick = () => {
|
|
TabController.show(tab);
|
|
};
|
|
});
|
|
},
|
|
|
|
init() {
|
|
var args = window.location.pathname.split('/');
|
|
if (args.length > 0) args.splice(0, 1);
|
|
|
|
var tab = args.length > 0 ? args[0] : null;
|
|
var subTab = args.length > 1 ? args[1] : null;
|
|
|
|
if (PageList.order != null) {
|
|
if (tab != undefined && tab.length > 0) {
|
|
if (tab == 'pages') {
|
|
var valid = PageList.select(subTab);
|
|
|
|
if (valid) {
|
|
var index = PageList.order.indexOf(subTab);
|
|
PageHandler.request(PageList.order[index], index);
|
|
TabController.show('pages');
|
|
} else {
|
|
PageHandler.request(PageList.order[0], 0);
|
|
TabController.show('pages');
|
|
}
|
|
} else {
|
|
PageHandler.request(PageList.order[0], 0);
|
|
TabController.show(tab);
|
|
}
|
|
} else {
|
|
PageList.firstRender = false;
|
|
PageHandler.request(PageList.order[0], 0);
|
|
TabController.show('pages');
|
|
}
|
|
} else
|
|
setTimeout(() => {
|
|
TabController.init();
|
|
}, 200);
|
|
}
|
|
};
|
|
|
|
TabController.init();
|
|
TabController.registerListeners();
|
|
|
|
interface TabController {
|
|
elements: {
|
|
menu: HTMLDivElement;
|
|
pages: HTMLDivElement;
|
|
};
|
|
|
|
setTitle: (title: string) => void;
|
|
show: (tabname: string) => void;
|
|
registerListeners: () => void;
|
|
|
|
init: () => void;
|
|
}
|