Raw Source Toggle Dropdown

• Minified Source

Dedonych / Shiki Messages Info

// ==UserScript==
// @name         Shiki Messages Info
// @namespace    http://tampermonkey.net/
// @version      0.4
// @description  try to take over the world!
// @author       You
// @match        http://*
// @match        https://*
// @include      /https?:\/\/(www\.)?shiki(mori)?\.([a-z]+?)\/.*/
// @icon         https://www.google.com/s2/favicons?sz=64&domain=shikimori.one
// @require      https://gist.githubusercontent.com/Chortowod/814b010c68fc97e5f900df47bf79059c/raw/chtw_settings.js
// @grant        none
// @license      MIT
// @copyright    2023, Dedonych (https://openuserjs.org/users/Dedonych)
// @updateURL    https://openuserjs.org/meta/Dedonych/Shiki_Messages_Info.meta.js
// @downloadURL  https://openuserjs.org/install/Dedonych/Shiki_Messages_Info.user.js
// ==/UserScript==

let settings = new ChtwSettings('messageInfo','Кнопки сообщение')
function initSettings(){
    if(!(/\/edit\/misc/).test(location.pathname))return
    settings.createOption("bgClr","Цвет Фона","#00000040","color");
    document.getElementById("chtwScriptmessageInfobgClr").oninput = function(e){
    document.getElementById("messageIcons").style.background = e.currentTarget.value}

}

function createMessage(id,name){
    const style = `
    #messageIcons::-webkit-scrollbar {
        display:none
    }
    `
    settings.addStyle(style)
    const imgURL = `https://nyaa.shikimori.one/system/users/x48/${id}.png`
    const message = document.createElement("a")
    message.href = `https://shikimori.one/${document.querySelector(".nickname").innerText}/dialogs/${name}`
    message.className = 'msgIcons'
    message.title = name
    message.style.cssText = `display:block;background:url(${imgURL}) no-repeat;background-size:cover;width:32px;height:32px;border-radius:100%;margin-top:8px;`
    var main = document.getElementById("messageIcons");
    const mail = document.querySelector(".menu-icon.mail")
    if(!main){
        main = document.createElement("div")
        main.id = 'messageIcons'
        main.style.cssText = `
        position:fixed;
        top:${mail.offsetTop+mail.offsetHeight}px;
        left:${mail.offsetLeft+mail.offsetParent.offsetLeft}px;
        min-width:48px;
        min-height:48px;
        max-height:128px;
        scrollbar-width: none;
        overflow-y: scroll;
        z-index:12344;
        display:none;
        justify-content:center;
        border-radius: 0 0 32px 32px;
        background:${settings.getOption('bgClr')};
        padding-bottom:8px;`
        mail.append(main)
         mail.addEventListener("click",(e)=>{e.stopPropagation()})
    }
    main.append(message);
    mail.addEventListener("mouseover",()=>{main.style.display="grid"})
    mail.addEventListener("mouseout",()=>{main.style.display="none"})

}

async function started(){
    if(!document.querySelector(".menu-icon.mail")||
       document.getElementById("messageIcons")||
       location.pathname.includes("dialogs"))return;
    const res = await fetch('https://shikimori.one/api/dialogs').then(r=>r.json()).then(d=>{
        for(let e of d){
            if(!e.message.read){
                createMessage(e.target_user.id,e.target_user.nickname)
            }
        }
    })
}

ready(initSettings)
ready(started)