Add original video preview.
当前为
// ==UserScript==
// @name SUKEBEI PLUS
// @namespace Violentmonkey Scripts
// @match *://sukebei.nyaa.si/*
// @grant GM_addStyle
// @grant GM_xmlhttpRequest
// @grant GM_setValue
// @grant GM_getValue
// @grant GM_registerMenuCommand
// @version 1.2.0
// @author Chaewon
// @description Add original video preview.
// @license Unlicense
// @icon https://sukebei.nyaa.si/static/favicon.png
// ==/UserScript==
(function () {
"use strict";
const stylesheet = `
.overlay-video-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.9);
display: flex;
justify-content: center;
align-items: center;
z-index: 9999;
}
.overlay-video {
width: auto;
max-width: 90%;
min-height: 60%;
height: auto;
max-height: 90%;
border: 1px solid #919191;
background: #000;
}
.close-button {
position: absolute;
padding: 6px 14px;
top: 10px;
right: 10px;
background: none;
border: none;
color: white;
cursor: pointer;
border: 1px solid #333;
}
.settings-container {
position: fixed;
right: 1em;
top: 2em;
max-width: 400px;
width: 100%;
padding: 10px 20px;
border: 1px solid #ddd;
border-radius: 8px;
background-color: #fff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
z-index: 9999;
}
.settings-container .settings-item:not(:last-of-type) {
margin-bottom: 20px;
}
.settings-container label {
display: block;
margin-bottom: 8px;
font-weight: 600;
color: #333;
}
.settings-container input[type="text"],
.settings-container input[type="range"] {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}
.settings-container input[type="checkbox"] {
margin-right: 10px;
}
.settings-container .button {
display: inline-block;
padding: 10px 15px;
color: #fff;
background-color: #007bff;
border: none;
border-radius: 4px;
cursor: pointer;
text-align: center;
transition: background-color 0.3s ease;
}
.settings-container .button:hover {
background-color: #0056b3;
}
.settings-container range-label {
margin-bottom: 5px;
color: #333;
}
.settings-container #quality {
color: black;
}
.settings-container option, .settings-container input {
color: black;
}
.settings-container #resetApiData {
width: 100%;
margin: 4px 0;
}
.toast {
font-weight: bolder;
position: fixed;
top: 20px;
left: 50%;
transform: translateX(-50%);
padding: 10px 20px;
background-color: #913030;
color: #fff;
border-radius: 4px;
opacity: 0;
visibility: hidden;
transition: opacity 0.5s, visibility 0.5s;
z-index: 1000;
border: 2px solid #FFF;
}
.toast.show {
opacity: 1;
visibility: visible;
}`;
GM_addStyle(stylesheet);
const defaultConfig = {
darkTheme: false,
playerAutoplay: true,
playerVolume: 0.1,
playerLoop: true,
playerClickAnywhereToClose: false,
previewQuality: 2,
lastUpdated: 0,
data: {},
url: "https://api.jsonsilo.com/public/445432dd-f613-4528-a45d-71a1efacee95",
};
const userConfig = GM_getValue("config", defaultConfig);
const expired = (new Date().getTime() - userConfig.lastUpdated) >= (7 * 24 * 60 * 60 * 1000);
console.log("[US:DEBUG] : ", `CONFIG: `, userConfig);
//Fetch Studio Codes Data
async function fetchDataFromAPI() {
try {
const response = await fetch(userConfig.url);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
return data;
} catch (error) {
console.log("[US:DEBUG] : ", " Error fetching data:", error);
}
}
async function main() {
GM_registerMenuCommand("Config", openSettings);
let studios, prefixMap, prefixMapData;
const lastFetchTime = parseInt(userConfig.lastUpdated) || 0;
const oneWeekInMilliseconds = 7 * 24 * 60 * 60 * 1000;
const now = new Date().getTime();
const isDataOld = now - lastFetchTime >= oneWeekInMilliseconds;
if (isDataOld) {
console.log("[US:DEBUG] : ", `\n -- TIMESTAMP:\t\t${new Date().getTime()} \n -- LAST UPDATED:\t${lastFetchTime} \n -- EXPIRED:\t\t${isDataOld} \n -- Data is not available or old. Fetching new data.`);
const response = await fetchDataFromAPI();
if (response) {
userConfig.lastUpdated = now;
userConfig.data = response;
studios = response.studios;
prefixMap = response.prefixMap;
prefixMapData = response.prefixMapData;
GM_setValue("config", userConfig);
} else {
console.log("[US:DEBUG] : ", "No studios data found. Exiting.");
return;
}
} else {
console.log("[US:DEBUG] : ", `\n -- TIMESTAMP:\t\t${new Date().getTime()} \n -- LAST UPDATED:\t${lastFetchTime} \n -- EXPIRED:\t\t${isDataOld} \n -- Data is still fresh. Skipping API call.`);
studios = userConfig.data.studios;
prefixMap = userConfig.data.prefixMap;
prefixMapData = userConfig.data.prefixMapData;
}
function mergeStudiosByPrefix(studios, prefixes) {
const result = {};
Object.keys(prefixes).forEach((prefix) => {
result[prefix] = [];
prefixes[prefix].forEach((key) => {
if (studios[key]) {
result[prefix] = [...result[prefix], ...studios[key]];
}
});
});
return result;
}
function valuesToRegex(object) {
return Object.fromEntries(
Object.entries(object).map(([object, values]) => [
object,
new RegExp(`\\b(?:${values.join("|")})(?:-)?\\d{3,5}(?:.)?\\b`, "i"),
])
);
}
const studioMergedForPrefix = mergeStudiosByPrefix(studios, prefixMap);
const regexMap = valuesToRegex(studioMergedForPrefix);
// Detect Page
if (window.location.pathname.startsWith("/view/")) {
console.log("[US:DEBUG] : ", "Torrent Detail Page");
const titlePanel = document.getElementsByClassName("panel-title");
if (
titlePanel[0].parentElement.nextElementSibling.classList.contains("panel-body") &&
titlePanel[0].parentElement.nextElementSibling.children[0].classList.contains("row")
) {
//Append Button
const code = detectCode(titlePanel[0].innerText, regexMap);
if (code && code.match) {
console.log("[US:DEBUG] : ", "Valid studios detected: ", code);
let codeId = code.match.toLowerCase();
const buttonDom = document.getElementsByClassName("panel-footer clearfix")[0];
const newButton = document.createElement("a");
newButton.setAttribute("href", "?preview=" + codeId);
newButton.setAttribute("title", "Original DVD Preview (Not Torrent Preview!)");
newButton.innerHTML = `<i class="fa fa-video-camera"></i> Preview`;
const buttonDivider = document.createTextNode(" ・");
buttonDom.insertBefore(newButton, buttonDom.firstChild);
buttonDom.insertBefore(buttonDivider, buttonDom.firstChild.nextSibling);
newButton.addEventListener("click", function (event) {
event.preventDefault();
openPreview(codeId, code.cdn);
});
} else {
return;
}
} else {
return;
}
} else {
console.log("[US:DEBUG] : ", "Non Torrent Detail Page");
const rows = document.querySelectorAll("tr");
//Append Button
rows.forEach((row, index) => {
if (!row || index === 0) return;
const categoryCell = row.querySelector("td:nth-child(1) a")["title"];
const titleCell = row.querySelector("td:nth-child(2)");
const linkCell = row.querySelector("td:nth-child(3)");
if (categoryCell === "Real Life - Videos" || categoryCell === "Art - Pictures") {
const code = detectCode(titleCell.innerText, regexMap);
if (code && code.match) {
console.log("[US:DEBUG] : ", "Valid studios detected: ", code);
let codeId = code.match.toLowerCase();
//const buttonDom =
// titleCell.parentElement.querySelector("td:nth-child(3)");
const newButton = document.createElement("a");
newButton.setAttribute("href", "?preview=" + codeId);
newButton.setAttribute("title", "Original DVD Preview (Not Torrent Preview!)");
newButton.innerHTML = `<i class="fa fa-video-camera"></i>`;
linkCell.appendChild(newButton);
newButton.addEventListener("click", function (event) {
event.preventDefault();
openPreview(codeId, code.cdn);
});
} else {
return;
}
}
});
}
function detectCode(title, patterns) {
for (const [key, pattern] of Object.entries(patterns)) {
const match = title.match(pattern);
if (match) {
return {
match: match[0],
cdn: key,
};
}
}
return {match: null, cdn: null};
}
function openPreview(code, cdn) {
code = code.replace(/\s+/g, "").replace(/[^\w]/g, "");
fetchData(code, cdn, (response) => {
//if (!response) return;
//Player
const video = document.createElement("video");
if (response.length <= 0) {
showToast();
return;
}
video.src = qualitySelector(userConfig.previewQuality, qualitySorter(response));
video.autoplay = userConfig.playerAutoplay;
video.volume = userConfig.playerVolume;
video.loop = userConfig.playerLoop;
video.controls = true;
video.classList.add("overlay-video");
video.addEventListener("error", function (event) {
console.error("Video failed to load:");
videoContainer.innerHTML = `<p style="color: white; margin: 0; text-align: center;">Preview Not Available.<br>This window will auto close in 3 seconds</p>`;
setTimeout(() => {
videoContainer.remove();
}, 3000);
});
const closeButton = document.createElement("button");
closeButton.textContent = "Close";
closeButton.classList.add("close-button");
closeButton.addEventListener("click", () => {
videoContainer.remove();
});
const videoContainer = document.createElement("div");
videoContainer.classList.add("overlay-video-container");
videoContainer.classList.add(`${code}`);
videoContainer.appendChild(video);
videoContainer.appendChild(closeButton);
document.body.appendChild(videoContainer);
if (userConfig.playerClickAnywhereToClose) {
videoContainer.addEventListener("click", (event) => {
if (event.target !== video) {
videoContainer.remove();
}
});
}
});
}
function fetchData(id, cdn, callback) {
let dvdId = id;
const prefix = prefixMapData[cdn];
if (prefix) {
dvdId = prefix + dvdId;
}
GM_xmlhttpRequest({
method: "GET",
url: "https://www.dmm.co.jp/service/digitalapi/-/html5_player/=/cid=" + dvdId.toLowerCase(),
onload: function (response) {
if (response.status === 200) {
let scriptData, scriptObj;
let scripts = response.responseXML.scripts;
for (let i = 0; i < scripts.length; i++) {
const script = scripts[i];
if (script.textContent.includes("dmm")) {
scriptData = script.textContent;
}
}
const regex = /const args = ({.*?});/s;
const match = scriptData.match(regex);
if (match) {
const jsonString = match[1];
try {
scriptObj = JSON.parse(jsonString.replace(/\\/g, ""));
} catch (error) {
console.error("Error parsing JSON:", error);
}
//callback(scriptObj.src);
callback(scriptObj.bitrates);
}
} else {
console.error("Request failed with status:", response.status);
}
},
});
}
function qualitySorter(items) {
const qualityTiers = {
5: {min: 1440, max: 2160},
4: {min: 1080, max: 1439},
3: {min: 720, max: 1079},
2: {min: 480, max: 719},
1: {min: 0, max: 479},
};
const extractResolution = (bitrate) => {
const match = bitrate.match(/\((\d+)p\)/);
return match ? parseInt(match[1], 10) : null;
};
const getQualityTier = (resolution) => {
for (const [tier, {min, max}] of Object.entries(qualityTiers)) {
if (resolution >= min && resolution <= max) {
return tier;
}
}
return "Unknown";
};
const tierMap = new Map();
items.forEach((item) => {
const resolution = extractResolution(item.bitrate);
if (resolution) {
const qualityTier = getQualityTier(resolution);
if (!tierMap.has(qualityTier)) {
tierMap.set(qualityTier, {
quality: qualityTier,
bitrate: item.bitrate,
src: item.src,
});
}
}
});
return Array.from(tierMap.values());
}
function qualitySelector(desiredQuality, array) {
const sortedArray = array.slice().sort((a, b) => b.quality - a.quality);
for (const item of sortedArray) {
if (item.quality <= desiredQuality) {
return item.src;
}
}
return null;
}
function showToast() {
const toast = document.createElement("div");
toast.className = "toast";
toast.textContent = "No Preview Available!";
document.body.appendChild(toast);
setTimeout(() => {
toast.classList.add("show");
}, 0);
setTimeout(() => {
toast.classList.remove("show");
setTimeout(() => {
document.body.removeChild(toast);
}, 500);
}, 2000);
}
// Settings
//const footer = document.querySelector('footer');
const footerLink = document.querySelector("footer p");
const settingButton = document.createElement("a");
const buttonDivider = document.createTextNode("・");
settingButton.setAttribute("href", "?setting");
settingButton.setAttribute("title", "Settings");
settingButton.innerHTML = `<i class="fa fa-cogs"></i> Settings`;
footerLink.insertBefore(settingButton, footerLink.firstChild);
footerLink.insertBefore(buttonDivider, footerLink.firstChild.nextSibling);
settingButton.addEventListener("click", function (event) {
event.preventDefault();
openSettings();
});
// Menubar
const menubar = document.querySelector(".navbar-right .dropdown-menu");
const newLi = document.createElement("li");
const newLink = document.createElement("a");
newLink.setAttribute("href", "?setting");
newLink.setAttribute("title", "Settings");
newLink.innerHTML = `<i class="fa fa-cogs"></i> Settings`;
newLi.appendChild(newLink);
menubar.appendChild(newLi);
newLink.addEventListener("click", function (event) {
event.preventDefault();
openSettings();
});
function openSettings() {
const isExist = document.querySelector(".settings-container");
if (isExist) return;
const container = document.createElement("div");
container.classList.add("settings-container");
container.setAttribute("aria-label", "Settings");
// Parse config
const parsePlayerAutoplay = userConfig.playerAutoplay ? "checked" : "";
const parsePlayerLoop = userConfig.playerLoop ? "checked" : "";
const parsePlayerClickAnywhereToClose = userConfig.playerClickAnywhereToClose ? "checked" : "";
const parseDarkTheme = userConfig.darkTheme ? "checked" : "";
container.innerHTML = `
<div class="settings-item">
<!--
<label for="video-width">Video Player Width (px) <i>[Default: 320]</i></label>
<input type="text" id="video-width" name="video-width" placeholder="Enter width in px" value="${userConfig.playerWidth}">
</div>
-->
<div class="settings-item">
<label for="volume-slider" class="range-label">Volume:</label>
<input type="range" id="volume-slider" name="volume-slider" min="0" max="1" value="${userConfig.playerVolume}" step="0.01">
</div>
<div class="settings-item">
<label for="quality">Video Quality (if available):</label>
<select name="qualities" id="quality">
<option value="5">QHD (2K/1440p)</option>
<option value="4">FHD (1080p)</option>
<option value="3">HD (720p)</option>
<option value="2">Medium</option>
<option value="1">Low</option>
</select>
</div>
<div class="settings-item">
<label>
<input type="checkbox" id="autoplay" name="autoplay" ${parsePlayerAutoplay}>
Video Autoplay
</label>
</div>
<div class="settings-item">
<label>
<input type="checkbox" id="loop" name="loop" ${parsePlayerLoop}>
Video Loop
</label>
</div>
<div class="settings-item">
<label>
<input type="checkbox" id="clickanywhere" name="clickanywhere" ${parsePlayerClickAnywhereToClose}>
Click Anywhere To Close Player
</label>
</div>
<div class="settings-item">
<label disabled>
<input type="checkbox" id="darktheme" name="darktheme" ${parseDarkTheme} disabled>
Auto Dark Theme
</label>
</div>
<div class="settings-item last">
<label for="apiUrl">API Url:</label>
<input type="text" id="apiUrl" name="apiUrl" value="${userConfig.url}"></input>
<button id="resetApiData" class="button" type="button">Force Refresh API Data</button>
</div>
<div class="settings-item">
<button id="saveButton" class="button" type="button">Save Settings</button>
<button id="closeButton" class="button" type="button">Close</button>
</div>`;
// Append the container to the DOM
document.body.appendChild(container);
// Access the quality select element and set its value
const preQuality = document.getElementById("quality");
if (preQuality) {
preQuality.value = userConfig.previewQuality || 5;
}
// Add event listeners for buttons
let saveButton = document.getElementById("saveButton");
saveButton.addEventListener("click", saveConfigMenu);
// Reset API
let apiButton = document.getElementById("resetApiData");
apiButton.addEventListener("click", () => {
userConfig.lastUpdated = 0;
saveConfigMenu();
});
let closeButton = document.getElementById("closeButton");
closeButton.addEventListener("click", () => {
const toRemove = document.querySelector(".settings-container");
if (toRemove) {
toRemove.remove();
} else {
console.log("[US:DEBUG] : ", "Bruh.");
}
});
function saveConfigMenu() {
const preQuality = document.getElementById("quality");
const newVolume = document.getElementById("volume-slider");
const autoplay = document.getElementById("autoplay");
const loop = document.getElementById("loop");
const darktheme = document.getElementById("darktheme");
const clickanywhere = document.getElementById("clickanywhere");
const apiUrl = document.getElementById("apiUrl");
let finalVolume;
if (
newVolume.value !== null &&
!isNaN(newVolume.value) &&
newVolume.value >= 0 &&
newVolume.value <= 1
) {
finalVolume = parseFloat(newVolume.value);
}
userConfig.darkTheme = darktheme.checked;
userConfig.playerAutoplay = autoplay.checked;
userConfig.playerVolume = finalVolume;
userConfig.playerLoop = loop.checked;
userConfig.playerClickAnywhereToClose = clickanywhere.checked;
userConfig.previewQuality = preQuality.value;
userConfig.url = apiUrl.value;
GM_setValue("config", userConfig);
location.reload();
}
}
}
main();
//!SECTION
})();