Change stuff on Anilist.co
// ==UserScript==
// @name Aniscripts
// @namespace http://tampermonkey.net/
// @version 0.15
// @description Change stuff on Anilist.co
// @author hoh
// @match https://anilist.co/*
// @grant none
// ==/UserScript==
(function(){
var activityCache = {};//reduce API calls
var handleResponse = function(response){
return response.json().then(function(json){
return response.ok ? json : Promise.reject(json);
});
};
var handleError = function(error){
//alert("Error, check console"); //fixme
console.error(error);
};
var url = 'https://graphql.anilist.co';
var listActivityCall = function(query,variables,callback,vars){
var handleData = function(data){
activityCache[variables.id] = data;
callback(data,vars);
};
var options = {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
},
body: JSON.stringify({
query: query,
variables: variables
})
};
if(activityCache.hasOwnProperty(variables.id)){
callback(activityCache[variables.id],vars);
}
else{
fetch(url,options).then(handleResponse).then(handleData).catch(handleError);
};
};
var enhanceNotifications = function(){
var perform = function(){
var notifications = document.getElementsByClassName("notification");
var activities = [];
for(var i=0;i<notifications.length;i++){
var active = {};
if(notifications[i].children[1].children[0].children[0].href != undefined && notifications[i].children[1].children[0].children[0].href.match(/[0-9]+/)){//could be "null" in some cases
active.link = notifications[i].children[1].children[0].children[0].href.match(/[0-9]+/)[0];
}
else{
active.link = "aaa"+i;
};
active.image = notifications[i].children[0].style.backgroundImage;
active.href = notifications[i].children[0].href;
activities.push(active);
};
for(var i=0;i<25;i++){//heavy
if(!activities.length){
break;
};
var imageCallBack = function(data,vars){
var type = data.data.Activity.type;
if(type == "ANIME_LIST" || type == "MANGA_LIST"){
var seriesImage = document.createElement("img");
seriesImage.alt = "";
seriesImage.src = data.data.Activity.media.coverImage.large;
seriesImage.style.height = "60px";
seriesImage.style.position = "absolute";
seriesImage.style.marginLeft = "500px";
notifications[vars.find].appendChild(seriesImage);
}
else if(type == "TEXT"){
var userImage = document.createElement("img");
userImage.alt = "";
userImage.src = data.data.Activity.user.avatar.large;
userImage.style.height = "60px";
userImage.style.width = "60px";
userImage.style.position = "absolute";
userImage.style.marginLeft = "500px";
notifications[vars.find].appendChild(userImage);
var commentText = document.createElement("span");
var container = document.createElement("div");
container.classList.add("details");
container.style.position = "absolute";
container.style.marginLeft = "580px";
container.style.marginTop = "18px";
commentText.innerHTML = "Status";
container.appendChild(commentText);
notifications[vars.find].appendChild(container);
};
};
var vars = {
find: i
};
var query = "query ($id: Int!) { Activity(id: $id) { ... on TextActivity { id userId type replyCount text createdAt user { id name avatar { large } } likes { id name avatar { large } } replies { id text createdAt user { id name avatar { large } } likes { id name avatar { large } } } } ... on ListActivity { id userId type status progress replyCount createdAt user { id name avatar { large } } media { coverImage { large } id title { userPreferred } } likes { id name avatar { large } } replies { id text createdAt user { id name avatar { large } } likes { id name avatar { large } } } } ... on MessageActivity { id type replyCount createdAt messenger { id name avatar { large } } likes { id name avatar { large } } replies { id text createdAt user { id name avatar { large } } likes { id name avatar { large } } } } } }";
if(activities[i].link[0] != "a"){
if(activities.length){
var variables = {
id: +activities[i].link
};
listActivityCall(query,variables,imageCallBack,vars);
};
};
};
var prevLink = "";
var prevCount = 0;
for(var i=0;i<activities.length;i++){
notifications[i].children[0].style.width = "60px";
notifications[i].children[0].style.height = "60px";
notifications[i].style.whiteSpace = "nowrap";
notifications[i].style.gridTemplateColumns = "repeat(5,60px)";
if(prevLink == activities[i].link){
var avatar = document.createElement("a");
avatar.classList.add("avatar");
avatar.style.backgroundImage = activities[i].image;
avatar.href = activities[i].href;
avatar.style.width = "60px";
avatar.style.height = "60px";
avatar.style.backgroundPosition = "50%";
avatar.style.backgroundRepeat = "no-repeat";
avatar.style.backgroundSize = "cover";
notifications[i-prevCount-1].insertBefore(avatar,notifications[i-prevCount-1].children[prevCount].nextSibling);
//notifications[i-prevCount-1].insertBefore(avatar,notifications[i-prevCount-1].childNodes[2]);
//notifications[i-prevCount-1].appendChild(avatar);
notifications[i].style.display = "none";
prevCount++;
if(prevCount == 5){//x-2
//var breakPoint = document.createElement("br");
//notifications[i-prevCount].insertBefore(breakPoint,notifications[i-prevCount].children[prevCount].nextSibling);
//prevCount = 0;
//prevLink = "no more stacking";
};
}
else{
prevLink = activities[i].link;
prevCount = 0;
};
/*var idSpan = document.createElement("span");
idSpan.innerHTML = activities[i].link;
notifications[i].children[1].children[0].appendChild(idSpan);*/
};
return notifications.length;
};
var tryAgain = function(){
setTimeout(function(){if(perform()==0){tryAgain()}},100);
};
if(perform() == 0){
tryAgain();
};
};
var handleScripts = function(url){
if(url == "https://anilist.co/notifications"){
enhanceNotifications();
};
//alert(url);
};
var current = "";
setInterval(function(){
if(document.URL != current){
current = document.URL;
handleScripts(current);
};
},200);
console.log("Aniscripts initiated");
})();