Pastebin: ニコニコの動画サムネイルにチャンネルのアイコンをトッピングする.user.js

Format

JavaScript

Post date

2020-06-01 22:42

Publication Period

Unlimited

 // ==UserScript==
 // @name     channel_icon_over_thumbnail
 // @version  1
 // @grant    GM.xmlHttpRequest
 // @include  https://www.nicovideo.jp/*
 // @run-at   document-start
 // ==/UserScript==
 
 // Copyright waived using CC0 1.0 Universal, 2020 dyknon
 
 function do_job(thumbnail){
   let link = thumbnail.parentNode;
   while(link && link.tagName != "A"){
     link = link.parentNode;
   }
   if(!link || link.host != "www.nicovideo.jp"){
     return;
   }
   let match = /^\/watch\/(([a-z]{2})[0-9]+)/.exec(link.pathname);
   if(!match || match[2] == "sm"){
     return;
   }
   let video_id = match[1];
   GM.xmlHttpRequest({
     method: "GET",
     url: "http://ext.nicovideo.jp/api/getthumbinfo/" + video_id,
     onload: res => {
       if(res.status != 200){
         return;
       }
         let p = new DOMParser();
       let doc = p.parseFromString(res.responseText, "application/xml");
       let iconurl_e = doc.querySelector(":root > thumb > ch_icon_url");
       if(!iconurl_e){
         return;
       }
       let channel_name_e = doc.querySelector(":root > thumb > ch_name");
       let icon_img = document.createElement("img");
       icon_img.style.position = "absolute";
       icon_img.style.right = "0";
       icon_img.style.top = "0";
       icon_img.style.width = "20%";
       icon_img.src = iconurl_e.textContent;
       if(channel_name_e){
         icon_img.alt = channel_name_e.textContent;
       }
       thumbnail.appendChild(icon_img);
     }
   });
 }
 
 function test_and_do_job(el){
   if(el.tagName != "DIV"){
     return;
   }
   let cl = el.classList;
   if(cl.contains("Thumbnail")){
     do_job(el);
   }
 }
 
 for(let thumbnail of document.querySelectorAll("div.Thumbnail")){
   do_job(thumbnail);
 }
 
 new MutationObserver((mu, obs)=>{
   for(let mr of mu){
     if(mr.type == "attributes"){
       test_and_do_job(mr.target);
     }else if(mr.type == "childList"){
       for(let el of mr.addedNodes){
         test_and_do_job(el);
         for(let thumbnail of el.querySelectorAll("div.Thumbnail")){
           do_job(thumbnail);
         }
       }
     }
   }
 }).observe(document, {childList: true, subtree: true, attributes: true, attributeFilter: ["class"]});