Make RJ code great again!
Fra
// ==UserScript==
// @name DLSite RJ code preview
// @namespace SettingDust
// @description Make RJ code great again!
// @include *://*/*
// @version 2.1.3
// @license MIT
// @grant GM.xmlHttpRequest
// @grant GM_xmlhttpRequest
// @run-at document-start
// ==/UserScript==
"use strict";
const RJ_REGEX = new RegExp("R[JE][0-9]{6}", "gi");
const VOICELINK_CLASS = "voicelink";
const RJCODE_ATTRIBUTE = "rjcode";
const css = `
.voicepopup {
z-index: 50000;
max-width: 80%;
max-height: 80%;
position: fixed;
box-shadow: 0 0 0 2.5px rgba(0, 0, 0, 0.12);
border-radius: 16px;
background-color: white;
display: flex;
flex-direction: column;
overflow: hidden;
}
.voicepopup img {
width: 100%;
height: auto;
max-width: 360px;
}
.voicelink {
text-shadow: 1px 1px 1px #333;
color: #333;
}
.voicelink: hover {
text-decoration: none;
}
.voicepopup > .voice-info {
padding: 12px 16px;
font-size: 0.88rem;
line-height: 1.2;
max-width: 360px;
display: grid;
grid-gap: 6px;
box-sizing: border-box;
}
.voicepopup > .voice-info > p {
margin: 0;
font-weight: bold;
}
.voicepopup > .voice-info > p > span {
font-weight: normal;
}
.voicepopup .voice-title {
margin: 0;
font-size: 1.1rem;
font-weight: bold;
line-height: 1;
}
.voicepopup .error {
height: 210px;
line-height: 210px;
text-align: center;
}
.voicepopup.discord-dark {
background-color: #36393f;
color: #dcddde;
font-size: 0.9375rem;
}`;
function getAdditionalPopupClasses() {
const hostname = document.location.hostname;
switch (hostname) {
case "boards.4chan.org":
return "post reply";
case "discordapp.com":
return "discord-dark";
default:
return null;
}
}
function getXmlHttpRequest() {
return typeof GM !== "undefined" && GM !== null
? GM.xmlHttpRequest
: GM_xmlhttpRequest;
}
const Parser = {
walkNodes: function (elem) {
const rjNodeTreeWalker = document.createTreeWalker(
elem,
NodeFilter.SHOW_TEXT,
{
acceptNode: function (node) {
if (node.parentElement.classList.contains(VOICELINK_CLASS))
return NodeFilter.FILTER_ACCEPT;
if (node.nodeValue.match(RJ_REGEX)) return NodeFilter.FILTER_ACCEPT;
},
},
false
);
while (rjNodeTreeWalker.nextNode()) {
const node = rjNodeTreeWalker.currentNode;
if (node.parentElement.classList.contains(VOICELINK_CLASS))
Parser.rebindEvents(node.parentElement);
else {
Parser.linkify(node);
}
}
},
wrapRJCode: function (rjCode) {
var e;
e = document.createElement("a");
e.classList = VOICELINK_CLASS;
e.href = `https://www.dlsite.com/maniax/work/=/product_id/${rjCode}.html`;
e.innerHTML = rjCode;
e.target = "_blank";
e.rel = "noreferrer";
e.classList.add(rjCode);
e.setAttribute(RJCODE_ATTRIBUTE, rjCode.toUpperCase());
e.addEventListener("mouseover", Popup.over);
e.addEventListener("mouseout", Popup.out);
e.addEventListener("mousemove", Popup.move);
return e;
},
linkify: function (textNode) {
const nodeOriginalText = textNode.nodeValue;
const matches = [];
let match;
while ((match = RJ_REGEX.exec(nodeOriginalText))) {
matches.push({
index: match.index,
value: match[0],
});
}
// Keep text in text node until first RJ code
textNode.nodeValue = nodeOriginalText.substring(0, matches[0].index);
// Insert rest of text while linkifying RJ codes
let prevNode = null;
for (let i = 0; i < matches.length; ++i) {
// Insert linkified RJ code
const rjLinkNode = Parser.wrapRJCode(matches[i].value);
textNode.parentNode.insertBefore(
rjLinkNode,
prevNode ? prevNode.nextSibling : textNode.nextSibling
);
// Insert text after if there is any
let upper;
if (i === matches.length - 1) upper = undefined;
else upper = matches[i + 1].index;
let substring;
if (
(substring = nodeOriginalText.substring(matches[i].index + 8, upper))
) {
const subtextNode = document.createTextNode(substring);
textNode.parentNode.insertBefore(
subtextNode,
rjLinkNode.nextElementSibling
);
prevNode = subtextNode;
} else {
prevNode = rjLinkNode;
}
}
},
rebindEvents: function (elem) {
if (elem.nodeName === "A") {
elem.addEventListener("mouseover", Popup.over);
elem.addEventListener("mouseout", Popup.out);
elem.addEventListener("mousemove", Popup.move);
} else {
const voicelinks = elem.querySelectorAll("." + VOICELINK_CLASS);
for (var i = 0, ii = voicelinks.length; i < ii; i++) {
const voicelink = voicelinks[i];
voicelink.addEventListener("mouseover", Popup.over);
voicelink.addEventListener("mouseout", Popup.out);
voicelink.addEventListener("mousemove", Popup.move);
}
}
},
};
var globalCodes = [];
const Popup = {
makePopup: function (e, rjCode) {
const popup = document.createElement("div");
popup.className = "voicepopup " + (getAdditionalPopupClasses() || "");
popup.id = "voice-" + rjCode;
popup.style = "display: flex";
document.body.appendChild(popup);
DLsite.request(rjCode, function (workInfo) {
if (workInfo === null)
popup.innerHTML = "<div class='error'>Work not found.</span>";
else {
const img = document.createElement("img");
img.src = workInfo.img;
let html = `
<div class='voice-info'>
<h4 class='voice-title'>${workInfo.title.trim()}</h4>
<p>社团名：<span>${workInfo.circle.trim()}</span></p>
`;
if (workInfo.date)
html += `<p>贩卖日：<span>${workInfo.date}</span></p>`;
else if (workInfo.dateAnnounce)
html += `<p>发布日期：<span>${workInfo.dateAnnounce}</span></p>`;
html += `<p>年龄指定：<span>${workInfo.rating.trim()}</span></p>`;
if (workInfo.cv) html += `<p>声优：<span>${workInfo.cv}</span></p>`;
if (workInfo.tags) {
html += `<p>分类：<span>`;
workInfo.tags.forEach((tag) => {
html += tag + "\u3000";
});
html += "</span></p>";
}
if (workInfo.filesize)
html += `<p>文件容量：<span>${workInfo.filesize}</span></p>`;
html += "</div>";
popup.innerHTML = html;
popup.insertBefore(img, popup.childNodes[0]);
}
Popup.move(e);
});
},
humanFileSize: function (size) {
if (!size) return "";
var i = Math.floor(Math.log(size) / Math.log(1024));
return (
(size / Math.pow(1024, i)).toFixed(2) * 1 +
" " +
["B", "kB", "MB", "GB", "TB"][i]
);
},
over: function (e) {
const rjCode = e.target.getAttribute(RJCODE_ATTRIBUTE);
const popup = document.querySelector("div#voice-" + rjCode);
if (popup) {
const style = popup.getAttribute("style").replace("none", "flex");
popup.setAttribute("style", style);
} else {
Popup.makePopup(e, rjCode);
}
},
out: function (e) {
const rjCode = e.target.getAttribute("rjcode");
const popup = document.querySelector("div#voice-" + rjCode);
if (popup) {
const style = popup.getAttribute("style").replace("flex", "none");
popup.setAttribute("style", style);
}
},
move: function (e) {
const rjCode = e.target.getAttribute("rjcode");
const popup = document.querySelector("div#voice-" + rjCode);
if (popup) {
// 如果右侧没有超出屏幕范围
if (popup.offsetWidth + e.clientX + 24 < window.innerWidth) {
popup.style.left = e.clientX + 8 + "px";
} else {
// 显示在左侧
popup.style.left = e.clientX - popup.offsetWidth - 8 + "px";
}
// 如果下方超出屏幕范围
if (popup.offsetHeight + e.clientY + 16 > window.innerHeight) {
// 尽可能靠下
popup.style.top = window.innerHeight - popup.offsetHeight - 16 + "px";
} else {
popup.style.top = e.clientY + "px";
}
}
},
};
const DLsite = {
parseWorkDOM: function (dom, rj) {
// workInfo: {
// rj: any;
// img: string;
// title: any;
// circle: any;
// date: any;
// rating: any;
// tags: any[];
// cv: any;
// filesize: any;
// dateAnnounce: any;
// }
const workInfo = {};
workInfo.rj = rj;
let rj_group;
if (rj.slice(5) == "000") rj_group = rj;
else {
rj_group = (parseInt(rj.slice(2, 5)) + 1).toString() + "000";
rj_group = "RJ" + ("000000" + rj_group).substring(rj_group.length);
}
workInfo.img =
"https://img.dlsite.jp/modpub/images2/work/doujin/" +
rj_group +
"/" +
rj +
"_img_main.jpg";
workInfo.title = dom.getElementById("work_name").textContent;
workInfo.circle = dom.querySelector("span.maker_name").textContent;
const table_outline = dom.querySelector("table#work_outline");
for (var i = 0, ii = table_outline.rows.length; i < ii; i++) {
const row = table_outline.rows[i];
const row_header = row.cells[0].textContent;
const row_data = row.cells[1];
switch (true) {
case row_header.includes("贩卖日"):
workInfo.date = row_data.textContent;
break;
case row_header.includes("年龄指定"):
workInfo.rating = row_data.textContent;
break;
case row_header.includes("分类"):
const tag_nodes = row_data.querySelectorAll("a");
workInfo.tags = [...tag_nodes].map((a) => {
return a.textContent;
});
break;
case row_header.includes("声优"):
workInfo.cv = row_data.textContent;
break;
case row_header.includes("文件容量"):
workInfo.filesize = row_data.textContent.replace("合计", "").trim();
break;
default:
break;
}
}
const work_date_ana = dom.querySelector("strong.work_date_ana");
if (work_date_ana) {
workInfo.dateAnnounce = work_date_ana.innerText;
workInfo.img =
"https://img.dlsite.jp/modpub/images2/ana/doujin/" +
rj_group +
"/" +
rj +
"_ana_img_main.jpg";
}
console.log(workInfo);
return workInfo;
},
request: function (rjCode, callback) {
const url = `https://www.dlsite.com/maniax/work/=/product_id/${rjCode}.html/?locale=zh_CN`;
getXmlHttpRequest()({
method: "GET",
url,
headers: {
Accept: "text/xml",
"User-Agent": "Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:67.0)",
},
onload: function (resp) {
if (resp.readyState === 4 && resp.status === 200) {
const dom = new DOMParser().parseFromString(
resp.responseText,
"text/html"
);
const workInfo = DLsite.parseWorkDOM(dom, rjCode);
callback(workInfo);
} else if (resp.readyState === 4 && resp.status === 404)
DLsite.requestAnnounce(rjCode, callback);
},
});
},
requestAnnounce: function (rjCode, callback) {
const url = `https://www.dlsite.com/maniax/announce/=/product_id/${rjCode}.html/?locale=ja_JP`;
getXmlHttpRequest()({
method: "GET",
url,
headers: {
Accept: "text/xml",
"User-Agent": "Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:67.0)",
},
onload: function (resp) {
if (resp.readyState === 4 && resp.status === 200) {
const dom = new DOMParser().parseFromString(
resp.responseText,
"text/html"
);
const workInfo = DLsite.parseWorkDOM(dom, rjCode);
callback(workInfo);
} else if (resp.readyState === 4 && resp.status === 404) callback(null);
},
});
},
};
document.addEventListener("DOMContentLoaded", function () {
const style = document.createElement("style");
style.innerHTML = css;
document.head.appendChild(style);
Parser.walkNodes(document.body);
const observer = new MutationObserver(function (m) {
for (let i = 0; i < m.length; ++i) {
let addedNodes = m[i].addedNodes;
for (let j = 0; j < addedNodes.length; ++j) {
Parser.walkNodes(addedNodes[j]);
}
}
});
document.addEventListener("securitypolicyviolation", function (e) {
if (e.blockedURI.includes("img.dlsite.jp")) {
const img = document.querySelector(`img[src="${e.blockedURI}"]`);
img.remove();
}
});
observer.observe(document.body, { childList: true, subtree: true });
});