port staffhider to ts, eslint --fix, new fp

assets/js/fp.js

@@ -1,48 +1,109 @@
 /**
- * Thanks uBlock for breaking our JS!
+ * FP version 4
+ *
+ * Not reliant on deprecated properties,
+ * and potentially more accurate at what it's supposed to do.
  */
 
+import { $ } from './utils/dom';
+import store from './utils/store';
+
 // http://stackoverflow.com/a/34842797
 function hashCode(str) {
   return str.split('').reduce((prevHash, currVal) =>
     ((prevHash << 5) - prevHash) + currVal.charCodeAt(0), 0) >>> 0;
 }
 
-function createFp() {
+async function createFp() {
+  let kb = 'none';
+  let mem = '1';
+  let ua = 'none';
+
+  if (navigator.keyboard) {
+    kb = (await navigator.keyboard.getLayoutMap()).entries().toArray().sort().map(e => `${e[0]}${e[1]}`).join('');
+  }
+
+  if (navigator.deviceMemory) {
+    mem = navigator.deviceMemory.toString();
+  }
+
+  if (navigator.userAgentData) {
+    const uadata = navigator.userAgentData;
+    let brands = 'none';
+
+    if (uadata.brands && uadata.brands.length > 0) {
+      brands = uadata.brands.filter(e => !e.brand.match(/.*ot.*rand.*/gi)).map(e => `${e.brand}${e.version}`).join('');
+    }
+
+    ua = `${brands}${uadata.mobile}${uadata.platform}`;
+  }
+
+  let width = store.get('cached_rem_size');
+  const body = $('body');
+
+  if (!width && body) {
+    const testElement = document.createElement('span');
+    testElement.style.minWidth = '1rem';
+    testElement.style.maxWidth = '1rem';
+    testElement.style.position = 'absolute';
+
+    body.appendChild(testElement);
+
+    width = testElement.clientWidth.toString();
+
+    body.removeChild(testElement);
+
+    store.set('cached_rem_size', width);
+  }
+
+  if (!width) {
+    width = '0';
+  }
+
   const prints = [
     navigator.userAgent,
-    navigator.cpuClass,
-    navigator.oscpu,
-    navigator.platform,
-
-    navigator.browserLanguage,
+    navigator.hardwareConcurrency.toString(),
+    navigator.maxTouchPoints.toString(),
     navigator.language,
-    navigator.systemLanguage,
-    navigator.userLanguage,
+    kb,
+    mem,
+    ua,
+    width,
 
-    screen.availLeft,
-    screen.availTop,
-    screen.availWidth,
-    screen.height,
-    screen.width,
+    screen.height.toString(),
+    screen.width.toString(),
+    screen.colorDepth.toString(),
+    screen.pixelDepth.toString(),
 
-    window.devicePixelRatio,
-    new Date().getTimezoneOffset(),
+    window.devicePixelRatio.toString(),
+    new Date().getTimezoneOffset().toString(),
   ];
 
   return hashCode(prints.join(''));
 }
 
-function setFpCookie() {
-  let fp;
+async function setFpCookie() {
+  let fp = store.get('cached_ses_value');
 
-  // The prepended 'c' acts as a crude versioning mechanism.
-  try {
-    fp = `c${createFp()}`;
+  if (!fp) {
+    const m = document.cookie.match(/_ses=([a-f\d]+)/);
+
+    if (m && m[1]) {
+      fp = m[1];
     }
-  // If it fails, use fakeprint "c1836832948" as a last resort.
+  }
+
+  if (!fp || fp.charAt(0) !== 'd') {
+    // The prepended 'd' acts as a crude versioning mechanism.
+    try {
+      fp = `d${await createFp()}`;
+    }
+    // If it fails, use fakeprint "d1836832948" as a last resort.
     catch (err) {
-    fp = 'c1836832948';
+      fp = 'd1836832948';
+    }
+
+    store.set('cached_ses_value', fp);
   }
 
   document.cookie = `_ses=${fp}; path=/; SameSite=Lax`;

assets/js/staffhider.ts

@@ -6,12 +6,10 @@
 
 import { $$ } from './utils/dom';
 
-function hideStaffTools() {
+export function hideStaffTools() {
   if (window.booru.hideStaffTools === 'true') {
-    $$('.js-staff-action').forEach(el => {
+    $$<HTMLElement>('.js-staff-action').forEach(el => {
       el.classList.add('hidden');
     });
   }
 }
-
-export { hideStaffTools };

assets/types/booru-object.d.ts

@@ -65,6 +65,10 @@ interface BooruObject {
   spoileredFilter: AstMatcher;
   tagsVersion: number;
   interactions: Interaction[];
+  /**
+   * Indicates whether sensitive staff-only info should be hidden or not.
+   */
+  hideStaffTools: string;
 }
 
 declare global {