Initial commit

2023-08-29 19:55:48 +02:00
commit 7c2eec4446
473 changed files with 40947 additions and 0 deletions
--- a/Frontend/pages/home/ts/PageHandler.ts
+++ b/Frontend/pages/home/ts/PageHandler.ts
@@ -0,0 +1,141 @@
+var PageHandler: PageHandler = {
+	elements: {
+		pagename: document.querySelector('.pagename'),
+		left: document.querySelector('.pageselector').querySelector('.box.left'),
+		right: document.querySelector('.pageselector').querySelector('.box.right'),
+		add: document.querySelector('.pageselector').querySelector('.box.add')
+	},
+
+	currentPageID: null,
+	currentPage: null,
+	currentIndex: null,
+
+	request(pageID: string, index: number) {
+		socket.emit('page', 'request', pageID, (err?: string, page?: Page_Config) => {
+			if (err) UndeckedNotification(`Error whilst getting page ${pageID}: ${err}`, 'error', 5000);
+			else {
+				PageHandler.currentIndex = index;
+				PageHandler.render(page);
+			}
+		});
+	},
+
+	render(page: Page_Config) {
+		KeyHandler.clear();
+
+		PageHandler.currentPageID = page.pageID;
+		PageHandler.currentPage = page;
+
+		PageList.select(page.pageID);
+
+		PageHandler.elements.pagename.value = page.name;
+		PageHandler.elements.pagename.removeAttribute('disabled');
+
+		for (var y in page.keys) {
+			for (var x in page.keys[y]) {
+				KeyHandler.render(x, y, page.keys[y][x]);
+			}
+		}
+	},
+
+	listeners() {
+		PageHandler.elements.pagename.oninput = () => {
+			if (PageHandler.currentPageID != null && PageHandler.elements.pagename.value.length > 0) {
+				socket.emit('page', 'setname', PageHandler.currentPageID, PageHandler.elements.pagename.value);
+			}
+		};
+
+		PageHandler.elements.add.onclick = () => {
+			var pageName = prompt('New page name', 'Untitled page');
+			if (pageName && pageName.length > 0) {
+				socket.emit('page', 'create', pageName);
+			}
+		};
+
+		PageHandler.elements.left.onclick = () => {
+			var selected = document.querySelector('.pageitem.selected');
+			if (selected && selected.previousElementSibling) (<HTMLElement>selected.previousElementSibling).click();
+		};
+
+		PageHandler.elements.right.onclick = () => {
+			var selected = document.querySelector('.pageitem.selected');
+			if (selected && selected.nextElementSibling) (<HTMLElement>selected.nextElementSibling).click();
+		};
+	}
+};
+
+PageHandler.listeners();
+
+interface PageHandler {
+	elements: {
+		pagename: HTMLInputElement;
+
+		left: HTMLDivElement;
+		right: HTMLDivElement;
+		add: HTMLDivElement;
+	};
+
+	currentPageID: string;
+	currentPage: Page_Config;
+	currentIndex: number;
+
+	request: (pageID: string, index: number) => void;
+	render: (page: Page_Config) => void;
+	listeners: () => void;
+}
+
+interface Page_Config {
+	pageID: string;
+	name?: string;
+
+	keys?: Page_Config_Keys;
+}
+
+interface Page_Config_Keys {
+	'0'?: {
+		'0'?: Page_Key;
+		'1'?: Page_Key;
+		'2'?: Page_Key;
+		'3'?: Page_Key;
+		'4'?: Page_Key;
+		'5'?: Page_Key;
+		'6'?: Page_Key;
+		'7'?: Page_Key;
+		'8'?: Page_Key;
+	};
+	'1'?: {
+		'0'?: Page_Key;
+		'1'?: Page_Key;
+		'2'?: Page_Key;
+		'3'?: Page_Key;
+		'4'?: Page_Key;
+		'5'?: Page_Key;
+		'6'?: Page_Key;
+		'7'?: Page_Key;
+		'8'?: Page_Key;
+	};
+	'2'?: {
+		'0'?: Page_Key;
+		'1'?: Page_Key;
+		'2'?: Page_Key;
+		'3'?: Page_Key;
+		'4'?: Page_Key;
+		'5'?: Page_Key;
+		'6'?: Page_Key;
+		'7'?: Page_Key;
+		'8'?: Page_Key;
+	};
+	'3'?: {
+		'0'?: Page_Key;
+		'1'?: Page_Key;
+		'2'?: Page_Key;
+		'3'?: Page_Key;
+		'4'?: Page_Key;
+		'5'?: Page_Key;
+		'6'?: Page_Key;
+		'7'?: Page_Key;
+		'8'?: Page_Key;
+	};
+}
+
+type Icon = '';