"TwitchPleb"

"Free Twitch.tv subscriber emotes"

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, Greasemonkey alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey alebo Userscripts.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie, ako napríklad Tampermonkey.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie správcu používateľských skriptov.

(Už mám správcu používateľských skriptov, nechajte ma ho nainštalovať!)

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

(Už mám správcu používateľských štýlov, nechajte ma ho nainštalovať!)

// ==UserScript==
// @name        "TwitchPleb"
// @namespace   "spacename"
// @description "Free Twitch.tv subscriber emotes"
// @include     https://www.twitch.tv/*
// @include     https://twitch.tv/*
// @exclde
// @version     1.0.2
// @noframes
// @grant       none
// ==/UserScript==

var emotes = new Map();

var clickEmoteButton = false;

var lastDataId = 0;
var lastDataSender;

var htmlEmoteTag0 = "<img class=\"emoticon ttv-emo-";
var htmlEmoteTag1 = "\" src=\"";
var htmlEmoteTag2 = "\" srcset=\"";
var htmlEmoteTag3 = " 2x\" data-id=\"";
var htmlEmoteTag4 = "\" alt=\"";
var htmlEmoteTag5 = "\" original-title=\"\">";

window.onload = function()
{	
	console.log("Starting script\n");
	window.setTimeout(LoadEmotes, 500);
}

function Emote(url, id)
{
	this.url = url;
	this.id = id;
}

function CleanHtmlChars(theChar)
{
	if(theChar === "<")
	{
		return "&lt;";
	}
	if(theChar === ">")
	{
		return "&gt;";
	}
	if(theChar === "&")
	{
		return "&amp;";
	}
	
	return theChar;
}

function Run()
{
	var messages = document.querySelectorAll("span.message");
	var chatLines = document.getElementsByClassName("chat-line");
	if(messages === undefined)
	{
		console.error("messages elements were not found");
		return;
	}
	
	var processMessages = lastDataSender === undefined ? true : false;
	for(var count=0; count < messages.length; count++)
	{
		if(messages[count] === undefined)
		{
			console.error("message is undefined. [count: " + count + 
				"] [messages.length: " + messages.length + "]");
			return;
		}
		if(processMessages)
		{
			//ignore deleted and system messages
			if(messages[count].getElementsByClassName("deleted")[0] || 
				chatLines[count].getAttribute("data-sender") == "jtv")
			{
				continue;
			}
			
			lastDataId = chatLines[count].getAttribute("data-id");
			lastDataSender = chatLines[count].getAttribute("data-sender");
			console.log("lastDataId:"+lastDataId+" lastDataSender:"+lastDataSender);
			
			var newInnerHTML = "";
			for(var childCount=0; childCount < messages[count].childNodes.length; childCount++)
			{
				var node = messages[count].childNodes[childCount];
				if(node.nodeName === "#text")
				{
					var substr = "";
					for(var charCount=0; charCount < node.data.length; charCount++)
					{
						var currentChar = CleanHtmlChars(node.data.charAt(charCount));
						if(currentChar === undefined)
							console.log("currentChar is undefined");
						if(currentChar !== " ")
						{
							substr += currentChar;
						}
						if(currentChar === " " || node.data.length-1===charCount)
						{
							var emote = emotes.get(substr);
							var space = currentChar === " " ? " " : "";
							if(emote !== undefined)
							{
								newInnerHTML += htmlEmoteTag0+emote.id+htmlEmoteTag1+emote.url+
									"1.0"+htmlEmoteTag2+emote.url+"2.0"+htmlEmoteTag3+emote.id+
									htmlEmoteTag4+substr+htmlEmoteTag5+space;
							}
							else
							{

								newInnerHTML += substr+space;
							}
							substr = "";
						}
					}
				}
				else
				{
					newInnerHTML += node.outerHTML;
				}
			}
			console.log(newInnerHTML);
			messages[count].innerHTML = newInnerHTML;
		}
		else if(chatLines[count].getAttribute("data-id") == lastDataId && 
			chatLines[count].getAttribute("data-sender") == lastDataSender)
		{
			processMessages = true;
		}
	}
}

function LoadEmotes()
{
	if(!clickEmoteButton)
	{
		document.getElementsByClassName("js-emoticon-toggle emoticon-selector-toggle")[0].click();
		clickEmoteButton = true;
	}
	if(!document.getElementsByClassName("emoticon-grid") || 
		document.getElementsByClassName("emoticon-grid").length === 0)
	{
		console.error("emoticon-grid was not found");
		window.setTimeout(LoadEmotes, 100);
		return;
	}
	console.log("Loading Emotes");
	
	var div = document.getElementsByClassName("emoticon-grid")[0];
	
	var emoticonGroup = div.getElementsByClassName("emoticon tooltip locked");
	
	for(var count=0; count < emoticonGroup.length; count++)
	{
		var emoteName = emoticonGroup[count].getAttribute("original-title");
		var css = emoticonGroup[count].style.cssText;
		
		var emoteUrl = emoticonGroup[count].style.cssText.substring(
			css.lastIndexOf("(")+1, css.lastIndexOf(")")-4).replace(/"/g, "");
		
		var startingIndex = emoteUrl.indexOf("v1/")+3;
		var emoteId = emoteUrl.substring(startingIndex, emoteUrl.indexOf("/", startingIndex));
		
		emotes.set(emoteName, new Emote(emoteUrl, emoteId));
		
		var emote = emotes.get(emoteName);
		
		console.log(emoteName +" [id: "+emote.id+"] [url: "+ emote.url +"]");
	}
	
	document.getElementsByClassName("js-emoticon-toggle emoticon-selector-toggle")[0].click();
	window.setInterval(Run, 250);
}