Watch Order & Adaptations Finder

See the franchise's correct watch order and all entries. Easily check if an entry has Live-Action/Dorama adaptations, and copy the entry or all franchise entries' title(s).

  1. // ==UserScript==
  2. // @name Watch Order & Adaptations Finder
  3. // @namespace Search for Live-Actions\Doramas\All Related Entries + Correct Watch Order + Copy Entry Title
  4. // @version 54
  5. // @description See the franchise's correct watch order and all entries. Easily check if an entry has Live-Action/Dorama adaptations, and copy the entry or all franchise entries' title(s).
  6. // @author hacker09
  7. // @include https://myanimelist.net/forum/?topicid=1863965
  8. // @include https://myanimelist.net/editclub.php?cid=5450&action=details
  9. // @include /^https:\/\/myanimelist\.net\/((anime|manga)(id=)?(\.php\?id=)?)(\/)?([\d]+)/
  10. // @exclude https://myanimelist.net/anime/genre/*
  11. // @exclude https://myanimelist.net/anime/producer/*
  12. // @icon https://t3.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=https://myanimelist.net&size=64
  13. // @run-at document-end
  14. // @connect chiaki.site
  15. // @connect mydramalist.com
  16. // @grant GM.xmlHttpRequest
  17. // @grant GM_openInTab
  18. // ==/UserScript==
  19.  
  20. (function() {
  21. 'use strict';
  22. var hasRun = true; //Create a new variable
  23. async function Prog() { //Run the program
  24. if (document.hasFocus() && hasRun) //If the tab has focus and it's the first time the script runs
  25. { //Starts the if condition
  26. hasRun = false; //Change the var condition
  27. if (location.href === 'https://myanimelist.net/editclub.php?cid=5450&action=details' && document.querySelector(".header-profile-link").innerText.match(/hacker09|IridescentJaune|tsubasalover/)) { //If the user is on the [[ Live Action Adaptations ]] Edit Club page
  28. document.querySelectorAll('[id*="Relation"]').forEach((element, i) => { //ForEach list
  29. element.style.display = 'none'; //Hide all 3 lists
  30. element.insertAdjacentHTML('beforebegin', `<div class="toggle-icon${i}" style=" width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 10px solid black; cursor: pointer; display: inline-block; margin-right: 5px; "></div>`); //Create the toggle icon HTML string
  31.  
  32. const toggleIcon = element.previousElementSibling; //Add the toggle icon
  33.  
  34. toggleIcon.addEventListener('click', () => { //Add a click event listener to the toggle icon
  35. if (element.style.display === 'none') { //if the list is hidden
  36. element.style.display = ''; //Show the list
  37. // Change the triangle to point down
  38. toggleIcon.style.borderTop = '10px solid black';
  39. toggleIcon.style.borderBottom = '0';
  40. toggleIcon.style.borderLeft = '10px solid transparent';
  41. toggleIcon.style.borderRight = '10px solid transparent';
  42. } else { //If the list is visible
  43. element.style.display = 'none'; //Hide the list
  44. // Change the triangle to point right
  45. toggleIcon.style.borderTop = '10px solid transparent';
  46. toggleIcon.style.borderBottom = '10px solid transparent';
  47. toggleIcon.style.borderLeft = '10px solid black';
  48. toggleIcon.style.borderRight = '0';
  49. }
  50. });
  51. });
  52.  
  53. document.querySelectorAll('[valign="top"]')[6].insertAdjacentHTML('beforeend', ` <div style="margin: 10px 0;"> <input type="text" id="SearchNum" placeholder="ID" style="padding: 5px;width: 57px;height: 7px;"> <button id="SearchBTN" style=" margin-top: 5px; background-color: #4065ba; border: none; color: #fff; cursor: pointer; font-size: 11px; padding: 4px 8px; ">Search</button> </div> `);
  54.  
  55. // Add event listeners for search
  56. document.getElementById('SearchBTN').addEventListener('click', performSearch);
  57. document.getElementById('SearchBTN').addEventListener('keypress', function(e) {
  58. if (e.key === 'Enter') {
  59. performSearch();
  60. }
  61. });
  62.  
  63. function performSearch() {
  64. event.preventDefault(); // Prevent default action
  65. document.querySelectorAll('[id*="Relation"]').forEach((element) => { //ForEach list
  66. element.style.display = ''; //Display all lists
  67. });
  68. document.querySelectorAll('a').forEach(link => {
  69. const onclickValue = link.getAttribute('onclick');
  70. if (onclickValue) {
  71. const uniqueNumbers = new Set(onclickValue.match(/\d+/g));
  72. if (uniqueNumbers.has(document.getElementById('SearchNum').value)) {
  73. link.parentNode.style.backgroundColor = 'cyan';
  74. link.scrollIntoView({ behavior: 'smooth', block: 'center' });
  75. }
  76. }
  77. });
  78. }
  79.  
  80. document.querySelectorAll('[valign="top"]').forEach((el,i) => { //ForEach row
  81. if (document.querySelector(".header-profile-link").innerText.match(/IridescentJaune|tsubasalover/) && i !== 6) { //Show only the Club Relations
  82. el.parentNode.style.display = 'none'; //Hide everything besides the Club Relations
  83. }
  84. });
  85. } //Finishes the if condition
  86.  
  87. if (location.href === 'https://myanimelist.net/forum/?topicid=1863965') { //If the user is on the Official Guidex Index
  88. $("b:contains('Guides available:')")[0].innerHTML = '<b style="font-weight: normal;">(Click on the letter you want to jump to.)</b><br><div style="cursor: pointer;"><b id="GoToA">Guides available: A</b> | <b id="GoToB">B</b> | <b id="GoToC">C</b> | <b id="GoToD">D</b> | <b id="GoToE">E</b> | <b id="GoToF">F</b> | <b id="GoToG">G</b> | <b id="GoToH">H</b> | <b id="GoToI">I</b> | <b id="GoToJ">J</b> | <b id="GoToK">K</b> | <b id="GoToL">L</b> | <b id="GoToM">M</b> | <b id="GoToN">N</b> | <b id="GoToO">O</b> | <b id="GoToP">P</b> | <b id="GoToQ">Q</b> | <b id="GoToR">R</b> | <b id="GoToS">S</b> | <b id="GoToT">T</b> | <b id="GoToU">U</b> | <b id="GoToV">V</b> | <b id="GoToW">W</b> | <b id="GoToX">X</b> | <b id="GoToY">Y</b> | <b id="GoToZ">Z</b><div> <style>#topBtn {display: block;position: fixed;bottom: 20px;right: 30px;z-index: 99;font-size: 18px;border: none;outline: none;background-color: #2e51a2;color: white;cursor: pointer;padding: 15px;border-radius: 4px;}</style><button onclick="document.documentElement.scrollTop = 0;" id="topBtn" title="Go to top" style="transform: rotate(90deg); display: block;">&lt;</button>'; //Adds a text and makes the letters clickable. Also adds a scroll to top button on the page
  89.  
  90. for (let i = 'A'.charCodeAt(0); i <= 'Z'.charCodeAt(0); ++i) { //For every charCode
  91. document.querySelector(`b#GoTo${String.fromCharCode(i)}`).onclick = () => document.querySelectorAll('b')[i - 36].scrollIntoView(); //Scroll the page until the letter can be seen
  92. } //Finishes the for condition
  93. } //Finishes the if condition
  94. else //If the user isn't on any Guide Index
  95. { //Starts the else condition
  96.  
  97. const findButton = document.createElement("a"), copyButton = document.createElement("a"), chiakiButton = document.createElement("a"); //Creates an "a" element so the button will appear
  98. var ChiakiFranchiseTitle, ChiakiFranchiseTitleWithSymbols, MalClubText, ChiakiDocument, IMDBAsianWiki, hasAnime = '', ChiakiTextData = [], ChiakientryidSArray = [], MyDramaListText = ' and MyDramaList', MyDramaListCheck = '👍 Found on MyDramaList.'; //Create new global variables
  99.  
  100. if (location.pathname.split('/')[1] === 'manga') { //If the user is in an manga entry
  101. const Relations = await (await fetch('https://api.jikan.moe/v4/' + location.href.split('/')[3] + '/' + location.pathname.match(/\d+/)[0] + '/relations')).json(); //Fetch
  102. hasAnime = Relations.data.flatMap(relation => relation.entry).find(entry => entry.type === "anime"); //Try getting 1 entry that is an anime
  103. } //Finishes the if condition
  104.  
  105. var entryid = hasAnime !== undefined && hasAnime !== '' ? hasAnime.mal_id : location.pathname.match(/\d+/)[0]; //Get the anime id
  106.  
  107. GM.xmlHttpRequest({ //Starts the xmlHttpRequest
  108. method: "GET",
  109. url: 'https://chiaki.site/?/tools/watch_order/id/' + entryid,
  110. onload: (response) => { //Starts the onload event listener
  111. ChiakiDocument = new DOMParser().parseFromString(response.responseText, 'text/html'); //Parses the fetch response
  112.  
  113. if (ChiakiDocument.querySelector("h2") !== null) { //Starts the if condition
  114. ChiakiFranchiseTitle = ChiakiDocument.querySelector("h2").innerText.split(' Watch Order')[0].replace(/[^a-zA-Z0-9]+/g, " ").trim(); //Get the anime title on the h2 element and remove the Watch Order text, symbols, and whitespaces
  115. ChiakiFranchiseTitleWithSymbols = ChiakiDocument.querySelector("h2").innerText.split(' Watch Order')[0].trim(); //Get the anime title on the h2 element (with symbols) and remove the Watch Order text, and whitespaces
  116. } //Finishes the if condition
  117.  
  118. ChiakiDocument.querySelectorAll("span.uk-text-muted.uk-text-small").forEach((TextElement, i) => { //Loop through the elements
  119. ChiakientryidSArray.push(ChiakiDocument.querySelectorAll("span.uk-text-muted.uk-text-small > a:nth-child(1)")[i].href.match(/\d+/)[0]); //Add All Anime Links on chiaki to an Array
  120.  
  121. const TotalRawDuration = TextElement.textContent.split("×")[1].split("|")[0].trim(); //Creates a variable to hold the total unprocessed times
  122. const ALLChiakiTitles = ChiakiDocument.querySelectorAll("span.wo_title")[i].innerText; //Creates a variable to get all the anime titles on chiaki site
  123. const TotalEpisodes = TextElement.textContent.split("|")[2].match(/\d+|\?/g)[0]; //Creates a variable to hold the total episodes
  124. const EpisodeType = TextElement.textContent.split("|")[1].trim(); //Creates a variable to get the episode types
  125. var eps = ' eps'; //Create a variable called eps
  126. var Duration = ''; //Creates a blank variable
  127. var PerEp = ' per ep'; //Create a variable called PerEp
  128. if (TotalEpisodes === '1') { //If the entry has only 1 ep
  129. eps = ' ' + EpisodeType; //Change the variable called eps
  130. PerEp = ''; //Change the variable called PerEp
  131. } //Finishes the if condition
  132. if (EpisodeType !== 'TV') { //If the entry type isn't TV
  133. if (TotalEpisodes !== '1') { //If the entry doesn't have only 1 ep
  134. eps = ' ' + EpisodeType + 's'; //Change the variable called eps
  135. } //Finishes the if condition
  136. Duration = ' of ' + TotalRawDuration + PerEp; //Defines the Duration variable if the episode type isn't TV
  137. } //Finishes the if condition
  138. ChiakiTextData.push(ALLChiakiTitles + ',, ' + TotalEpisodes + eps + Duration + ',\n'); //Add Everything to an Array
  139. }); //Finishes the for condition
  140.  
  141. } //Finishes the onload event listener
  142. }); //Finishes the xmlHttpRequest
  143.  
  144. GM.xmlHttpRequest({ //Starts the xmlHttpRequest
  145. method: "GET",
  146. url: "https://mydramalist.com/search?q=" + (hasAnime !== undefined ? ChiakiFranchiseTitle : document.querySelector("[itemprop*='name']").innerText.split('\n')[0]) + '&adv=titles&ty=68,77,83,86',
  147. onload: (response) => { //Starts the onload event listener
  148. const MyDramaListDocument = new DOMParser().parseFromString(response.responseText, 'text/html'); //Parses the fetch response
  149. if (MyDramaListDocument.querySelector(".m-b-sm") === null) { //If MyDramaList did not return any results
  150. MyDramaListText = ''; //Display to the user that MyDramaList Won't be opened if OK is clicked
  151. MyDramaListCheck = '✖ NOT Found on MyDramaList.'; //Display the confirmation that the anime doesn't have any adaptations found on MyDramaList
  152. } //Finishes the if condition
  153. } //Finishes the onload event listener
  154. }); //Finishes the xmlHttpRequest
  155.  
  156. copyButton.addEventListener("click", () => {
  157. navigator.clipboard.writeText(document.querySelector("[itemprop*='name']").innerText.split('\n')[0]); //Copy the entry title with symbols
  158. }); //Detect the single mouse click
  159. copyButton.addEventListener("dblclick", () => {
  160. navigator.clipboard.writeText(document.querySelector("[itemprop*='name']").innerText.split('\n')[0].replace(/[^a-zA-Z0-9]+/g, " ")); //Copy the entry title without symbols
  161. }); //Detect the double mouse click
  162.  
  163. copyButton.addEventListener("contextmenu", (e) => { //Detect a mouse click
  164. hasAnime !== undefined ? navigator.clipboard.writeText(ChiakiTextData.join('').trim()) : ''; //Copy the array to the clipboard
  165. e.preventDefault(); //Don't show the right-click default context menu
  166. }); //Detect the mouse right click
  167.  
  168. hasAnime !== undefined ? copyButton.setAttribute("title", "Click To Copy Entry Title (+ Symbols)\n2 Clicks To Copy Entry Title (Without Symbols)\n\nRight click to Copy ALL Anime Only Entry Titles on The Broadcast Order With EP Numbers, Entry Types and Duration Times") : copyButton.setAttribute("title", "1 Click To Copy Entry Title (+ Symbols)\n2 Clicks To Copy Entry Title (Without Symbols)"); //Detect a mouse hover on the button and shows an explanation text
  169.  
  170. copyButton.setAttribute("style", "cursor: pointer;margin-left: 13px;height: 10px;width: 10px;background-size: cover;display: inline-block;transform: scale(1.8);vertical-align: top;margin-top: 7px;"); //The CSS for the copy button
  171. copyButton.style.backgroundImage = `url(${document.querySelector(".dark-mode") !== null ? 'https://i.imgur.com/hIfOM22.png' : 'https://i.imgur.com/vU0m0ye.png'})`; //The copy button image
  172.  
  173. findButton.addEventListener("click", async () => { //Detect the mouse click and search for the anime title
  174. if (location.pathname.split('/')[1] === 'manga' || confirm('If you want to search using the Entry Title instead of the Franchise Title\nPress OK')) { //Show the confirmation alert box text
  175. ChiakiFranchiseTitle = document.querySelector("[itemprop*='name']").innerText.split('\n')[0]; //Change the Franchise title we got from Chiaki to the entry title (to search on mydramalist)
  176. ChiakiFranchiseTitleWithSymbols = document.querySelector("[itemprop*='name']").innerText.split('\n')[0]; //Change the Franchise title we got from Chiaki to the entry title (to search on the mal club)
  177. } //Finishes the if condition
  178.  
  179. if ([...ChiakiDocument.querySelectorAll('span.uk-text-muted.uk-text-small')].find(el => el.innerText.includes('TV')) !== null) { //If the Franchise has at least 1 entry that the type is TV
  180. const response = await (await fetch('https://myanimelist.net/clubs.php?cid=5450')).text(); //Fetch
  181.  
  182. new DOMParser().parseFromString(response, 'text/html').body.innerText.search(ChiakiFranchiseTitleWithSymbols) > -1 ? MalClubText = '👍 Found on the [[ Live Action Adaptations ]] MAL Club' : MalClubText = '✖ NOT found on the [[ Live Action Adaptations ]] MAL Club'; //If the title is found on the MALClub, display the confirmation whether or not the anime has adaptations found on the MALClub
  183.  
  184. MyDramaListCheck.match('👍') !== null || MalClubText.match('👍') !== null ? IMDBAsianWiki = 'IMDB, AsianWiki' : IMDBAsianWiki = 'IMDB and AsianWiki'; //Change the IMDBAsianWiki variable depending on if mydramalist or the mal club returned any results or not
  185.  
  186. if (confirm('Franchise Title: ' + ChiakiFranchiseTitle + '\n\n' + MyDramaListCheck + '\n' + MalClubText + '\n\nDo you want to open ' + IMDBAsianWiki + MyDramaListText + ' to confirm that information and get more detailed info?')) { //Show the confirmation alert box text
  187. GM_openInTab("https://www.imdb.com/find?s=tt&q=" + ChiakiFranchiseTitle + "&ref_=nv_sr_sm"); //Open IMDB on a new tab
  188. GM_openInTab("https://asianwiki.com/index.php?title=Special%3ASearch&search=" + ChiakiFranchiseTitle); //Open AsianWiki on a new tab
  189. if (MyDramaListCheck.match('NOT') === null) { //If MyDramaList returned any results
  190. GM_openInTab("https://mydramalist.com/search?q=" + ChiakiFranchiseTitle + '&adv=titles&ty=68,77,83,86'); //Open MyDramaList on a new tab
  191. } //Open MyDramaList on a new tab only if any results were found on the website
  192. } //Finishes the if condition
  193. } //Finishes the if condition
  194. else { //If the anime doesn't have any entry type = TV
  195. alert("This Franchise doesn't even have any TV type entries, it's very likely that there are adaptations of any kind for this Franchise, so there's no need to search."); //Show a message to the user
  196. } //Finishes the else condition
  197. }); //Finishes the event listener
  198.  
  199. findButton.setAttribute("title", "Search for Live-Actions/Doramas"); //Detects a mouse hover on the button and show the text Find Live-Actions
  200. findButton.setAttribute("style", "cursor: pointer;margin-left: 15px;height: 10px;width: 10px;background-size: cover;display: inline-block;transform: scale(1.8);vertical-align: top;margin-top: 7px;"); //The CSS for the findButton
  201. findButton.style.backgroundImage = `url(${document.querySelector(".dark-mode") !== null ? 'https://i.imgur.com/TEPmlyF.png' : 'https://i.imgur.com/2XQm3qI.png'})`; //The find button image
  202.  
  203. function Append(element) { //Creates a new Append function
  204. document.querySelector(".title-english") === null ? document.querySelector("[itemprop*='name']").append(element) : document.querySelector(".title-english").previousElementSibling.parentNode.insertBefore(element, document.querySelector(".title-english").previousElementSibling); //Append depending on if the entry has an English title or not
  205. } //Finishes the Append function
  206.  
  207. chiakiButton.addEventListener('mousedown', async function(e) { //Detects when the user middle clicks on the chiakiButton
  208. if (e.button === 1 && hasAnime !== undefined) //If the middle mouse button was clicked
  209. { //Starts the if condition
  210. e.preventDefault(); //Prevent the default middle button action from executing
  211. var IsBroadcast = false; //Check if the franchise should be watched using the broadcast order or not
  212. const response = await (await fetch('https://myanimelist.net/forum/?topicid=1890672')).text(); //Fetch
  213. const GuideIndexnewDocument = new DOMParser().parseFromString(response, 'text/html'); //Parses the fetch response
  214. const GuideIndexLinkElement = [...GuideIndexnewDocument.querySelectorAll('b')].find(el => el.innerText.includes('|' + entryid + '|')); //Gets the topic element that probably has the link of the Franchise and adds that to a variable
  215.  
  216. const FinalArray = ChiakientryidSArray.filter(d => !GuideIndexnewDocument.querySelector(".body.clearfix").innerText.match(/(?<=\|\b)\d+/gi).includes(d)); //Get the ids that chiaki.site has and the Guide is missing
  217. const GuideMissingIds = document.createElement("div"); //Creates a div element
  218. GuideMissingIds.setAttribute("style", "font-size: 80%;display: none;"); //Set the CSS for the button
  219. FinalArray.forEach(function(entryid) { //For every anime id that the guide index is missing
  220. GuideMissingIds.innerHTML += GuideMissingIds.innerHTML = `<br><a href="https://myanimelist.net/anime/${entryid}">https://myanimelist.net/anime/${entryid}</a>`; //Add to the GuideMissingIds div a line break + the anime link with the link as text too
  221. }); //Finishes the foreach condition
  222.  
  223. const condition = IsBroadcast === false && FinalArray.length !== 0 && FinalArray.length !== ChiakientryidSArray.length; //If the entry isn't broadcast and there's at least 1 missing id on the guide index and if the guide index is not missing the same amount of total links that Chiaki has for the franchise
  224. const target = condition ? "_blank" : "_self"; //Open on a new tab or on the same tab depending on the condition
  225.  
  226. if (GuideIndexLinkElement !== undefined) { //If the anime id was found on the guide index
  227. if (GuideIndexLinkElement.previousElementSibling.innerText.match('あ') !== null) { //If the anime name has the あ symbol in it on the guide index
  228. alert('Recommended watch order:\nBroadcast order.'); //Shows an alert
  229. IsBroadcast = true; //Check if the franchise should be watched using the broadcast order or not
  230. open("https://chiaki.site/?/tools/watch_order/id/" + entryid, target); //Opens the chiaki.site in a new tab
  231. } //Finishes the if condition
  232. else { //If the anime name doesn't have the あ symbol in it on the guide index
  233. alert('Recommended watch order:\nAEGC Guide Order.'); //Shows a text
  234. open(GuideIndexLinkElement.previousElementSibling.href, target); //Opens the GuideIndexLink in the a new tab
  235. } //Finishes the if condition
  236. } //Finishes the if condition
  237. else { //If the anime ID was NOT found on the guide index
  238. alert("Not found on the AEGC Club!\nOnly chiaki.site will be opened."); //Show a message
  239. open("https://chiaki.site/?/tools/watch_order/id/" + entryid, "_self"); //Open chiaki.site in a new tab
  240. } //Finishes the else condition
  241.  
  242. if (condition) { //If the condition is met
  243. var LinksButton = document.createElement("button"); //Creates a button element
  244. LinksButton.innerHTML = 'Show AEGC Club Missing Links'; //Defines the element text
  245. LinksButton.setAttribute("style", "margin-left: 10px; background-color: red; color: white; font-weight: bold;"); //Set the CSS for the button
  246. LinksButton.onclick = function() { //Detects the mouse click on the Show Links Button
  247. if (GuideMissingIds.style.display === "none") { //If the Show missing links button is hidden
  248. GuideMissingIds.style.display = ''; //Show the missing links button
  249. LinksButton.innerHTML = 'Hide AEGC Club Missing Links'; //Defines the element text
  250. } else { //If the Show missing links button is being shown
  251. GuideMissingIds.style.display = "none"; //Hide the missing links button
  252. LinksButton.innerHTML = 'Show AEGC Club Missing Links'; //Defines the element text
  253. } //Finishes the else condition
  254. }; //FInishes the onclick event listener
  255. Append(LinksButton); //Display the button to show the IDs that chiaki.site has and the Guide is missing
  256. Append(GuideMissingIds); //Display the IDs that chiaki.site has and the Guide is missing
  257. } //Finishes the if condition
  258.  
  259. if (GuideIndexLinkElement !== undefined && FinalArray.length === ChiakientryidSArray.length - 1) { //If the anime id was found on the guide index and the missing links are equal to all of the chiaki.site total links -1
  260. LinksButton.remove(); //Remove the button that shows the missing links
  261. const TwoFranchises = document.createElement("a"); //Creates an a element
  262. TwoFranchises.innerHTML = "<br>It seems that this entry is related to 2 Anime Franchises.<br>Both chiaki.site and the AEGC Club will be opened."; //Defines the element text
  263. TwoFranchises.setAttribute("style", "font-size: 80%;text-decoration: none;"); //Set the CSS for the button
  264. Append(TwoFranchises); //Append the NotFoundMessage close to the title element
  265.  
  266. open("https://chiaki.site/?/tools/watch_order/id/" + entryid, "_self"); //Opens chiaki.site in the same tab to show all the related anime entries on MAL on the correct watch order for the anime franchise and specifies that chiaki.site should be opened on a new tab
  267. } //Finishes the if condition
  268.  
  269. if (GuideIndexnewDocument.querySelector(".body.clearfix").innerText.match(new RegExp('(?:\\|' + entryid + '\\|)', 'gi')).length > 1) { //If 2 identical anime ids were found on the guide index
  270. const OtherFranchiseMessage = document.createElement("a"); //Creates an a element
  271. OtherFranchiseMessage.innerHTML = "<br>According to the AEGC club this entry also has another related entry that chiaki.site consider as being from another franchise."; //Defines the element text
  272. OtherFranchiseMessage.setAttribute("style", "font-size: 80%;text-decoration: none;"); //Set the CSS for the button
  273. Append(OtherFranchiseMessage); //Append the OtherFranchiseMessage close to the title element
  274. } //Finishes the if condition
  275. } //Finishes the if condition
  276. }); //Finishes the mousedown event listener
  277.  
  278. chiakiButton.addEventListener("click", () => { //Detect the mouse click
  279. open(hasAnime !== undefined ? "https://chiaki.site/?/tools/watch_order/id/" + entryid : "https://relatedanime.com/manga/" + entryid, "_self"); //Opens chiaki.site in the same tab to show all the related anime entries on MAL on the correct watch order for the anime franchise and specifies that chiaki.site should be opened on a new tab
  280. }); //Finishes the addEventListener click
  281.  
  282. chiakiButton.addEventListener("contextmenu", (e) => { //Detect a mouse click
  283. open(hasAnime !== undefined ? "https://relatedanime.com/anime/" + entryid : "https://relatedanime.com/manga/" + entryid, "_self"); //Open relatedanime.com in the same tab to show all the related anime entries on MAL on the correct watch order for the anime franchise, including reading material
  284. e.preventDefault(); //Don't show the right-click default context menu
  285. }); //Detect the mouse right click
  286.  
  287. chiakiButton.setAttribute("style", "cursor: pointer;margin-left: 15px;height: 10px;width: 10px;background-size: cover;display: inline-block;transform: scale(1.8);vertical-align: top;margin-top: 7px;"); //The CSS for the chiakiButton
  288.  
  289. chiakiButton.setAttribute("title", hasAnime !== undefined ? "Click to see all related anime entries only on the Broadcast Watch Order\nMiddle Click to see all related anime entries only on the Broadcast/Chronological Watch Order\nRight Click to see all related entries on the Broadcast Watch Order. (Including reading material)" : "This franchise has no anime adaptations!\nClick to open relatedanime.com to show all related entries on the Broadcast Watch Order. (Including reading material)"); //Detects a mouse hover on the button and shows some text info
  290.  
  291. chiakiButton.style.backgroundImage = `url(${hasAnime !== undefined ? 'https://i.imgur.com/i635kBp.png' : 'https://i.imgur.com/7tUhvqf.png'})`; //The chiaki.site/relatedanime.com button favicon
  292. Append(copyButton); //Append the button next to the title element
  293. Append(findButton); //Append the button next to the title element
  294. Append(chiakiButton); //Append the button next to the title element
  295. } //Finishes the else condition
  296. } //Finishes the Prog function
  297. } //Finishes the if condition
  298. Prog(); //Run the program
  299. window.addEventListener('focus', () => { Prog(); }, { once: true }); //Run the program when the tab gets focus
  300. })(); //Finishes the whole function