Skip to content

Instantly share code, notes, and snippets.

@gamefreak
Created September 4, 2016 16:26
Show Gist options
  • Save gamefreak/ab5970115dd82c5c0d819f649e239b7b to your computer and use it in GitHub Desktop.
Save gamefreak/ab5970115dd82c5c0d819f649e239b7b to your computer and use it in GitHub Desktop.
fix
var base_path = 'http://qdb.fimsquad.com/emotes/';
var xhr = new XMLHttpRequest;
xhr.open('GET', base_path + 'emotes.json');
xhr.onload = emotes_loaded;
xhr.send(null);
var emoteTable = {}
var emoteReplacements = [];
function emotes_loaded(event) {
emoteTable = JSON.parse(xhr.responseText);
var quotes = document.getElementsByClassName('quote_quote');
for (var i = 0; i < quotes.length; i++) {
scan_node(quotes[i]);
}
}
function scan_node(parent) {
var node = parent.firstChild;
while (node !== null) {
if (node.nodeType !== Node.TEXT_NODE) {
if (node.hasChildNodes()) {
scan_node(node); // recurse
}
node = node.nextSibling;
continue;
}
/* regex matches 4 styles of emotes
Emote pack standard (e.g. :vinylstare: :sun: ) :[\w\-?]+:
Smiley style (e.g. :) :-) :P) ) [:;]-?[\w()]
MSN? Style (e.g. (S) ) \([\w*{}?]\)
and this one DD:
//*/
var match = node.textContent.match(/:[\w\-?]+:|[:;]-?[\w()@*]|\([\w*{}?]\)|DD:/);
if (match) {
node.splitText(match.index); // split before
var text = node.nextSibling;
text.splitText(match[0].length); // split after
var wrapper = generate_emote(text.textContent);
parent.replaceChild(wrapper, text);
node = node.nextSibling; // now stepping on to the <img>
node = node.nextSibling; // now on the <span> (will move off at the end of the loop)
}
node = node.nextSibling;
}
}
function generate_emote(text) {
if (emoteReplacements.length > 1000) throw new Error(":vinylaaaa: SO MANY EMOTES");
if (!(text in emoteTable)) {
return document.createTextNode(text);
}
console.log('generating emote', text);
var emoteId = emoteReplacements.length;
var fragment = document.createDocumentFragment();
var emote = {
state: 'image',
image: document.createElement('img'),
text: document.createElement('span')
};
emoteReplacements.push(emote);
emote.image.src = base_path + emoteTable[text];
emote.image.classList.add('emote');
emote.image.dataset.emoteId = emoteId;
emote.image.title = text;
emote.image.alt = text;
fragment.appendChild(emote.image);
emote.text.textContent = text;
emote.text.style.display = 'none';
emote.text.classList.add('emote');
emote.text.dataset.emoteId = emoteId;
fragment.appendChild(emote.text);
return fragment;
}
document.addEventListener('DOMContentLoaded', function() {
document.body.addEventListener('click', function(event) {
if (event.target.classList.contains('emote')) {
var emote = emoteReplacements[event.target.dataset.emoteId];
if (emote.state === 'image') {
emote.state = 'text';
emote.image.style.display = 'none';
emote.text.style.display = '';
} else {
emote.state = 'image';
emote.image.style.display = '';
emote.text.style.display = 'none';
}
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment