E-Hentai Better Navigation

Удобное средство просмотра галереи.

Terá de instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

Terá de instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Terá de instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Terá de instalar uma extensão como Tampermonkey para instalar este script.

Terá de instalar uma extensão de gestão de scripts de utilizador para instalar este script.

(Já tenho um gestor de scripts de utilizador, deixe-me instalá-lo!)

Terá de instalar uma extensão como Stylus para instalar este estilo.

Terá de instalar uma extensão como Stylus para instalar este estilo.

Terá de instalar uma extensão como Stylus para instalar este estilo.

Terá de instalar uma extensão de gestão de estilos de utilizador para instalar este estilo.

Terá de instalar uma extensão de gestão de estilos de utilizador para instalar este estilo.

Terá de instalar uma extensão de gestão de estilos de utilizador para instalar este estilo.

(Já tenho um gestor de estilos de utilizador, deixe-me instalá-lo!)

// ==UserScript==
// @name        E-Hentai Better Navigation
// @description Удобное средство просмотра галереи.
// @namespace   https://e-hentai.org/s/*
// @include     https://exhentai.org/s/*
// @include     https://e-hentai.org/s/*
// @version     1
// @grant       none
// @require     https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js
// ==/UserScript==

document.body.style.background = "black";
document.body.querySelector("html body div#i1.sni").style.display = "none";
document.body.querySelector("html body p.ip").style.display = "none";

let mainBody = document.createElement("div");
let sidebar = document.createElement("div");
let header = document.createElement("div");
let headerText = document.createElement("p");
let bottom = document.createElement("div");
let bottomText = document.createElement("p");
let helpLink = document.createElement("a");
let sidebarBody = document.createElement("div");
let imageMain = document.createElement("img");


let table = document.createElement("table");
let tableBody = document.createElement("tbody");
let tableRow = document.createElement("tr");
let tableColumn1 = document.createElement("td");
let tableColumn2 = document.createElement("td");

document.body.insertBefore(mainBody, document.body.firstChild);

mainBody.appendChild(table);
table.appendChild(tableBody);
tableBody.appendChild(tableRow);
tableRow.appendChild(tableColumn1);
tableRow.appendChild(tableColumn2);

tableColumn1.appendChild(sidebar);
sidebar.appendChild(header);
header.appendChild(headerText);
sidebar.appendChild(sidebarBody);
sidebar.appendChild(bottom);
bottom.appendChild(helpLink);
bottom.appendChild(bottomText);
tableColumn2.appendChild(imageMain);

tableColumn1.vAlign = "top";
tableColumn2.vAlign = "top";
tableColumn2.align = "center";
tableColumn2.style.width = "100%";

sidebar.style.background = "grey";
sidebar.style.width = "240px";
sidebar.style.height = "100vh";
sidebar.style.position = "fixed";

sidebarBody.style.height = "95vh";
sidebarBody.style.overflowY = "auto";

header.style.background = "darkgrey";

let headerTextMain = document.body.querySelector("html body div#i1.sni h1").innerText;
headerText.innerText = headerTextMain;

$(helpLink).click(function () {
    alert("Shortkeys:\n" +
        "1 - fit image to screen\n" +
        "2 - set image size to real\n" +
        "m - go to gallery main page");
});
helpLink.innerText = "(help)";
helpLink.href = "#";
bottomText.innerText = "";

imageMain.style.textAlign = "center";
imageMain.style.display = "block";
imageMain.style.maxHeight = "99vh";
imageMain.style.userSelect = "none";

table.style.borderCollapse = "collapse";

$(tableColumn2).click(function (event) {
    if ($(event.target).is(imageMain)){
        if(openedPageIndex+1<pageUri.length)
            openedPageIndex++;
        $(sidebarBody).animate({
            scrollTop: $(sidebarBody).scrollTop() - $(sidebarBody).offset().top + $("#"+(openedPageIndex+1)).offset().top-50
        }, 500);
        SrcAssignHandler();
    } else {
        if(openedPageIndex>0)
            openedPageIndex--;
        $(sidebarBody).animate({
            scrollTop: $(sidebarBody).scrollTop() - $(sidebarBody).offset().top + $("#"+(openedPageIndex+1)).offset().top-50
        }, 500);
        SrcAssignHandler();
    }
    window.scrollTo(0, 0);
});

let openedPageIndex;
let pageUri = [];
let imageSrc = [];
let imagePreviewBackground = [];
openedPageIndex = parseInt(document.documentURI.substring(document.documentURI.lastIndexOf("-")+1))-1;
imageMain.src = document.body.querySelector("html body div#i1.sni div#i3 a img#img").getAttribute("src");

let homeButton = document.body.querySelector("html body div#i1.sni div#i5 div.sb a");
let homeHref =  homeButton.getAttribute("href");
if (homeHref.includes("?")) homeHref = homeHref.substr(0, homeHref.indexOf("?")-1)+"/";

