Openings/Endings Enhancer - MAL

Click on the Play button to watch and listen the OP/END directly on MAL! Click on the OP/END music title text to search for the music title on youtube on a new tab.

目前为 2021-08-06 提交的版本。查看 最新版本

// ==UserScript==
// @name        Openings/Endings Enhancer - MAL
// @namespace   Search_Ops_Ends
// @version     0.6
// @description Click on the Play button to watch and listen the OP/END directly on MAL! Click on the OP/END music title text to search for the music title on youtube on a new tab.
// @author      hacker09
// @match       https://myanimelist.net/anime/*
// @match       https://myanimelist.net/manga/*
// @icon        https://www.google.com/s2/favicons?domain=myanimelist.net
// @run-at      document-end
// ==/UserScript==

(async function() {
  'use strict';
  if (document.querySelectorAll('span[class*="theme-song"]').length !== 0) //If there's at least one op/end listed on the page
  { //Starts the if condition
    var TimesExecuted = 0; //Creates a new variable

    window.onscroll = async function() { //Creates a new function to run when the page is scrolled
      TimesExecuted += 1; //Sum the amount of times that the page is scrolled
      if (TimesExecuted === 1) { //On the first time that the page is hovered

        const response1 = await (await fetch('https://staging.animethemes.moe/api/resource?filter[external_id]=' + location.pathname.split('/')[2] + '&filter[site]=MyAnimeList&include=anime')).json(); //Get the anime id on themes.moe

        const FinalResponse = await (await fetch('https://staging.animethemes.moe/api/anime?filter[anime][id]=' + response1.resources[1].anime[0].id + '&include=themes.entries.videos')).json(); //Get the videos from theme.moe

        function OnClick(el, link) { //Creates a new function
          if (document.getElementsByName('MusicIframe')[0].style.display === 'none') { //If the video is hidden
            document.getElementsByName('MusicIframe')[0].src = link; //Add the video source url to the iframe
            el.src = "https://i.imgur.com/p66Ij4i.png"; //Change the btn to pause
            document.getElementsByName('MusicIframe')[0].style.display = ''; //Show the video
          } else { //If the video is being shown
            document.getElementsByName('MusicIframe')[0].src = ''; //Remove the video source url of the iframe
            el.src = "https://i.imgur.com/4qHDObk.png"; //Change the btn to play
            document.getElementsByName('MusicIframe')[0].style.display = 'none'; //Hides the video
          } //Finishes the else condition
        } //Finishes the onclick function

        FinalResponse.anime[0].themes.forEach(function(video, i) { //forEach video link
          document.querySelectorAll('span[class*="theme-song"]')[i].insertAdjacentHTML('beforeend', `<img id="PlayPause" src="https://i.imgur.com/4qHDObk.png" style="cursor: 'pointer'; margin-left: 5px;" />`); //Add the play btn in front of the OP/END
          document.querySelectorAll("#PlayPause")[i].onclick = function(e) { //When the play/pause img is clicked
            e.preventDefault(); //Stop YT from being opened
            e.stopPropagation(); //Stop YT from being opened
            OnClick(this, video.entries[0].videos[0].link.replace('staging.', '')); //Call the OnClick function
          }; //Run the OnClick function on every play/pause btn when clicked
        }); //Finishes the foreach function

        document.querySelectorAll("div.di-t")[1].insertAdjacentHTML('afterEnd', `<iframe width="800" height="400" name="MusicIframe" style="display:none;" allowfullscreen></iframe>`); //Add the iframe on the page
      } // //Finishes the if condition
    }; //Finishes the onscroll event listener

    document.querySelectorAll('span[class*="theme-song"]').forEach(function(el) { //For each op/end
      var title = el.innerText.split(': '); //Save the op/end title on a variable

      if (title[1] !== undefined) //If there's a number: in front of the op/end title
      { //Starts the if condition
        title = title[1].split('(ep')[0].trim(); //Save the op/end title on a variable
      } //Finishes the if condition
      else //If there's no number: in front of the op/end title
      { //Starts the else condition
        title = title[0].split('(ep')[0].trim(); //Save the op/end title on a variable
      } //Finishes the else condition

      el.style.cursor = 'pointer'; //Make the op/end title element look like it's clickable

      el.onclick = function() //When the op/end title is clicked
      { //Starts the onclick function
        window.open('https://www.youtube.com/results?search_query=' + title, 'blank'); //Search the music title on youtube on a new tab
      }; //Finishes the onclick function

      el.onmouseout = function() //When the op/end title is unhovered
      { //Starts the onmouseout function
        this.style.color = ''; //Readd the default color
      }; //Finishes the onmouseout function

      el.onmouseover = function() //When the op/end title is hovered
      { //Starts the onmouseover function
        this.style.color = '#6386d5'; //Change the default text color to blue
      }; //Finishes the onmouseover function

    }); //Finishes the for each condition
  } //Finishes the if condition
})();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址