override-missav-css/js

override missav css/js

Per 19-12-2023. Zie de nieuwste versie.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         override-missav-css/js
// @namespace    https://missav.com
// @version      v0.0.3
// @description  override missav css/js
// @author       You
// @match        https://missav.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=missav.com
// @grant        none
// ==/UserScript==

// 注入 css
const injectCss = () => {
  const css = `
    /* 你的全局CSS */
    .truncate {
       overflow: auto;
       text-overflow: auto;
       white-space: inherit;
    }
    `;

  const style = document.createElement("style");
  style.type = "text/css";
  style.appendChild(document.createTextNode(css));
  document.head.appendChild(style);
};

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 || video.getAttribute("play") === "true") {
      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);

    video.className = "preview";

    video.src = video.dataset.src;
    video.play();
    video.setAttribute("play", "true");
  });
};

(function () {
  "use strict";

  injectCss();

  setTimeout(() => {
    onVideo();
  }, 2000);

  // onMouseEnter();

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

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