Remove console.log implementation that renders to the page from utils (was there to debug mobile)

js/lcn/classes.js

@@ -4,7 +4,6 @@
  */
 
 globalThis.LCNSite = class LCNSite {
-    static INSTANCE = null;
 
     static "createAbortable" () {
         const obj = { "abort": null, "controller": null, "signal": null }
@@ -32,54 +31,64 @@ globalThis.LCNSite = class LCNSite {
         }
 
         return null
+    };
+
+    constructor () {
+        this._isModerator = document.body.classList.contains("is-moderator");
+
+        this._isThreadPage = document.body.classList.contains("active-thread");
+        this._isBoardPage = document.body.classList.contains("active-board");
+        this._isCatalogPage = document.body.classList.contains("active-catalog");
+
+        this._isModPage = location.pathname == "/mod.php";
+        this._isModRecentsPage = this._isModPage && (location.search == "?/recent" || location.search.startsWith("?/recent/"));
+        this._isModReportsPage = this._isModPage && (location.search == "?/reports" || location.search.startsWith("?/reports/"));
+        this._isModLogPage   = this._isModPage && (location.search == "?/log" || location.search.startsWith("?/log/"));
+        this._unseen = 0;
+        this._pageTitle = document.title;
+
+        this._favicon = document.querySelector("head > link[rel=\"shortcut icon\"]");
+        this._generatedStyle = null;
     }
 
-    #isModerator = document.body.classList.contains("is-moderator");
-    #isThreadPage = document.body.classList.contains("active-thread");
-    #isBoardPage = document.body.classList.contains("active-board");
-    #isCatalogPage = document.body.classList.contains("active-catalog");
+    "_doTitleUpdate" () {
+        document.title = (this._unseen > 0 ? `(${this._unseen}) ` : "") + this._pageTitle;
+    };
 
-    #isModPage = location.pathname == "/mod.php";
-    #isModRecentsPage = this.#isModPage && (location.search == "?/recent" || location.search.startsWith("?/recent/"));
-    #isModReportsPage = this.#isModPage && (location.search == "?/reports" || location.search.startsWith("?/reports/"));
-    #isModLogPage   = this.#isModPage && (location.search == "?/log" || location.search.startsWith("?/log/"));
+    "isModerator" () { return this._isModerator; }
+    "isThreadPage" () {
+        return this._isThreadPage;
+    }
+    "isBoardPage" () { return this._isBoardPage; }
+    "isCatalogPage" () { return this._isCatalogPage; }
 
-    "isModerator" () { return this.#isModerator; }
-    "isThreadPage" () { return this.#isThreadPage; }
-    "isBoardPage" () { return this.#isBoardPage; }
-    "isCatalogPage" () { return this.#isCatalogPage; }
+    "isModPage" () { return this._isModPage; }
+    "isModRecentsPage" () { return this._isModRecentsPage; }
+    "isModReportsPage" () { return this._isModReportsPage; }
+    "isModLogPage" () { return this._isModLogPage; }
 
-    "isModPage" () { return this.#isModPage; }
-    "isModRecentsPage" () { return this.#isModRecentsPage; }
-    "isModReportsPage" () { return this.#isModReportsPage; }
-    "isModLogPage" () { return this.#isModLogPage; }
-
-    #unseen = 0;
-    "getUnseen" () { return this.#unseen; }
-    "clearUnseen" () { if (this.#unseen != 0) { this.setUnseen(0); } }
+    "getUnseen" () { return this._unseen; }
+    "clearUnseen" () { if (this._unseen != 0) { this.setUnseen(0); } }
     "setUnseen" (int) {
         const bool = !!int
-        if (bool != !!this.#unseen) {
+        if (bool != !!this._unseen) {
             this.setFaviconType(bool ? "reply" : null)
         }
-        this.#unseen = int
-        this.#doTitleUpdate()
+        this._unseen = int
+        this._doTitleUpdate()
     }
 
-    #pageTitle = document.title;
-    "getTitle" () { return this.#pageTitle; }
-    "setTitle" (title) { this.#pageTitle = title; this.#doTitleUpdate(); }
-    #doTitleUpdate () { document.title = (this.#unseen > 0 ? `(${this.#unseen}) ` : "") + this.#pageTitle; }
+    "getTitle" () { return this._pageTitle; }
+    "setTitle" (title) { this._pageTitle = title; this._doTitleUpdate(); }
 
-    #favicon = document.querySelector("head > link[rel=\"shortcut icon\"]");
     "setFaviconType" (type=null) {
-        if (this.#favicon == null) {
-            this.#favicon = document.createElement("link")
-            this.#favicon.rel = "shortcut icon"
-            document.head.appendChild(this.#favicon)
+        if (this._favicon == null) {
+            this._favicon = document.createElement("link")
+            this._favicon.rel = "shortcut icon"
+            document.head.appendChild(this._favicon)
         }
 
-        this.#favicon.href = `/favicon${type ? "-" + type : ""}.ico`
+        this._favicon.href = `/favicon${type ? "-" + type : ""}.ico`
     }
 
     "getFloaterLContainer" () { return document.getElementById("bar-bottom-l"); }
@@ -87,85 +96,93 @@ globalThis.LCNSite = class LCNSite {
     "getThreadStatsLContainer" () { return document.getElementById("lcn-threadstats-l"); }
     "getThreadStatsRContainer" () { return document.getElementById("lcn-threadstats-r"); }
 
-    #generatedStyle = null;
     "writeCSSStyle" (origin, stylesheet) {
-        if (this.#generatedStyle == null && (this.#generatedStyle = document.querySelector("head > style.generated-css")) == null) {
-            this.#generatedStyle = document.createElement("style")
-            this.#generatedStyle.classList.add("generated-css")
-            document.head.appendChild(this.#generatedStyle)
+        if (this._generatedStyle == null && (this._generatedStyle = document.querySelector("head > style.generated-css")) == null) {
+            this._generatedStyle = document.createElement("style")
+            this._generatedStyle.classList.add("generated-css")
+            document.head.appendChild(this._generatedStyle)
         }
-        this.#generatedStyle.textContent += `${this.#generatedStyle.textContent.length ? "\n\n" : ""}/*** Generated by ${origin} ***/\n${stylesheet}`
+        this._generatedStyle.textContent += `${this._generatedStyle.textContent.length ? "\n\n" : ""}/*** Generated by ${origin} ***/\n${stylesheet}`
     }
 
 }
 
+globalThis.LCNSite.INSTANCE = null;
+
 globalThis.LCNPostInfo = class LCNPostInfo {
 
-    static nodeAttrib = "$LCNPostInfo";
-    static selector = ".post:not(.grid-li)";
-    #boardId = null;
-    #threadId = null;
-    #postId = null;
-    #name = null;
-    #email = null;
-    #capcode = null;
-    #flag = null;
-    #ip = null;
-    #subject = null;
-    #createdAt = null;
-
-    #parent = null;
-    #isThread = false;
-    #isReply = false;
-    #isLocked = false;
-    #isSticky = false;
-
-    static "assign" (post) { return post[this.nodeAttrib] ?? (post[this.nodeAttrib] = this.from(post)); }
-    static "from" (post) {
-        assert.ok(post.classList.contains("post"), "Arty must be expected Element.")
-        const inst = new this()
-        const intro = post.querySelector(".intro")
-        const link = intro.querySelector(".post_no:not([id])").href.split("/").reverse()
-        inst.#postId = link[0].slice(link[0].indexOf("#q") + 2)
-        inst.#threadId = link[0].slice(0, link[0].indexOf("."))
-        inst.#boardId = link[2]
-        inst.#isThread = post.classList.contains("op")
-        inst.#isReply = !inst.#isThread
-
-        inst.#subject = intro.querySelector(".subject")?.innerText ?? null
-        inst.#name = intro.querySelector(".name")?.innerText ?? null
-        inst.#email = intro.querySelector(".email")?.href.slice(7) ?? null
-        inst.#flag = intro.querySelector(".flag")?.src.split("/").reverse()[0].slice(0, -4) ?? null
-
-        inst.#capcode = intro.querySelector(".capcode")?.innerText ?? null
-        inst.#ip = intro.querySelector(".ip-link")?.innerText ?? null
-        inst.#createdAt = new Date(intro.querySelector("time[datetime]").dateTime ?? NaN)
-
-        inst.#isSticky = !!intro.querySelector("i.fa-thumb-tack")
-        inst.#isLocked = !!intro.querySelector("i.fa-lock")
-
-        return inst
+     constructor () {
+        this._boardId = null;
+        this._threadId = null;
+        this._postId = null;
+        this._name = null;
+        this._email = null;
+        this._capcode = null;
+        this._flag = null;
+        this._ip = null;
+        this._subject = null;
+        this._createdAt = null;
+        this._parent = null;
+        this._isThread = false;
+        this._isReply = false;
+        this._isLocked = false;
+        this._isSticky = false;
     }
 
-    "getParent" () { return this.#parent; }
-    "__setParent" (inst) { return this.#parent = inst; }
 
-    "getBoardId" () { return this.#boardId; }
-    "getThreadId" () { return this.#threadId; }
-    "getPostId" () { return this.#postId; }
+    static "assign" (post) {
+        if (post[this.nodeAttrib] == null) {
+            return post[this.nodeAttrib] = this.from(post);
+        } else {
+            return post[this.nodeAttrib];
+        }
+    }
+
+    static "from" (post) {
+        assert.ok(post.classList.contains("post"), "Arty must be expected Element.");
+        const inst = new this();
+        const intro = post.querySelector(".intro");
+        const link = intro.querySelector(".post_no:not([id])").href.split("/").reverse();
+        inst._postId = link[0].slice(link[0].indexOf("#q") + 2);
+        inst._threadId = link[0].slice(0, link[0].indexOf("."));
+        inst._boardId = link[2];
+        inst._isThread = post.classList.contains("op");
+        inst._isReply = !inst._isThread;
+
+        inst._subject = cont(intro.querySelector(".subject"), x => x.innerText);
+        inst._name = cont(intro.querySelector(".name"), x => x.innerText);
+        inst._email = cont(intro.querySelector(".email"), x => x.href.slice(7));
+        inst._flag = cont(intro.querySelector(".flag"), x => x.src.split("/").reverse()[0].slice(0, -4));
+
+        inst._capcode = cont(intro.querySelector(".capcode"), x => x.innerText);
+        inst._ip = cont(intro.querySelector(".ip-link"), x => x.innerText);
+        inst._createdAt = new Date(intro.querySelector("time[datetime]").dateTime || NaN);
+
+        inst._isSticky = !!intro.querySelector("i.fa-thumb-tack");
+        inst._isLocked = !!intro.querySelector("i.fa-lock");
+
+        return inst;
+    }
+
+    "getParent" () { return this._parent; }
+    "__setParent" (inst) { return this._parent = inst; }
+
+    "getBoardId" () { return this._boardId; }
+    "getThreadId" () { return this._threadId; }
+    "getPostId" () { return this._postId; }
     "getHref" () { return `/${this.boardId}/res/${this.threadId}.html#q${this.postId}`; }
 
-    "getName" () { return this.#name; }
-    "getEmail" () { return this.#email; }
-    "getIP" () { return this.#ip; }
-    "getCapcode" () { return this.#capcode; }
-    "getSubject" () { return this.#subject; }
-    "getCreatedAt" () { return this.#createdAt; }
+    "getName" () { return this._name; }
+    "getEmail" () { return this._email; }
+    "getIP" () { return this._ip; }
+    "getCapcode" () { return this._capcode; }
+    "getSubject" () { return this._subject; }
+    "getCreatedAt" () { return this._createdAt; }
 
-    "isSticky" () { return this.#isSticky; }
-    "isLocked" () { return this.#isLocked; }
-    "isThread" () { return this.#isThread; }
-    "isReply" () { return this.#isReply; }
+    "isSticky" () { return this._isSticky; }
+    "isLocked" () { return this._isLocked; }
+    "isThread" () { return this._isThread; }
+    "isReply" () { return this._isReply; }
 
     "is" (info) {
         assert.ok(info, "Must be LCNPost.")
@@ -174,45 +191,48 @@ globalThis.LCNPostInfo = class LCNPostInfo {
 
 }
 
+LCNPostInfo.nodeAttrib = "$LCNPostInfo";
+LCNPostInfo.selector = ".post:not(.grid-li)";
+
 globalThis.LCNPost = class LCNPost {
 
-    static nodeAttrib = "$LCNPost";
-    static selector = ".post:not(.grid-li)";
-    #parent = null;
-    #post = null;
-    #info = null;
-    #ipLink = null;
-    #controls = null;
-    #customControlsSeperatorNode = null;
-
-    static "assign" (post) { return post[this.nodeAttrib] ?? (post[this.nodeAttrib] = this.from(post)); }
-    static "from" (post) { return new this(post); }
-
-    "constructor" (post) {
-        assert.ok(post.classList.contains("post"), "Arty must be expected Element.")
-        const intro = post.querySelector(".intro")
-        this.#post = post
-        this.#info = LCNPostInfo.assign(post)
-        this.#ipLink = intro.querySelector(".ip-link")
-        this.#controls = Array.prototype.at.apply(post.querySelectorAll(".controls"), [ -1 ])
-
-        assert.equal(this.#info.getParent(), null, "Info should not have parent.")
-        this.#info.__setParent(this)
+    static "assign" (post) {
+        return post[this.nodeAttrib] || (post[this.nodeAttrib] = this.from(post));
     }
 
-    "jQuery" () { return $(this.#post); }
-    "trigger" (event_id, data=null) { $(this.#post).trigger(event_id, [ data ]); }
+    static "from" (post) { return new this(post); }
 
-    "getElement" () { return this.#post; }
-    "getInfo" () { return this.#info; }
+    constructor (post) {
+        this._parent = null;
+        this._post = null;
+        this._info = null;
+        this._ipLink = null;
+        this._controls = null;
+        this._customControlsSeperatorNode = null;
 
-    "getIPLink" () { return this.#ipLink; }
-    "setIP" (ip) { this.#ipLink.innerText = ip; }
+        assert.ok(post.classList.contains("post"), "Arty must be expected Element.");
+        const intro = post.querySelector(".intro");
+        this._post = post;
+        this._info = LCNPostInfo.assign(post);
+        this._ipLink = intro.querySelector(".ip-link");
+        this._controls = Array.prototype.at.apply(post.querySelectorAll(".controls"), [ -1 ]);
+        //assert.equal(this._info.getParent(), null, "Info should not have parent.");
+        this._info.__setParent(this);
+    }
 
-    "getParent" () { return this.#parent; }
-    "__setParent" (inst) { return this.#parent = inst; }
 
-    static #NBSP = String.fromCharCode(160);
+    "jQuery" () { return $(this._post); }
+    "trigger" (event_id, data=null) { $(this._post).trigger(event_id, [ data ]); }
+
+    "getElement" () { return this._post; }
+    "getInfo" () { return this._info; }
+
+    "getIPLink" () { return this._ipLink; }
+    "setIP" (ip) { this._ipLink.innerText = ip; }
+
+    "getParent" () { return this._parent; }
+    "__setParent" (inst) { return this._parent = inst; }
+
     "addCustomControl" (obj) {
         if (LCNSite.INSTANCE.isModerator()) {
             const link = document.createElement("a")
@@ -227,115 +247,122 @@ globalThis.LCNPost = class LCNPost {
                 link.addEventListener("click", e => { e.preventDefault(); obj.onClick(this); })
             }
 
-            if (this.#customControlsSeperatorNode == null) {
-                this.#controls.insertBefore(this.#customControlsSeperatorNode = new Text(`${this.constructor.#NBSP}-${this.constructor.#NBSP}`), this.#controls.firstElementChild)
+            if (this._customControlsSeperatorNode == null) {
+                this._controls.insertBefore(this._customControlsSeperatorNode = new Text(`${this.constructor.NBSP}-${this.constructor.NBSP}`), this._controls.firstElementChild)
             } else {
-                this.#controls.insertBefore(new Text(this.constructor.#NBSP), this.#customControlsSeperatorNode)
+                this._controls.insertBefore(new Text(this.constructor.NBSP), this._customControlsSeperatorNode)
             }
 
-            this.#controls.insertBefore(link, this.#customControlsSeperatorNode)
+            this._controls.insertBefore(link, this._customControlsSeperatorNode)
         }
     }
 
 }
 
+globalThis.LCNPost.nodeAttrib = "$LCNPost";
+globalThis.LCNPost.selector = ".post:not(.grid-li)";
+globalThis.LCNPost. NBSP = String.fromCharCode(160);
+
 globalThis.LCNThread = class LCNThread {
 
-    static nodeAttrib = "$LCNThread";
-    static selector = ".thread:not(.grid-li)";
-    #element = null;
-    #parent = null;
-    #op = null;
-
-    static "assign" (thread) { return thread[this.nodeAttrib] ?? (thread[this.nodeAttrib] = this.from(thread)); }
-    static "from" (thread) { return new this(thread); }
-
-    "constructor" (thread) {
-        assert.ok(thread.classList.contains("thread"), "Arty must be expected Element.")
-        this.#element = thread
-        this.#op = LCNPost.assign(this.#element.querySelector(".post.op"))
-
-        //assert.equal(this.#op.getParent(), null, "Op should not have parent.")
-        this.#op.__setParent(this)
+    static "assign" (thread) {
+        return thread[this.nodeAttrib] || (thread[this.nodeAttrib] = this.from(thread));
     }
 
-    "getElement" () { return this.#element; }
-    "getContent" () { return this.#op; }
-    "getPosts" () { return Array.prototype.map.apply(this.#element.querySelectorAll(".post"), [ el => LCNPost.assign(el) ]); }
-    "getReplies" () { return Array.prototype.map.apply(this.#element.querySelectorAll(".post:not(.op)"), [ el => LCNPost.assign(el) ]); }
+    static "from" (thread) { return new this(thread); }
 
-    "getParent" () { return this.#parent; }
-    "__setParent" (inst) { return this.#parent = inst; }
+    constructor (thread) {
+        this._element = null;
+        this._parent = null;
+        this._op = null;
+        assert.ok(thread.classList.contains("thread"), "Arty must be expected Element.")
+        this._element = thread
+        this._op = LCNPost.assign(this._element.querySelector(".post.op"))
+        assert.equal(this._op.getParent(), null, "Op should not have parent.")
+        this._op.__setParent(this)
+    }
+
+    "getElement" () { return this._element; }
+    "getContent" () { return this._op; }
+    "getPosts" () { return Array.prototype.map.apply(this._element.querySelectorAll(".post"), [ el => LCNPost.assign(el) ]); }
+    "getReplies" () { return Array.prototype.map.apply(this._element.querySelectorAll(".post:not(.op)"), [ el => LCNPost.assign(el) ]); }
+
+    "getParent" () { return this._parent; }
+    "__setParent" (inst) { return this._parent = inst; }
 }
 
+globalThis.LCNThread.nodeAttrib = "$LCNThread";
+globalThis.LCNThread.selector = ".thread:not(.grid-li)";
+
 
 globalThis.LCNPostContainer = class LCNPostContainer {
 
-    static nodeAttrib = "$LCNPostContainer";
-    static selector = ".postcontainer";
-    #parent = null;
-    #element = null;
-    #content = null;
-    #postId = null;
-    #boardId = null;
-
-    static "assign" (container) { return container[this.nodeAttrib] ?? (container[this.nodeAttrib] = this.from(container)); }
+    static "assign" (container) { return container[this.nodeAttrib] || (container[this.nodeAttrib] = this.from(container)); }
     static "from" (container) { return new this(container); }
 
-    "constructor" (container) {
+    constructor (container) {
+        this._parent = null;
+        this._element = null;
+        this._content = null;
+        this._postId = null;
+        this._boardId = null;
+
         assert.ok(container.classList.contains("postcontainer"), "Arty must be expected Element.")
         const child = container.querySelector(".thread, .post")
-        this.#element = container
-        this.#content = child.classList.contains("thread") ? LCNThread.assign(child) : LCNPost.assign(child)
-        this.#boardId = container.dataset.board
-        this.#postId = container.id.slice(2)
+        this._element = container
+        this._content = child.classList.contains("thread") ? LCNThread.assign(child) : LCNPost.assign(child)
+        this._boardId = container.dataset.board
+        this._postId = container.id.slice(2)
 
-        assert.equal(this.#content.getParent(), null, "Content should not have parent.")
-        this.#content.__setParent(this)
+        assert.equal(this._content.getParent(), null, "Content should not have parent.")
+        this._content.__setParent(this)
     }
 
-    "getElement" () { return this.#element; }
-    "getContent" () { return this.#content; }
-    "getBoardId" () { return this.#boardId; }
-    "getPostId" () { return this.#postId; }
+    "getElement" () { return this._element; }
+    "getContent" () { return this._content; }
+    "getBoardId" () { return this._boardId; }
+    "getPostId" () { return this._postId; }
 
-    "getParent" () { return this.#parent; }
-    "__setParent" (inst) { return this.#parent = inst; }
+    "getParent" () { return this._parent; }
+    "__setParent" (inst) { return this._parent = inst; }
 
 }
 
+globalThis.LCNPostContainer.nodeAttrib = "$LCNPostContainer";
+globalThis.LCNPostContainer.selector = ".postcontainer";
+
+
 globalThis.LCNPostWrapper = class LCNPostWrapper {
 
-    static nodeAttrib = "$LCNPostWrapper";
-    static selector = ".post-wrapper";
-    #wrapper = null;
-    #eitaLink = null;
-    #eitaId = null;
-    #eitaHref = null
-    #content = null;
-
-    static "assign" (wrapper) { return wrapper[this.nodeAttrib] ?? (wrapper[this.nodeAttrib] = this.from(wrapper)); }
+    static "assign" (wrapper) { return wrapper[this.nodeAttrib] || (wrapper[this.nodeAttrib] = this.from(wrapper)); }
     static "from" (wrapper) { return new this(wrapper); }
 
-    "constructor" (wrapper) {
+    constructor (wrapper) {
+        this._wrapper = null;
+        this._eitaLink = null;
+        this._eitaId = null;
+        this._eitaHref = null
+        this._content = null;
+
         assert.ok(wrapper.classList.contains("post-wrapper"), "Arty must be expected Element.")
-        this.#wrapper = wrapper
-        this.#eitaLink = wrapper.querySelector(".eita-link")
-        this.#eitaId = this.#eitaLink.id
-        this.#eitaHref = this.#eitaLink.href
+        this._wrapper = wrapper
+        this._eitaLink = wrapper.querySelector(".eita-link")
+        this._eitaId = this._eitaLink.id
+        this._eitaHref = this._eitaLink.href
+
         void Array.prototype.find.apply(wrapper.children, [
             el => {
                 if (el.classList.contains("thread")) {
-                    return this.#content = LCNThread.assign(el)
+                    return this._content = LCNThread.assign(el)
                 } else if (el.classList.contains("postcontainer")) {
-                    return this.#content = LCNPostContainer.assign(el)
+                    return this._content = LCNPostContainer.assign(el)
                 }
             }
         ])
 
-        assert.ok(this.#content, "Wrapper should contain content.")
-        assert.equal(this.#content.getParent(), null, "Content should not have parent.")
-        this.#content.__setParent(this)
+        assert.ok(this._content, "Wrapper should contain content.")
+        assert.equal(this._content.getParent(), null, "Content should not have parent.")
+        this._content.__setParent(this)
     }
 
     "getPost" () {
@@ -344,54 +371,57 @@ globalThis.LCNPostWrapper = class LCNPostWrapper {
         return post
     }
 
-    "getElement" () { return this.#wrapper; }
-    "getContent" () { return this.#content; }
-    "getEitaId" () { return this.#eitaId; }
-    "getEitaHref" () { return this.#eitaHref; }
-    "getEitaLink" () { return this.#eitaLink; }
-
+    "getElement" () { return this._wrapper; }
+    "getContent" () { return this._content; }
+    "getEitaId" () { return this._eitaId; }
+    "getEitaHref" () { return this._eitaHref; }
+    "getEitaLink" () { return this._eitaLink; }
 }
 
-globalThis.LCNSetting = class LCNSetting {
-    #id = null;
-    #eventId = null;
-    #label = null;
-    #value = null;
-    #valueDefault = null;
+globalThis.LCNPostWrapper.nodeAttrib = "$LCNPostWrapper";
+globalThis.LCNPostWrapper.selector = ".post-wrapper";
 
+
+globalThis.LCNSetting = class LCNSetting {
     static "build" (id) { return new this(id); }
 
-    "constructor" (id) {
-        this.#id = id;
-        this.#eventId = `lcnsetting::${this.#id}`
+    constructor (id) {
+        this._id = null;
+        this._eventId = null;
+        this._label = null;
+        this._value = null;
+        this._valueDefault = null;
+
+        this._id = id;
+        this._eventId = `lcnsetting::${this._id}`
     }
 
-    #getValue () {
-        const v = localStorage.getItem(this.#id)
+    "_getValue" () {
+        const v = localStorage.getItem(this._id)
         if (v != null) {
             return this.__builtinValueImporter(v)
         } else {
-            return this.#valueDefault
+            return this._valueDefault
         }
     }
 
-    "getValue" () { return this.#value ?? (this.#value = this.#getValue()); }
+    "getValue" () { return this._value || (this._value = this._getValue()); }
     "setValue" (v) {
-        if (this.#value !== v) {
-            this.#value = v
-            localStorage.setItem(this.#id, this.__builtinValueExporter(this.#value))
-            setTimeout(() => $(document).trigger(`${this.#eventId}::change`, [ v, this ]), 1)
+        if (this._value !== v) {
+            this._value = v
+            localStorage.setItem(this._id, this.__builtinValueExporter(this._value))
+            setTimeout(() => $(document).trigger(`${this._eventId}::change`, [ v, this ]), 1)
         }
     }
 
-    "getLabel" () { return this.#label; }
-    "setLabel" (label) { this.#label = label; return this; }
+    "getLabel" () { return this._label; }
+    "setLabel" (label) { this._label = label; return this; }
 
-    "getDefaultValue" () { return this.#valueDefault; }
-    "setDefaultValue" (vd) { this.#valueDefault = vd; return this; }
+    "getDefaultValue" () { return this._valueDefault; }
+    "setDefaultValue" (vd) { this._valueDefault = vd; return this; }
 
-    "onChange" (fn) { $(document).on(`${this.#eventId}::change`, (_,v,i) => fn(v, i)); }
-    __setIdPrefix (prefix) { this.#id = `${prefix}_${this.#id}`; }
+    "onChange" (fn) { $(document).on(`${this._eventId}::change`, (_,v,i) => fn(v, i)); }
+    __setIdPrefix (prefix) { this._id = `${prefix}_${this._id}`; }
 }
 
 globalThis.LCNToggleSetting = class LCNToggleSetting extends LCNSetting {
@@ -400,8 +430,11 @@ globalThis.LCNToggleSetting = class LCNToggleSetting extends LCNSetting {
     __builtinDOMConstructor () {
         const div = document.createElement("div")
         const chk = document.createElement("input")
-        const txt = document.createElement("label")
-        txt.innerText = this.getLabel()
+        const lbl = document.createElement("label")
+        const id = `${this._id}_input`
+        lbl.htmlFor = id
+        lbl.innerText = this.getLabel()
+        chk.id = id
         chk.type = "checkbox"
         chk.checked = this.getValue()
         chk.addEventListener("click", e => {
@@ -411,23 +444,17 @@ globalThis.LCNToggleSetting = class LCNToggleSetting extends LCNSetting {
         this.onChange(v => chk.checked = v)
 
         div.appendChild(chk)
-        div.appendChild(txt)
+        div.appendChild(lbl)
         return div
     }
 }
 
 globalThis.LCNSettingsSubcategory = class LCNSettingsSubcategory {
 
-    #tab_id = null;
-    #id = null;
-
-    #fieldset = null;
-    #legend = null;
-    #label = null;
-
     static "for" (tab_id, id) {
         const domid = `lcnssc_${tab_id}_${id}`
-        const inst = document.getElementById(domid)?.$LCNSettingsSubcategory
+        const inst = cont(document.getElementById(domid), x => x.$LCNSettingsSubcategory)
+
         if (inst == null) {
             const fieldset = document.createElement("fieldset")
             const legend = document.createElement("legend")
@@ -436,7 +463,7 @@ globalThis.LCNSettingsSubcategory = class LCNSettingsSubcategory {
 
             // XXX: extend_tab only takes a string so this hacky workaround is used to let us use the regular dom api
             Options.extend_tab(tab_id, `<div id="__${domid}" hidden></div>`)
-            const div = document.getElementById(`__${domid}`)?.parentElement
+            const div = cont(document.getElementById(`__${domid}`), x => x.parentElement)
             assert.ok(div)
 
             div.replaceChildren(fieldset)
@@ -446,23 +473,23 @@ globalThis.LCNSettingsSubcategory = class LCNSettingsSubcategory {
         }
     }
 
-    "constructor" (tab_id, id, fieldset) {
-        this.#tab_id = tab_id
-        this.#id = id
-        this.#fieldset = fieldset
-        this.#legend = this.#fieldset.querySelector("legend")
-        this.#fieldset.$LCNSettingsSubcategory = this
+    constructor (tab_id, id, fieldset) {
+        this._tab_id = tab_id
+        this._id = id
+        this._fieldset = fieldset
+        this._legend = this._fieldset.querySelector("legend")
+        this._fieldset.$LCNSettingsSubcategory = this
     }
 
-    "getLabel" () { return this.#label; }
-    "setLabel" (label) { this.#legend.innerText = this.#label = label; return this; }
+    "getLabel" () { return this._label; }
+    "setLabel" (label) { this._legend.innerText = this._label = label; return this; }
     "addSetting" (setting) {
         assert.ok(setting instanceof LCNSetting)
-        setting.__setIdPrefix(`lcnsetting_${this.#tab_id}_${this.#id}`)
+        setting.__setIdPrefix(`lcnsetting_${this._tab_id}_${this._id}`)
         if (setting.__builtinDOMConstructor != null) {
             const div = setting.__builtinDOMConstructor()
             div.classList.add("lcn-setting-entry")
-            this.#fieldset.appendChild(div)
+            this._fieldset.appendChild(div)
         }
 
         return this
@@ -480,7 +507,7 @@ $().ready(() => {
         clazz.forEach = (fn, node=document) => clazz.allNodes(node).forEach(elem => fn(clazz.assign(elem)))
         clazz.filter = (fn, node=document) => clazz.all(node).filter(fn)
         clazz.find = fn => clazz.all().find(fn)
-        clazz.first = (node=document) => clazz.assign(node.querySelector(clazz.selector))
+        clazz.first = (node=document) => { return clazz.assign(node.querySelector(clazz.selector)); }
         clazz.last = (node=document) => clazz.assign(Array.prototype.at.apply(clazz.allNodes(node), [ -1 ]))
     }
 

js/lcn/thread_autoupdater.js

@@ -4,14 +4,13 @@
  */
 
 $().ready(() => {
-
     const kIsEnabled = LCNToggleSetting.build("enabled")
     //const kIsBellEnabled = LCNToggleSetting.build("bellEnabled")
     void LCNSettingsSubcategory.for("general", "threadUpdater")
       .setLabel("Thread Updater")
       .addSetting(kIsEnabled
         .setLabel(_("Fetch new replies in the background"))
-        .setDefaultValue(true))
+        .setDefaultValue(true));
       /*.addSetting(kIsBellEnabled
         .setLabel(_("Play an audible chime when new replies are found"))
         .setDefaultValue(false))*/;
@@ -30,7 +29,7 @@ $().ready(() => {
         const abortable = LCNSite.createAbortable()
         const threadStatsItems = []
         const updateDOMStatus = () => {
-            const text = threadState ?? (secondsCounter >= 0 ? `${secondsCounter}s` : "…")
+            const text = threadState || (secondsCounter >= 0 ? `${secondsCounter}s` : "…")
             threadUpdateStatus.innerText = text
         }
 
@@ -59,7 +58,7 @@ $().ready(() => {
         }
 
         const findMissingReplies = (thread_op, thread_dom, thread_latest) => {
-            const lastPostTs = (thread_dom.at(-1)?.getInfo() ?? thread_op).getCreatedAt().getTime()
+            const lastPostTs = (cont(thread_dom.at(-1), x => x.getInfo()) || thread_op).getCreatedAt().getTime()
             const missing = []
 
             for (const pc of thread_latest.reverse()) {
@@ -129,6 +128,7 @@ $().ready(() => {
             if (threadState == null) {
                 if (secondsCounter < 0) {
                     const thread = LCNThread.first()
+
                     try {
                         await updateStatsFn(thread)
                         if (threadState == null && threadStats.last_modified > (thread.getReplies().at(-1).getInfo().getCreatedAt().getTime() / 1000)) {
@@ -149,10 +149,11 @@ $().ready(() => {
 
                 onTickId = setTimeout(onTickFn, 1000)
             }
+
         }
 
         $(document).on("ajax_after_post", (_, xhr_body) => {
-            if (kIsEnabled.getValue() && xhr_body != null) {
+            if (xhr_body != null) {
                 if (!xhr_body.mod) {
                     const thread = LCNThread.first()
                     const dom = parser.parseFromString(xhr_body.thread, "text/html")
@@ -233,7 +234,7 @@ $().ready(() => {
 
                 $(document).trigger("thread_manual_refresh")
             } else {
-                floaterLinkBox?.remove()
+                cont(floaterLinkBox, x => x.remove())
                 floaterLinkBox = null
                 statReplies = null
                 statFiles = null

js/lcn/utils.js

@@ -3,39 +3,71 @@
  * @author jonsmy
  */
 
+function cont(value_to_test, fn) {
+    if (value_to_test != null) {
+        return fn(value_to_test);
+    } else {
+        return null;
+    }
+}
+
 const assert = {
     "equal": (actual, expected, message="No message set") => {
         if (actual !== expected) {
-            const err = new Error(`Assertion Failed. ${message}`)
+            const err = new Error(`Assertion Failed. ${message}`);
             err.data = { actual, expected}
-            Error.captureStackTrace?.(err, assert.equal)
-            debugger
-            throw err
+            //Error.captureStackTrace?.(err, assert.equal);
+            debugger;
+            throw err;
         }
     },
     "ok": (actual, message="No message set") => {
         if (!actual) {
-            const err = new Error(`Assertion Failed. ${message}`)
+            const err = new Error(`Assertion Failed. ${message}`);
             err.data = { actual }
-            Error.captureStackTrace?.(err, assert.ok)
-            debugger
-            throw err
+            //Error.captureStackTrace?.(err, assert.ok);
+            debugger;
+            throw err;
         }
     }
-}
+};
+
+if (AbortSignal.any == null) {
+    AbortSignal.any = (signals) => {
+        const controller = new AbortController();
+        const abortFn = () => {
+            for (const signal of signals) {
+                signal.removeEventListener("abort", abortFn);
+            }
+            controller.abort();
+        }
 
-AbortSignal.any ??= function (signals) {
-    const controller = new AbortController()
-    const abortFn = () => {
         for (const signal of signals) {
-            signal.removeEventListener("abort", abortFn)
+            signal.addEventListener("abort", abortFn);
         }
-        controller.abort()
-    }
 
-    for (const signal of signals) {
-        signal.addEventListener("abort", abortFn)
+        return controller.signal;
     }
-
-    return controller.signal
+}
+
+// polyfill for replaceChildren
+if( Node.prototype.replaceChildren === undefined) {
+    Node.prototype.replaceChildren = function(addNodes) {
+        while(this.lastChild) {
+            this.removeChild(this.lastChild); 
+        }
+        if (addNodes !== undefined) {
+            this.append(addNodes);
+        }
+    }
+}
+
+if (Array.prototype.at === undefined) {
+    Array.prototype.at = function(index) {
+        if (index >= 0) {
+            return this[index];
+        } else {
+            return this[this.length + index];
+        }
+    };
 }

stylesheets/jungle.css

@@ -24,13 +24,15 @@ body {
     left: -4px;
 }
 
-.bar.bottom {
-    font-size: 14px;
-}
+@media screen and (max-width: 600px) {
+    .bar.bottom {
+        font-size: 14px;
+    }
 
-#thread-update-status {
-    opacity: .8;
-    font-size: 8pt;
+    #thread-update-status {
+        opacity: .8;
+        font-size: 8pt;
+    }
 }
 
 div.title h1 {