$.ajax({url: homeHref, dataType: 'html', success: function(responseData){
    pageUri = $(responseData).find(".gdtm").children().find("a").toArray();

    let imagePreview = $(responseData).find(".gdtm").children().toArray();
    for (let i=0; i<imagePreview.length; i++){
        imagePreviewBackground.push($(imagePreview[i]).css("background"));
    }
    headerText.innerText += pageUri.length;
    GetPagesHrefs();
}});
let galleryPageIndex = 1;

let images = [];
function GetPagesHrefs(){
    $.ajax({url: homeHref + "?p="+ galleryPageIndex, dataType: 'html', success: function(responseData){
        let child = $(responseData).find(".gdtm").children().find("a").toArray();
        let imagePreview = $(responseData).find(".gdtm").children().toArray();
        for (let i=0; i < imagePreview.length; i++){
            imagePreviewBackground.push($(imagePreview[i]).css("background"));
        }
        let pageIndex;
        pageIndex = $(responseData).find(".ptds").first().children().text();
        if (pageIndex !== (galleryPageIndex+1).toString()){
            headerText.innerText = headerTextMain+ " | ";
            AppendNeededImages();
        } else {
            for (let i = 0; i < child.length; i++){
                pageUri.push(child[i]);
            }
            galleryPageIndex++;
            setTimeout(function(){GetPagesHrefs();}, 100);
        }
        headerText.innerText += pageUri.length;
    }});
}


function AppendNeededImages() {
    for (let i=0;i<pageUri.length;i++){
        images.push(document.createElement("img"));
        imageSrc.push("");

        let imageNumber = document.createElement("div");
        let sideBarImageContainer = document.createElement("div");

        images[i].id = i+1;
        images[i].alt = i+1;
        images[i].title = i+1;
        imageNumber.innerText = i+1;
        imageNumber.style.background = "black";
        imageNumber.style.color = "white";
        imageNumber.style.position = "absolute";
        imageNumber.style.top = "5px";
        imageNumber.style.left = "5px";
        sideBarImageContainer.title = i+1;
        sideBarImageContainer.style.position = "relative";
        sideBarImageContainer.style.width = "100px";
        sideBarImageContainer.style.minHeight = "138px";
        sideBarImageContainer.style.background = imagePreviewBackground[i];

        $(sideBarImageContainer).click(function () {
            openedPageIndex = parseInt(this.title)-1;

            $(sidebarBody).animate({
                scrollTop: $(sidebarBody).scrollTop() - $(sidebarBody).offset().top + $("#"+(openedPageIndex+1)).offset().top-50
            }, 500);

            window.scrollTo(0, 0);
            SrcAssignHandler();
        });

        images[i].style.maxHeight = "400px";
        images[i].style.maxWidth = "220px";


        sidebarBody.appendChild(sideBarImageContainer);
        sideBarImageContainer.appendChild(images[i]);
        sideBarImageContainer.appendChild(imageNumber);
    }
    SrcAssignHandler();
}

function SrcAssignHandler() {
    if (imageSrc[openedPageIndex] === "")
        GetImgSrc(pageUri[openedPageIndex], openedPageIndex);
    else imageMain.src = imageSrc[openedPageIndex];
    if (openedPageIndex > 1 && imageSrc[openedPageIndex - 2] === "") {
        GetImgSrc(pageUri[openedPageIndex - 2], openedPageIndex - 2);
    }
    if (openedPageIndex > 0 && imageSrc[openedPageIndex - 1] === "") {
        GetImgSrc(pageUri[openedPageIndex - 1], openedPageIndex - 1);
    }
    if (openedPageIndex + 1 < pageUri.length && imageSrc[openedPageIndex + 1] === "") {
        GetImgSrc(pageUri[openedPageIndex + 1], openedPageIndex + 1);
    }
    if (openedPageIndex + 2 < pageUri.length && imageSrc[openedPageIndex + 2] === "") {
        GetImgSrc(pageUri[openedPageIndex + 2], openedPageIndex + 2);
    }
}

function GetImgSrc(pageUri, index) {
    $.get(pageUri).then(function(responseData){
        let prevImageSrc = responseData.substring(responseData.indexOf("<img id=")+19);
        prevImageSrc = prevImageSrc.substring(0,prevImageSrc.indexOf("style")-2);
        setTimeout(function(){AssignPageUri(prevImageSrc, index);},100);
    });
}

function AssignPageUri(src, index) {
    if (index === openedPageIndex){
        imageMain.src = src;
        $(sidebarBody).animate({
            scrollTop: $(sidebarBody).scrollTop() - $(sidebarBody).offset().top + $("#"+(openedPageIndex+2)).offset().top
        }, 500);
    }
    imageSrc[index] = src;
    images[index].src = src;
}


document.body.addEventListener("keydown", function (event) {
    if (event.keyCode === 49) {imageMain.style.maxHeight = "99vh";} //1
    if (event.keyCode === 50) {imageMain.style.maxHeight = "100%";} //2
    if (event.keyCode === 77) {window.location.href = homeButton.href;} //m
    if (event.keyCode === 81) {imageMain.src = imageSrc[openedPageIndex];} //r
});