Improve cookie loading with type setting

frontend/src/cookies.js

@@ -1,5 +1,5 @@
-export function getCookie(name, defaultVal) {
-	let val = defaultVal;
+export function getCookie(name, options = {type: "string"}) {
+	let val = options.default;
 	let cookieArr = document.cookie.split("; ");
 
 	for(const cookie of cookieArr) {
@@ -8,18 +8,34 @@ export function getCookie(name, defaultVal) {
 		try {
 			val = decodeURIComponent(pair[1]);
 		} catch(err) {
-			return defaultVal;
+			return options.default;
 		}
 	}
+	switch(options.type) {
+		case "int":
+			return parseInt(val);
+		case "float":
+			return parseFloat(val);
+		case "bool":
+		case "boolean":
+			return val == "true" || val == "1";
+		case "json":
+			// console.log(val);
+			try {
+				return JSON.parse(val);
+			} catch(e) {
+				return {};
+			}
+	}
 	return val;
 }
 
 // gets cookies ready to be used elsewhere
 export function initCookies() {
-	$("input[name=postname]").val(getCookie("name", ""));
-	$("input[name=postemail]").val(getCookie("email", ""));
-	$("input[name=postpassword]").val(getCookie("password", ""));
-	$("input[name=delete-password]").val(getCookie("password", ""));
+	$("input[name=postname]").val(getCookie("name"));
+	$("input[name=postemail]").val(getCookie("email"));
+	$("input[name=postpassword]").val(getCookie("password"));
+	$("input[name=delete-password]").val(getCookie("password"));
 }
 
 export function setCookie(name, value, expires) {

frontend/src/index.js

@@ -5,6 +5,7 @@ import { initSettings } from "./settings";
 import { initTopBar, TopBarButton, DropDownMenu } from "./topbar";
 import { initQR } from "./qr";
 import { opRegex } from "./vars";
+import { initWatcher } from "./watcher";
 
 let currentStaff = null;
 let $watchedThreadsBtn = null;
@@ -91,13 +92,14 @@ function handleKeydown(e) {
 
 $(() => {
 	let pageThread = getPageThread();
-	let style = getCookie("style", defaultStyle);
+	let style = getCookie("style", {default: defaultStyle});
 	let themeElem = document.getElementById("theme");
 	if(themeElem) themeElem.setAttribute("href", `${webroot}css/${style}`);
 	currentStaff = getStaff();
 	initCookies();
 	initTopBar();
 	initSettings();
+	initWatcher();
 
 	$watchedThreadsBtn = new TopBarButton("WT", () => {});
 
@@ -106,8 +108,8 @@ $(() => {
 			window.location = "/manage?action=dashboard"
 		})
 		/* $staffBtn = new DropDownMenu("Staff",getStaffMenuHTML())
-		$("a#staff.dropdown-button").click(function() {
-			$("a.staffmenu-item").click(function() {
+		$("a#staff.dropdown-button").on("click", function() {
+			$("a.staffmenu-item").on("click", function() {
 				let url = $(this).attr("id");
 				openStaffLightBox(url);
 	 		});
@@ -117,11 +119,11 @@ $(() => {
 
 	if(pageThread.board != "") {
 		prepareThumbnails();
-		if(getCookie("useqr") == "true") initQR(pageThread);
+		if(getCookie("useqr", {type: "bool"})) initQR(pageThread);
 	}
 
 	preparePostPreviews(false);
-	$(".plus").click(function() {
+	$("plus").on("click", function() {
 		let block = $(this).parent().next();
 		if(block.css("display") == "none") {
 			block.show();
@@ -132,7 +134,7 @@ $(() => {
 		}
 	});
 	let threadMenuOpen = false;
-	$(".thread-ddown a, body").click(function(e) {
+	$(".thread-ddown a, body").on("click", function(e) {
 		e.stopPropagation();
 		let postID = $(this).parent().parent().parent().attr("id");
 		let isOP = $(this).parent().parent().parent().attr("class") == "thread";

frontend/src/lightbox.js

@@ -2,7 +2,7 @@ export function showLightBox(title, innerHTML) {
 	$(document.body).prepend(
 		`<div class="lightbox-bg"></div><div class="lightbox"><div class="lightbox-title">${title}<a href="#" class="lightbox-x">X</a><hr /></div>${innerHTML}</div>`
 	);
-	$("a.lightbox-x, .lightbox-bg").click(() => {
+	$("a.lightbox-x, .lightbox-bg").on("click", () => {
 		$(".lightbox, .lightbox-bg").remove();
 	});
 }
@@ -17,7 +17,7 @@ export function showMessage(msg) {
 		"left": $(document).width()/2 - centeroffset/2-16
 	});
 
-	$(".lightbox-msg-ok, .lightbox-bg").click(() => {
+	$(".lightbox-msg-ok, .lightbox-bg").on("click", () => {
 		$(".lightbox-msg, .lightbox-bg").remove();
 	});
 }

frontend/src/postutil.js

@@ -87,7 +87,7 @@ export function preparePostPreviews(isInline) {
 	if(expandablePostrefs) {
 		let clkStr = "a.postref";
 		if(isInline) clkStr = "div.inlinepostprev " + clkStr;
-		$(clkStr).click(() => {
+		$(clkStr).on("click", () => {
 			let $this = $(this);
 			if($this.next().attr("class") != "inlinepostprev") {
 				$(".postprev").remove();
@@ -108,7 +108,7 @@ export function preparePostPreviews(isInline) {
 
 export function prepareThumbnails() {
 	// set thumbnails to expand when clicked
-	$("a.upload-container").click(function(e) {
+	$("a.upload-container").on("click", function(e) {
 		e.preventDefault();
 		let a = $(this);
 		let thumb = a.find("img.upload");
@@ -132,7 +132,7 @@ export function prepareThumbnails() {
 
 			fileInfoElement.append($("<a />")
 			.prop("href", "javascript:;")
-			.click(e =>{
+			.on("click", e =>{
 				video.remove();
 				thumb.show();
 				this.remove();

frontend/src/qr.js

@@ -16,8 +16,8 @@ const qrTitleBar =
 	`<a href="javascript:toTop();">${upArrow}</a><a href="javascript:closeQR();">X</a></span></div>`;
 
 export function initQR(pageThread) {
-	const nameCookie = getCookie("name","");
-	const emailCookie = getCookie("email","");
+	const nameCookie = getCookie("name");
+	const emailCookie = getCookie("email");
 	const qrFormHTML =
 		`<input type="hidden" name="threadid" value="${pageThread.op}" />` +
 		`<input type="hidden" name="boardid" value="1" />` +
@@ -37,9 +37,13 @@ export function initQR(pageThread) {
 		enctype:"multipart/form-data"
 	}).append(qrFormHTML,$qrbuttons);
 	let qrTop = 32;
-	if(!getCookie("pintopbar",true)) qrTop = $topbar.outerHeight() + 16;
+	if(!getCookie("pintopbar",{default: true, type: "bool"}))
+		qrTop = $topbar.outerHeight() + 16;
 
-	let qrPos = JSON.parse(getCookie("qrpos", JSON.stringify({top: qrTop, left: 16})));
+	let qrPos = getCookie("qrpos", {
+		type: "json",
+		default: JSON.stringify({top: qrTop, left: 16})
+	});
 	$qr = $("<div />").prop({
 		id: "qr-box",
 		style: `top: ${qrPos.top}px;left: ${qrPos.left}px; position:fixed;`,

frontend/src/settings.js

@@ -32,8 +32,8 @@ class Setting {
 		this.cb();
 	}
 
-	getCookie(defaultVal) {
-		let val = getCookie(this.id, defaultVal);
+	getCookie(type = "string", defaultVal) {
+		let val = getCookie(this.id, {type: type, default: defaultVal});
 
 		if(this.type == "checkbox") val = (val == "true");
 		return val;
@@ -106,7 +106,7 @@ export function initSettings() {
 
 	$settingsMenu = new TopBarButton("Settings", () => {
 		showLightBox("Settings", settingsHTML);
-		$("button#save-settings-button").click(() => {
+		$("button#save-settings-button").on("click", () => {
 			for(const setting of settings) {
 				setting.save(setting.getVal());
 			}

frontend/src/topbar.js

@@ -12,7 +12,7 @@ export class TopBarButton {
 		$topbar.append(`<a href="javascript:;" class="dropdown-button" id="${title.toLowerCase()}">${title}${downArrow}</a>`);
 		let buttonOpen = false;
 		let self = this;
-		$topbar.find("a#" + title.toLowerCase()).click(event => {
+		$topbar.find("a#" + title.toLowerCase()).on("click", event => {
 			if(!buttonOpen) {
 				self.onOpen();
 				$(document).bind("click", () => {
@@ -30,7 +30,7 @@ export class TopBarButton {
 
 export function initTopBar() {
 	$topbar = $("div#topbar");
-	if(!getCookie("pintopbar", true)) {
+	if(!getCookie("pintopbar", {default: true, type: "bool"})) {
 		$topbar.css({
 			"position": "absolute",
 			"top": "0px",

frontend/src/watcher.js

@@ -0,0 +1,29 @@
+let watching = false;
+
+export function getWatchedThreads() {
+	if(!watching) {
+		clearInterval(getWatchedThreads);
+		return;
+	}
+
+	fetch("/test/res/1.json")
+	.then(response => {
+		if(!response.ok)
+			throw new Error(response.statusText);
+		return response.json();
+	})
+	.then(data => {
+		console.log(data);
+	})
+	.catch(err => {
+		console.log(`Error getting watched threads: ${err}`);
+		clearInterval(getWatchedThreads);
+		watching = false;
+	})
+}
+
+export function initWatcher() {
+	watching = true;
+	getWatchedThreads();
+	// setInterval(getWatchedThreads, 1000);
+}