Greasy Fork is available in English.
핫식스
// ==UserScript==
// @name 유튜브 추첨기
// @namespace 핫식스 존나 맛있다
// @version 0.4
// @description 핫식스
// @author 핫식스
// @match https://www.youtube.com/live_chat*
// @icon https://www.google.com/s2/favicons?sz=64&domain=youtube.com
// @grant none
// @license MIT
// ==/UserScript==
(function () {
console.log("로딩중..."); //로딩
var userList = [];
//옵저버
var observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
var added = mutation.addedNodes[0];
if (added?.tagName == 'YT-LIVE-CHAT-TEXT-MESSAGE-RENDERER') {
var userData = {};
userData.img = added.querySelector("yt-img-shadow img").src;
userData.name = added.querySelector("yt-live-chat-author-chip").innerText;
if (
userList.filter((e) => e.img == userData.img && e.name == userData.name)
.length == 0
) {
userList.push(userData);
modal.querySelector('#rouletteParticipant ul').innerHTML += `<li style="display:flex;flex-direction:row;align-items:center" id="unSelected"><img src="${userData.img}">${userData.name}</li>`;
}
}
});
});
var config = {
childList: true,
};
//모달창
var modal = document.createElement('div');
document.querySelector('body').style = '100vh';
modal.style.cssText = 'width:100%;height:100%;background-color:white;top:0px;left:0px;position:absolute;display:none;font-size:15px;overflow-y:auto';
modal.innerHTML = `
<style>
#rouletteControl button{
color:black;
border:1px solid red;
}
</style>
<div id="rouletteControl" style="text-align:center">
<button id="gatherBtn">시작</button>
<button id="raffleBtn">추첨</button>
<button id="closeModal">닫기</button>
</div>
<div id="rouletteResult" style="display:flex;flex-direction:column;align-items:center">
<h2>당첨자</h2>
<span style="height:35px"></span>
</div>
<div id="rouletteParticipant" style="display:flex;flex-direction:column;align-items:center">
<h2>참가자</h2>
<ul style="list-style-type: none;padding-left:0;">
</ul>
</div>`;
var gatherBtn = modal.querySelector('#gatherBtn');
var raffleBtn = modal.querySelector('#raffleBtn');
var closeBtn = modal.querySelector('#closeModal');
gatherBtn.addEventListener("click", function () {
if (this.innerText == "시작") {
userList = [];
modal.querySelector('#rouletteParticipant ul').innerHTML = '';
modal.querySelector('#rouletteResult span').innerHTML = '';
var target = document.querySelectorAll("#items")[1];
observer.observe(target, config);
this.innerText = "중지";
raffleBtn.disabled = true;
} else {
observer.disconnect();
this.innerText = "시작";
raffleBtn.disabled = false;
}
});
raffleBtn.addEventListener("click", function () {
if (userList.length !== 0) {
var rand = Math.floor(Math.random() * userList.length);
var pre = -1;
modal.querySelector('#rouletteResult span').style.color = 'black';
raffleBtn.disabled = true;
if(userList.length == 1){
modal.querySelector('#rouletteResult span').style.color = 'red';
modal.querySelector('#rouletteResult span').innerHTML = `<div style="display:flex;flex-direction:row;align-items:center"><img src="${userList[rand].img}">${userList[rand].name}</div>`;
modal.querySelectorAll('li#unSelected')[rand].style.opacity = '30%';
modal.querySelectorAll('li#unSelected')[rand].setAttribute('id', 'selected');
userList.splice(rand, 1);
raffleBtn.disabled = false;
}
else{
for (i = 0; i < 20; i++) {
(function (x) {
setTimeout(function () {
var random = Math.floor(Math.random() * userList.length);
while (random == pre) {
random = Math.floor(Math.random() * userList.length);
}
pre=random;
modal.querySelector('#rouletteResult span').innerHTML = `<div style="display:flex;flex-direction:row;align-items:center"><img src="${userList[random].img}">${userList[random].name}</div>`;
}, 100 * x);
})(i);
}
setTimeout(function () {
modal.querySelector('#rouletteResult span').style.color = 'red';
modal.querySelector('#rouletteResult span').innerHTML = `<div style="display:flex;flex-direction:row;align-items:center"><img src="${userList[rand].img}">${userList[rand].name}</div>`;
modal.querySelectorAll('li#unSelected')[rand].style.opacity = '30%';
modal.querySelectorAll('li#unSelected')[rand].setAttribute('id', 'selected');
userList.splice(rand, 1);
raffleBtn.disabled = false;
}, 2000)
}
}
});
closeBtn.addEventListener("click", function () {
modal.style.display = 'none';
})
document.querySelector('body').appendChild(modal);
//모달창 열기
var toggle = document.createElement('button');
toggle.innerText = '추첨 열기';
toggle.addEventListener('click', function () {
modal.style.display = 'block'
});
document.querySelector("#primary-content").appendChild(toggle);
/*
document.querySelector("yt-live-chat-header-renderer").style.height = "200px";
document.querySelector("#primary-content").appendChild(roulette);
*/
console.log("로딩 완료");
})();