override-missav-js

override missav js

Du musst eine Erweiterung wie Tampermonkey, Greasemonkey oder Violentmonkey installieren, um dieses Skript zu installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Violentmonkey installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Violentmonkey installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Userscripts installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey installieren.

Sie müssten eine Skript Manager Erweiterung installieren damit sie dieses Skript installieren können

(Ich habe schon ein Skript Manager, Lass mich es installieren!)

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

(Ich habe bereits einen Benutzerstil Verwaltung, ich möchte ihn installieren!)

// ==UserScript==
// @name         override-missav-js
// @namespace    https://missav.*
// @version      v0.1.4
// @description  override missav js
// @author       You
// @include        https://missav.*/*
// @exclude      /^https:\/\/missav\.*\/.*-\d+.*$/
// @icon         https://www.google.com/s2/favicons?sz=64&domain=missav.ai
// @grant        none
// ==/UserScript==

// 节流
function throttle(func, wait) {
    let timeout;
    return function () {
      let context = this;
      let args = arguments;
      if (!timeout) {
        timeout = setTimeout(() => {
          timeout = null;
          func.apply(context, args);
        }, wait);
      }
    };
  }

// 防抖
function debounce(func, wait, immediate) {
    let timeout;
    return function () {
      let context = this;
      let args = arguments;
      let later = function () {
        timeout = null;
        if (!immediate) {
          func.apply(context, args);
        }
      };
      let callNow = immediate && !timeout;
      clearTimeout(timeout);
      timeout = setTimeout(later, wait);
      if (callNow) {
        func.apply(context, args);
      }
    };
  }

const onMouseEnter = () => {
    // 获取页面中所有拥有 .thumbnail 类的元素
    const thumbnails = document.querySelectorAll(".thumbnail");

    // 遍历所有的 .thumbnail 元素
    thumbnails.forEach(function (thumbnail) {
        // 在每个 .thumbnail 元素下找到符合条件的 a 元素
        const link = thumbnail.querySelector("div:first-child > a:last-child");

        if (link == null) {
            return;
        }

        // 检查 link 是否已经有监听器或者已经被触发过点击
        if (!link.hasAttribute("data-click-triggered")) {
            // 创建一个监听函数,它可以被解除绑定
            function hoverTriggerClick(event) {
                // 触发点击事件
                link.click();
                // 在触发点击后解除 mouseenter 事件监听
                link.removeEventListener("mouseenter", hoverTriggerClick);
            }

            // 标记 link 已添加事件监听器
            link.setAttribute("data-click-triggered", "true");
            // 为该 a 元素添加鼠标悬停的事件监听器
            link.addEventListener("mouseenter", hoverTriggerClick);
        }
    });
};

const onVideo = () => {
    // 获取页面中所有拥有 .thumbnail 类的元素
    const thumbnails = document.querySelectorAll(
        ".thumbnail > div:first-child > a:first-child"
    );

    // 遍历所有的 .thumbnail 元素
    thumbnails.forEach(function (thumbnail) {
        // 在每个 .thumbnail 元素下找到符合条件的 a 元素
        const video = thumbnail.querySelector(
            "div:first-child > a:first-child > video"
        );

        if (video == null){
            return;
        }

        if (video.getAttribute("play") === "true" && video.src.indexOf("https") != -1) {
            // video.play();
            // video.className = "preview";
            return;
        }

        // const id = video.id.replace("preview-", "");
        // console.log(id, video.dataset.src);
        // video.src = video.dataset.src.replace("undefined", id);

        // console.log(video.id, video.dataset.src);

        if (video.dataset.src.indexOf("undefined") > -1) {
            return;
        }

        video.setAttribute("costom-src", "true");
        video.setAttribute("play", "true");
        video.src = video.dataset.src;
        // video.play();
        // video.className = "preview";
    });
};

const playVideo = () => {
    onVideo();
    const videos = document.querySelectorAll("video[costom-src=true]");
    videos.forEach((video) => {
        video.play();
        video.className = "preview";
    });
}

const addSettingIcon = () => {
    const div = document.createElement("div");
    div.style.position = "fixed";
    div.style.right = "20px";
    div.style.bottom = "45%";
    div.style.padding="10px";
    div.style.zIndex = "50";
    div.style.width = "30px";
    div.style.height = "30px";
    div.style.color = "white";
    div.style.backgroundColor = "black";
    div.style.borderRadius = "50%";
    div.style.opacity = "1";
    div.style.cursor = "pointer";
    div.style.display = "flex";
    div.style.justifyContent = "center";
    div.style.alignItems = "center";
    div.style.userSelect = "none";
    div.innerText = "⚙️";

    div.addEventListener("mouseenter", function () {
        div.style.opacity = "1";
    });
    div.addEventListener("mouseleave", function () {
        div.style.opacity = "0.5";
    });

    div.addEventListener("click", function () {
        playVideo();
    });

    document.body.appendChild(div);
}

const addTriggerAutoPlay = () => {
    const div = document.createElement("div");
    div.style.position = "fixed";
    div.style.left = "20px";
    div.style.bottom = "20px";
    div.style.padding="10px";
    div.style.zIndex = "50";
    div.style.width = "30px";
    div.style.height = "30px";
    div.style.color = "white";
    div.style.backgroundColor = "black";
    div.style.borderRadius = "50%";
    div.style.opacity = "1";
    div.style.cursor = "pointer";
    div.style.display = "flex";
    div.style.justifyContent = "center";
    div.style.alignItems = "center";
    div.style.userSelect = "none";
    div.innerText = "🚫";

    if (localStorage.getItem("autoPlay") === "1") {
        div.innerText = "♨️";
    }

    div.addEventListener("mouseenter", function () {
        div.style.opacity = "1";
    });
    div.addEventListener("mouseleave", function () {
        div.style.opacity = "0.5";
    });

    div.addEventListener("click", function () {
        const autoPlay = localStorage.getItem("autoPlay");
        if (autoPlay === "1") {
            div.innerText = "🚫";
            localStorage.setItem("autoPlay", "0");
            return;
        }
        div.innerText = "♨️";
        localStorage.setItem("autoPlay", "1");
    });

    document.body.appendChild(div);
}

(function () {
    "use strict";

    addSettingIcon();
    addTriggerAutoPlay();

    document.addEventListener("keydown", function (event) {
        playVideo();
    });

    const timer = setInterval(() => {
        if (window.player != null) {
            return;
        }

        const autoPlay = localStorage.getItem("autoPlay");
        if (autoPlay === "1") {
            setTimeout(() => {
                playVideo();
            }, 2000);

            const observer = new MutationObserver(function (mutations) {
                mutations.forEach(function (mutation) {
                    if (mutation.addedNodes.length > 0) {
                        // onMouseEnter();
                        debounce(playVideo, 1000)();
                    }
                });
            });

            observer.observe(document.body, {
                attributes: false,
                childList: true,
                subtree: true,
            });
        }

        clearInterval(timer);

    }, 1000)

})();