override-missav-js

override missav js
Ask a question, post a review, or report the script.
Wrap lines
// ==UserScript==
// @name         override-missav-js
// @namespace    https://missav.com
// @version      v0.0.16
// @description  override missav js
// @author       You
// @match        https://missav.com/*
// @exclude      /^https:\/\/missav\.com\/.*-\d+.*$/
// @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 = "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 = "⚙️";
 
    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)
 
})();