f0ckv2/public/s/js/f0ck.js

120 lines
4.0 KiB
JavaScript
Raw Normal View History

2021-04-17 08:43:23 +00:00
(() => {
if(elem = document.querySelector("#my-video")) {
const video = new v0ck(elem);
2021-04-22 02:12:40 +00:00
document.addEventListener("keydown", e => {
if(e.key === " ") {
video[video.paused ? 'play' : 'pause']();
document.querySelector('.v0ck_overlay').classList[video.paused ? 'remove' : 'add']('v0ck_hidden');
}
});
2021-04-17 08:43:23 +00:00
}
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"),
2021-04-22 02:12:40 +00:00
"a": clickOnElementBinding("#next"),
2021-04-17 08:43:23 +00:00
"ArrowRight": clickOnElementBinding("#prev"),
2021-04-22 02:12:40 +00:00
"d": clickOnElementBinding("#prev"),
2021-04-17 08:43:23 +00:00
"r": clickOnElementBinding("#random")
};
document.addEventListener("keydown", e => {
if(e.key in keybindings) {
e.preventDefault();
keybindings[e.key]();
}
});
// </keybindings>
// <image-responsive>
2021-04-22 02:12:40 +00:00
const imgSize = e => new Promise((res, _) => {
const i = new Image();
i.addEventListener('load', function() {
res({ width: this.width, height: this.height });
2021-04-17 08:43:23 +00:00
});
2021-04-22 02:12:40 +00:00
i.src = e.src;
});
2021-04-17 08:43:23 +00:00
2021-04-22 02:12:40 +00:00
if(f0ckimage = document.querySelector("img#f0ck-image")) {
const f0ckimagescroll = document.querySelector("#image-scroll");
f0ckimage.addEventListener("click", async e => {
2021-04-17 08:43:23 +00:00
e.preventDefault();
2021-04-22 02:12:40 +00:00
const img = await imgSize(f0ckimage);
if(img.width > img.height)
return;
2021-04-17 08:43:23 +00:00
f0ckimagescroll.hasAttribute("style")
? f0ckimagescroll.removeAttribute("style")
: f0ckimagescroll.setAttribute("style", "overflow-y: scroll");
2021-04-22 02:12:40 +00:00
f0ckimage.hasAttribute("style")
? f0ckimage.removeAttribute("style")
: f0ckimage.setAttribute("style", "max-height: none; height: auto; width: 100%; position: absolute; left: 0;");
2021-04-17 08:43:23 +00:00
});
}
2021-04-22 02:12:40 +00:00
// </image-responsive>
2021-04-17 08:43:23 +00:00
// <scroller>
2021-04-22 02:12:40 +00:00
if(document.querySelector("div#posts")) {
2021-04-17 08:43:23 +00:00
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 {
2021-04-22 02:12:40 +00:00
if(navbar = document.querySelector("nav.navbar") && document.querySelector("div#posts")) {
2021-04-17 08:43:23 +00:00
if(yDiff > 0 && (window.innerHeight + window.scrollY) >= document.body.offsetHeight) // up
elem = document.querySelector(".pagination > .next:not(.disabled)");
2021-04-22 02:12:40 +00:00
else if(yDiff <= 0 && window.scrollY <= 0 && document.querySelector("div#posts")) // down
2021-04-17 08:43:23 +00:00
elem = document.querySelector(".pagination > .prev:not(.disabled)");
}
}
if(elem)
changePage(elem);
xDown = yDown = null;
}, false);
// </swipe>
})();