v2.1 lol

public/s/js/f0ck.js

@@ -0,0 +1,109 @@
+(() => {
+  if(elem = document.querySelector("#my-video")) {
+    const video = new v0ck(elem);
+  }
+
+  let tt = false;
+  const stimeout = 500;
+  const changePage = (e, pbwork = true) => {
+    pbwork && document.querySelector("nav.navbar").classList.add("pbwork");
+    !tt && (tt = setTimeout(() => e.click(), stimeout));
+  };
+
+  // <keybindings>
+  const clickOnElementBinding = selector => () => (elem = document.querySelector(selector)) ? elem.click() : null;
+  const keybindings = {
+    "ArrowLeft": clickOnElementBinding("#next"),
+    "d": clickOnElementBinding("#next"),
+    "ArrowRight": clickOnElementBinding("#prev"),
+    "a": clickOnElementBinding("#prev"),
+    "r": clickOnElementBinding("#random")
+  };
+  document.addEventListener("keydown", e => {
+    if(e.key in keybindings) {
+      e.preventDefault();
+      keybindings[e.key]();
+    }
+  });
+  // </keybindings>
+
+  // <image-responsive>
+  if(f0ckimage = document.querySelector("#f0ck-image")) {
+    f0ckimage.addEventListener("click", e => {
+      e.preventDefault();
+      f0ckimage.hasAttribute("style")
+        ? f0ckimage.removeAttribute("style")
+        : f0ckimage.setAttribute("style", "max-height: none; height: auto; width: 100%; position: absolute; left: 0;");
+    });
+  }
+  // </image-responsive>
+
+  // <scroll-event-adder>
+  if(f0ckimagescroll = document.querySelector("#image-scroll")) {
+    f0ckimagescroll.addEventListener("click", e => {
+      e.preventDefault();
+      f0ckimagescroll.hasAttribute("style")
+        ? f0ckimagescroll.removeAttribute("style")
+        : f0ckimagescroll.setAttribute("style", "overflow-y: scroll");
+    });
+  }
+  // </scroll-event-adder>
+
+  // <scroller>
+  if(document.querySelector("ul#posts")) {
+    document.addEventListener("wheel", e => {
+      if((window.innerHeight + window.scrollY) >= document.body.offsetHeight && e.deltaY > 0) {
+        if(elem = document.querySelector(".pagination > .next:not(.disabled)"))
+          changePage(elem);
+      }
+      else if(window.scrollY <= 0 && e.deltaY < 0) {
+        if(elem = document.querySelector(".pagination > .prev:not(.disabled)"))
+          changePage(elem);
+      }
+    });
+  }
+  // </scroller>
+
+  // <swipe>
+  let lastTap = 0;
+  let xDown = null;
+  let yDown = null;
+  document.addEventListener('touchstart', e => {
+    const firstTouch = (e.touches ?? e.originalEvent.touches)[0];
+    xDown = firstTouch.clientX;
+    yDown = firstTouch.clientY;
+
+    const currentTime = new Date().getTime();
+    const tapLength = currentTime - lastTap;
+    if(tapLength < 500 && tapLength > 0)
+      if(elem = document.querySelector("#random"))
+        changePage(elem);
+    lastTap = currentTime;
+  }, false);
+
+  document.addEventListener('touchmove', e => {
+    if(!xDown || !yDown)
+      return;
+    const xDiff = xDown - e.touches[0].clientX;
+    const yDiff = yDown - e.touches[0].clientY;
+    let elem = false;
+    if(Math.abs(xDiff) > Math.abs(yDiff)) {
+      if(xDiff > 0) // left
+        elem = document.querySelector(".pagination > .next:not(.disabled)");
+      else // right
+        elem = document.querySelector(".pagination > .prev:not(.disabled)");
+    }
+    else {
+      if(navbar = document.querySelector("nav.navbar") && document.querySelector("ul#posts")) {
+        if(yDiff > 0 && (window.innerHeight + window.scrollY) >= document.body.offsetHeight) // up
+          elem = document.querySelector(".pagination > .next:not(.disabled)");
+        else if(yDiff <= 0 && window.scrollY <= 0 && document.querySelector("ul#posts")) // down
+          elem = document.querySelector(".pagination > .prev:not(.disabled)");
+      }
+    }
+    if(elem)
+      changePage(elem);
+    xDown = yDown = null;
+  }, false);
+  // </swipe>
+})();