Skip to content

Instantly share code, notes, and snippets.

@Chairowell
Last active June 10, 2024 14:51
Show Gist options
  • Save Chairowell/0752f9b99a1b003e8ac6f6e0968b9563 to your computer and use it in GitHub Desktop.
Save Chairowell/0752f9b99a1b003e8ac6f6e0968b9563 to your computer and use it in GitHub Desktop.
AMQ Anime Information from AniList 点击查找搜索当前选项番剧信息
// ==UserScript==
// @name Anime Information from AniList
// @namespace http://tampermonkey.net/
// @version 0.1
// @description Get anime information from AniList and display it on the page
// @author YAASAKO
// @match https://animemusicquiz.com/*
// @grant GM_addStyle
// ==/UserScript==
(function() {
'use strict';
async function getAnime(name) {
var query = `
query ($id: Int, $page: Int, $perPage: Int, $search: String) {
Page (page: $page, perPage: $perPage) {
media (id: $id, search: $search) {
id
type
title {
romaji
native
english
}
coverImage {
extraLarge
}
episodes
seasonInt
}
}
}
`;
var variables = {
search: `${name}`,
page: 1,
perPage: 1,
type: "ANIME"
};
var url = 'https://graphql.anilist.co',
options = {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
},
body: JSON.stringify({
query: query,
variables: variables
})
};
try {
const response = await fetch(url, options);
const data = await response.json();
console.log('AniList Search Result:', data);
return data;
} catch (error) {
console.error('AniList Search Error:', error);
throw error;
}
}
async function reget() {
const onechoice = document.getElementById('qpMultipleChoiceEntryOne');
const twochoice = document.getElementById('qpMultipleChoiceEntryTwo');
const threechoice = document.getElementById('qpMultipleChoiceEntryThree');
const fourchoice = document.getElementById('qpMultipleChoiceEntryFour');
try {
const oneAnswer = await getAnime(onechoice.innerText);
const twoAnswer = await getAnime(twochoice.innerText);
const threeAnswer = await getAnime(threechoice.innerText);
const fourAnswer = await getAnime(fourchoice.innerText);
const answer = `
<div class="answer-box">
<div class="cover-img">
<img class="coverImage" src="${oneAnswer && oneAnswer['data'] && oneAnswer['data']['Page'] &&
oneAnswer['data']['Page']['media'] && oneAnswer['data']['Page']['media'][0] &&
oneAnswer['data']['Page']['media'][0]['coverImage'] &&
oneAnswer['data']['Page']['media'][0]['coverImage']['extraLarge'] || 'null'}" alt="">
</div>
<div class="title">
<div class="native">原名:${oneAnswer && oneAnswer['data'] && oneAnswer['data']['Page'] &&
oneAnswer['data']['Page']['media'] && oneAnswer['data']['Page']['media'][0] &&
oneAnswer['data']['Page']['media'][0]['title'] &&
oneAnswer['data']['Page']['media'][0]['title']['native'] || 'null'}
</div>
<div class="english">英文名:${oneAnswer && oneAnswer['data'] && oneAnswer['data']['Page'] &&
oneAnswer['data']['Page']['media'] && oneAnswer['data']['Page']['media'][0] &&
oneAnswer['data']['Page']['media'][0]['title'] &&
oneAnswer['data']['Page']['media'][0]['title']['english'] || 'null'}
</div>
<div class="romaji">罗马音:${oneAnswer && oneAnswer['data'] && oneAnswer['data']['Page'] &&
oneAnswer['data']['Page']['media'] && oneAnswer['data']['Page']['media'][0] &&
oneAnswer['data']['Page']['media'][0]['title'] &&
oneAnswer['data']['Page']['media'][0]['title']['romaji'] || 'null'}
</div>
</div>
<div class="jumplink">
<a target="_blank" href="${oneAnswer && oneAnswer['data'] && oneAnswer['data']['Page'] &&
oneAnswer['data']['Page']['media'] && oneAnswer['data']['Page']['media'][0] &&
'https://anilist.co/anime/' + oneAnswer['data']['Page']['media'][0]['id'] || '#'}">详情
</a>
</div>
<div class="info">
<div class="episodes">集数:${oneAnswer && oneAnswer['data'] && oneAnswer['data']['Page'] &&
oneAnswer['data']['Page']['media'] && oneAnswer['data']['Page']['media'][0] &&
oneAnswer['data']['Page']['media'][0]['episodes'] || 'null'}
</div>
<div class="seasonInt">季度:${oneAnswer && oneAnswer['data'] && oneAnswer['data']['Page'] &&
oneAnswer['data']['Page']['media'] && oneAnswer['data']['Page']['media'][0] &&
oneAnswer['data']['Page']['media'][0]['seasonInt'] || 'null'}
</div>
</div>
</div>
<div class="answer-box">
<div class="cover-img">
<img class="coverImage" src="${twoAnswer && twoAnswer['data'] && twoAnswer['data']['Page'] &&
twoAnswer['data']['Page']['media'] && twoAnswer['data']['Page']['media'][0] &&
twoAnswer['data']['Page']['media'][0]['coverImage'] &&
twoAnswer['data']['Page']['media'][0]['coverImage']['extraLarge'] || 'null'}" alt="">
</div>
<div class="title">
<div class="native">原名:${twoAnswer && twoAnswer['data'] && twoAnswer['data']['Page'] &&
twoAnswer['data']['Page']['media'] && twoAnswer['data']['Page']['media'][0] &&
twoAnswer['data']['Page']['media'][0]['title'] &&
twoAnswer['data']['Page']['media'][0]['title']['native'] || 'null'}
</div>
<div class="english">英文名:${twoAnswer && twoAnswer['data'] && twoAnswer['data']['Page'] &&
twoAnswer['data']['Page']['media'] && twoAnswer['data']['Page']['media'][0] &&
twoAnswer['data']['Page']['media'][0]['title'] &&
twoAnswer['data']['Page']['media'][0]['title']['english'] || 'null'}
</div>
<div class="romaji">罗马音:${twoAnswer && twoAnswer['data'] && twoAnswer['data']['Page'] &&
twoAnswer['data']['Page']['media'] && twoAnswer['data']['Page']['media'][0] &&
twoAnswer['data']['Page']['media'][0]['title'] &&
twoAnswer['data']['Page']['media'][0]['title']['romaji'] || 'null'}
</div>
</div>
<div class="jumplink">
<a target="_blank" href="${twoAnswer && twoAnswer['data'] && twoAnswer['data']['Page'] &&
twoAnswer['data']['Page']['media'] && twoAnswer['data']['Page']['media'][0] &&
'https://anilist.co/anime/' + twoAnswer['data']['Page']['media'][0]['id'] || '#'}">详情
</a>
</div>
<div class="info">
<div class="episodes">集数:${twoAnswer && twoAnswer['data'] && twoAnswer['data']['Page'] &&
twoAnswer['data']['Page']['media'] && twoAnswer['data']['Page']['media'][0] &&
twoAnswer['data']['Page']['media'][0]['episodes'] || 'null'}
</div>
<div class="seasonInt">季度:${twoAnswer && twoAnswer['data'] && twoAnswer['data']['Page'] &&
twoAnswer['data']['Page']['media'] && twoAnswer['data']['Page']['media'][0] &&
twoAnswer['data']['Page']['media'][0]['seasonInt'] || 'null'}
</div>
</div>
</div>
<div class="answer-box">
<div class="cover-img">
<img class="coverImage" src="${threeAnswer && threeAnswer['data'] && threeAnswer['data']['Page'] &&
threeAnswer['data']['Page']['media'] && threeAnswer['data']['Page']['media'][0] &&
threeAnswer['data']['Page']['media'][0]['coverImage'] &&
threeAnswer['data']['Page']['media'][0]['coverImage']['extraLarge'] || 'null'}" alt="">
</div>
<div class="title">
<div class="native">原名:${threeAnswer && threeAnswer['data'] && threeAnswer['data']['Page'] &&
threeAnswer['data']['Page']['media'] && threeAnswer['data']['Page']['media'][0] &&
threeAnswer['data']['Page']['media'][0]['title'] &&
threeAnswer['data']['Page']['media'][0]['title']['native'] || 'null'}
</div>
<div class="english">英文名:${threeAnswer && threeAnswer['data'] && threeAnswer['data']['Page'] &&
threeAnswer['data']['Page']['media'] && threeAnswer['data']['Page']['media'][0] &&
threeAnswer['data']['Page']['media'][0]['title'] &&
threeAnswer['data']['Page']['media'][0]['title']['english'] || 'null'}
</div>
<div class="romaji">罗马音:${threeAnswer && threeAnswer['data'] && threeAnswer['data']['Page'] &&
threeAnswer['data']['Page']['media'] && threeAnswer['data']['Page']['media'][0] &&
threeAnswer['data']['Page']['media'][0]['title'] &&
threeAnswer['data']['Page']['media'][0]['title']['romaji'] || 'null'}
</div>
</div>
<div class="jumplink">
<a target="_blank" href="${threeAnswer && threeAnswer['data'] && threeAnswer['data']['Page'] &&
threeAnswer['data']['Page']['media'] && threeAnswer['data']['Page']['media'][0] &&
'https://anilist.co/anime/' + threeAnswer['data']['Page']['media'][0]['id'] || '#'}">详情
</a>
</div>
<div class="info">
<div class="episodes">集数:${threeAnswer && threeAnswer['data'] && threeAnswer['data']['Page'] &&
threeAnswer['data']['Page']['media'] && threeAnswer['data']['Page']['media'][0] &&
threeAnswer['data']['Page']['media'][0]['episodes'] || 'null'}
</div>
<div class="seasonInt">季度:${threeAnswer && threeAnswer['data'] && threeAnswer['data']['Page'] &&
threeAnswer['data']['Page']['media'] && threeAnswer['data']['Page']['media'][0] &&
threeAnswer['data']['Page']['media'][0]['seasonInt'] || 'null'}
</div>
</div>
</div>
<div class="answer-box">
<div class="cover-img">
<img class="coverImage" src="${fourAnswer && fourAnswer['data'] && fourAnswer['data']['Page'] &&
fourAnswer['data']['Page']['media'] && fourAnswer['data']['Page']['media'][0] &&
fourAnswer['data']['Page']['media'][0]['coverImage'] &&
fourAnswer['data']['Page']['media'][0]['coverImage']['extraLarge'] || 'null'}" alt="">
</div>
<div class="title">
<div class="native">原名:${fourAnswer && fourAnswer['data'] && fourAnswer['data']['Page'] &&
fourAnswer['data']['Page']['media'] && fourAnswer['data']['Page']['media'][0] &&
fourAnswer['data']['Page']['media'][0]['title'] &&
fourAnswer['data']['Page']['media'][0]['title']['native'] || 'null'}
</div>
<div class="english">英文名:${fourAnswer && fourAnswer['data'] && fourAnswer['data']['Page'] &&
fourAnswer['data']['Page']['media'] && fourAnswer['data']['Page']['media'][0] &&
fourAnswer['data']['Page']['media'][0]['title'] &&
fourAnswer['data']['Page']['media'][0]['title']['english'] || 'null'}
</div>
<div class="romaji">罗马音:${fourAnswer && fourAnswer['data'] && fourAnswer['data']['Page'] &&
fourAnswer['data']['Page']['media'] && fourAnswer['data']['Page']['media'][0] &&
fourAnswer['data']['Page']['media'][0]['title'] &&
fourAnswer['data']['Page']['media'][0]['title']['romaji'] || 'null'}
</div>
</div>
<div class="jumplink">
<a target="_blank" href="${fourAnswer && fourAnswer['data'] && fourAnswer['data']['Page'] &&
fourAnswer['data']['Page']['media'] && fourAnswer['data']['Page']['media'][0] &&
'https://anilist.co/anime/' + fourAnswer['data']['Page']['media'][0]['id'] || '#'}">详情
</a>
</div>
<div class="info">
<div class="episodes">集数:${fourAnswer && fourAnswer['data'] && fourAnswer['data']['Page'] &&
fourAnswer['data']['Page']['media'] && fourAnswer['data']['Page']['media'][0] &&
fourAnswer['data']['Page']['media'][0]['episodes'] || 'null'}
</div>
<div class="seasonInt">季度:${fourAnswer && fourAnswer['data'] && fourAnswer['data']['Page'] &&
fourAnswer['data']['Page']['media'] && fourAnswer['data']['Page']['media'][0] &&
fourAnswer['data']['Page']['media'][0]['seasonInt'] || 'null'}
</div>
</div>
</div>
`;
document.getElementById('answer').innerHTML = '';
document.getElementById('answer').innerHTML = answer;
} catch (error) {
console.error('Error fetching anime:', error);
}
}
document.getElementById('qpStandingItemContainer').innerHTML += `<div id='searchbtn'>查找</div>`;
document.getElementById('gcMessageContainer').innerHTML += `<li><div id='answer'></div></li>`;
// 创建样式标签
var style = document.createElement('style');
// 添加自定义样式
style.appendChild(document.createTextNode(`
#answer .coverImage {
width: 50%;
}
#answer .info {
display: none;
}
.answer-box {
border: 2px #fff solid;
margin: 3px 0;
}
`));
// 将样式标签添加到页面头部
document.head.appendChild(style);
const searchbtn = document.getElementById('searchbtn');
searchbtn.addEventListener('click', reget);
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment