下载Twitch聊天区中的表情包
目前為
// ==UserScript==
// @name Get Twitch emojis
// @namespace http://tampermonkey.net/
// @version 0.1
// @description 下载Twitch聊天区中的表情包
// @author Lee-7723
// @match https://www.twitch.tv/*
// @exclude https://www.twitch.tv/
// @icon https://static.twitchcdn.net/assets/favicon-16-52e571ffea063af7a7f4.png
// @grant none
// ==/UserScript==
'use strict';
function sleep (time) {
return new Promise((resolve) => setTimeout(resolve, time));
}
var main;
var emoji_btn;
var all_emojis = new Array();
var emojis;
var load_status;
var img_srcset = new Array();
var img_alt = new Array();
get_emoji_after_button ()
async function get_emoji_after_button () {
await get_button()
//await get_emoji()
//console.log('loaded' + emoji_btn.getElementsByTagName('div')[0])
main = document.getElementsByTagName('body')[0];
emoji_btn.onclick = function(){output()}
}
//set_btn_click ()
//async function set_btn_click () {
// emoji_btn.getElementBysTagName('div')[0].onclick = "function(){alert('clicked')}"
// console.log('2nd' + emoji_btn)}
//}
async function get_button() {
'use strict';
for (var i = 0; !emoji_btn; i) {
await sleep(1000);
emoji_btn = document.querySelectorAll('button[data-a-target="emote-picker-button"]')[0];
//console.log(emoji_btn)
}
}
async function get_emoji() {
for (var i = 0; !emojis; i) {
console.log('starting to fetch emojis')
await sleep(1000);
all_emojis = document.getElementsByClassName('Layout-sc-nxg1ff-0 lmlxil');
if(all_emojis.length == 1) emojis = all_emojis[0];
else emojis = all_emojis[1]//.getElementsByTagName("img");
//for (var j = 0; j < emojis.length; j++){
// console.log(emojis[j].srcset)
//}
if (emojis) {
emojis = emojis.getElementsByTagName("img")
for (var j = 0; j < emojis.length; j++) {
if (j == 1) {
img_srcset[j-1] = emojis[j].srcset.replace(' 3.0x','').split(" 2.0x,")[1];
} else {
img_srcset[j-1] = emojis[j].srcset.replace(' 3.0x','').split(" 2.0x, ")[1];
}
img_alt[j-1] = emojis[j].alt;
//if (j != 0) console.log(img_alt[j-1])
}
//console.log(emojis)
}
}
}
async function output() {
await get_emoji();
var head;
if(all_emojis.length == 1) head = all_emojis[0].children[0];
else head = all_emojis[1].children[0];
console.log(head)
var log_button = document.createElement('div');
log_button.class = "Layout-sc-nxg1ff-0 jreOmo";
log_button.id = 'emoji_url_pop_box';
log_button.innerHTML = `<div class="Layout-sc-nxg1ff-0 emWtQg">
<div style="display: inherit;">
<button id='emoji_url_pop' class="ScCoreButton-sc-1qn4ixc-0 jGqsfG ScButtonIcon-sc-o7ndmn-0 fNzXyu">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentcolor">
<path d="M0 0h24v24H0V0z" fill="none"/><path d="M19 9h-4V3H9v6H5l7 7 7-7zm-8 2V5h2v6h1.17L12 13.17 9.83 11H11zm-6 7h14v2H5z"/></svg>
</svg>
</button>
</div>
</div>`;
if(!document.getElementById('emoji_url_pop'))head.insertBefore(log_button , head.children[1])
document.getElementById('emoji_url_pop').onclick=function(){pop_up()}
function pop_up () {
main.append(output_box)
}
var output_box = document.createElement("div")
output_box.style = `position: absolute;
top: 5rem; left: 5rem;
padding: 10px;
z-index: 9999;
height: 500px;
width: ${main.clientWidth*0.6}px;
background-color: var(--color-background-alt);
border-radius: 10px;
border: 1.6px solid var(--color-background-pill);
box-shadow: 4px 4px 10px #000a`;
output_box.id = "emoji_url_box";
var output_text = document.createElement("textarea")
output_text.style = `height: 400px; width: 100%; resize: none; padding: 12px; background-color: var(--color-background-input); color: var(--color-text-input);`;
output_text.id = "emoji_url_text";
var output_author = document.createElement("p")
output_author.style = `color: #888; margin-left: 10px; position: absolute`;
output_author.innerHTML = `script by Lee-7723`;
var output_close_btn = document.createElement("button")
output_close_btn.style = `left: ${output_box.style.width.replace('px','')-75}px; top: 8px; position: relative; height: 30px; width: 50px; text-align: center; white-space: nowrap; border-radius: 6px; color: var(--color-text-button-primary); background-color: var(--color-background-button-primary-default); font-weight: bold;`;
output_close_btn.onmouseover = function () {output_close_btn.style.backgroundColor = 'var(--color-background-button-primary-hover)';}
output_close_btn.onmouseleave = function () {output_close_btn.style.backgroundColor = 'var(--color-background-button-primary-default)';}
output_close_btn.id = "emoji_url_close_btn";
//console.log(output_box.style.width.replace('px',''), output_box.style.height)
output_close_btn.onclick = function () {close_emoji_box()};
output_close_btn.appendChild(document.createTextNode('关闭'))
var usage = document.createElement("p")
usage.style = `text-color: #FFF; margin-bottom: 10px; margin-left: 10px; font-weight: bold;`;
usage.appendChild(document.createTextNode('将下面文本框中内容 全选->复制,粘贴到emoji.txt中'))
usage.id = "function_readme";
for (var i = 0; i < img_srcset.length; i++) {
output_text.appendChild(document.createTextNode(img_alt[i] + ' ' + img_srcset[i] + '\n'))
}
output_box.append(usage)
output_box.append(output_text)
output_box.append(output_author)
output_box.append(output_close_btn)
//main.append(output_box)
}
function close_emoji_box() {
document.getElementById('emoji_url_box').remove()//document.getElementById('emoji_url_box')
document.getElementById('emoji_url_pop_box').remove()
}