Raw Source Toggle Dropdown

• Minified Source

Romanito / RSI Emoji

// ==UserScript==
// @name         RSI Emoji
// @namespace    http://romanito.com/gmscripts
// @version      1.0
// @description  Add emoji to your forum posts on RSI's website
// @author       Romanito
// @match        https://forums.robertsspaceindustries.com/*
// ==/UserScript==

var emoji = [
	'https://i.imgur.com/Z4L49ST.jpg',
	'https://i.imgur.com/uSwr7d3.jpg',
	'https://i.imgur.com/7JGHFWn.jpg',
	'https://i.imgur.com/I3sS2gb.jpg',
	'https://i.imgur.com/iL5ya6z.jpg',
	'https://i.imgur.com/OCQUbxM.jpg',
	'https://i.imgur.com/i03QZ8W.jpg',
	'https://i.imgur.com/2XcNMu8.jpg',
	'https://i.imgur.com/rBNrTSz.jpg',
	'https://i.imgur.com/UAsZUnd.jpg',
	'https://i.imgur.com/ylHIuWw.jpg',
	'https://i.imgur.com/bMHfwrL.jpg',
	'https://i.imgur.com/H1A0hFM.jpg',
	'https://i.imgur.com/WCB3n9X.jpg',
	'https://i.imgur.com/u6PNgSi.jpg',
	'https://i.imgur.com/uEC6s7D.jpg',
	'https://i.imgur.com/gaR8qwl.jpg',
	'https://i.imgur.com/JGIjgIF.jpg',
	'https://i.imgur.com/2HN6q0Q.jpg',
	'https://i.imgur.com/XxuW8V9.jpg',
	'https://i.imgur.com/hWHZKlB.jpg',
	'https://i.imgur.com/idWG6MK.jpg',
	'https://i.imgur.com/tIfjBxQ.jpg',
	'https://i.imgur.com/q8AzVRU.jpg',
	'https://i.imgur.com/n7GbLCi.jpg',
	'https://i.imgur.com/Dy6UNGB.jpg',
	'https://i.imgur.com/n40ybpf.jpg',
	'https://i.imgur.com/OH7FuBx.jpg',
	'https://i.imgur.com/cSaRBP6.jpg',
	'https://i.imgur.com/VseLI02.jpg',
	'https://i.imgur.com/DVKIbqb.jpg',
	'https://i.imgur.com/nLeDDiF.jpg',
	'https://i.imgur.com/qeZwT2T.jpg',
	'https://i.imgur.com/OB5XQ2H.jpg',
	'https://i.imgur.com/eBYUckt.jpg',
	'https://i.imgur.com/a2JhXWf.jpg',
	'https://i.imgur.com/NkG87gS.jpg',
	'https://i.imgur.com/NaczcBT.jpg',
	'https://i.imgur.com/Bi2177u.jpg',
	'https://i.imgur.com/1mYyuVm.jpg',
	'https://i.imgur.com/z6LGK1C.jpg',
	'https://i.imgur.com/W1FtMfj.jpg',
	'https://i.imgur.com/ytecDlf.jpg',
	'https://i.imgur.com/aI5XOEb.jpg',
	'https://i.imgur.com/XAP7RnP.jpg',
	'https://i.imgur.com/WpWeAEz.jpg',
	'https://i.imgur.com/spY5cs8.jpg',
	'https://i.imgur.com/Oz3ebtC.jpg',
	'https://i.imgur.com/5jiQxUK.jpg',
	'https://i.imgur.com/ExB4YX9.jpg',
	'https://i.imgur.com/EvkhSkl.jpg',
	'https://i.imgur.com/twbUHIy.jpg',
	'https://i.imgur.com/0NU2ZC2.jpg',
	'https://i.imgur.com/4l5o6UN.jpg',
	'https://i.imgur.com/2p3dwhd.jpg',
	'https://i.imgur.com/YapG7rj.jpg'
];

var panel, textarea,
    panelStyle = 'position: absolute; padding: 3px; border: 1px solid rgb(41, 81, 99); background-color: rgb(1, 41, 59); max-width: 300px';

function $(a) { return document.querySelector(a); }
function cE(tag, parent, innerHTML) {
    var e = document.createElement(tag);
    if (parent) parent.appendChild(e);
    if (innerHTML) e.innerHTML = innerHTML;
    return e;
}

function displayEmojiPanel(X, Y) {
    panel = cE('div', document.documentElement);
    panel.className = 'rsiemoji';
    for (var i=0; i<emoji.length; i++) {
        var img = cE('img', panel);
        img.src = emoji[i];
        img.className = 'rsiemoji';
        img.setAttribute('style', 'max-height: 50px; padding: 2px;');
    }
    panel.setAttribute('style', panelStyle);
    panel.style.top = Y + 'px';
    panel.style.left = X + 'px';
    document.addEventListener('click', documentOnClick);
}

function removeEmojiPanel() {
    if (panel) {
        document.documentElement.removeChild(panel);
        panel = null;
        document.removeEventListener('click', documentOnClick);
    }
}

function documentOnClick(e) {
    if (e.target && e.target.classList.contains('rsiemoji')) {
        textarea = $('#Form_Body');
        if (e.target.tagName == 'IMG' && textarea) {
            var imgCode = '<img src="' + e.target.src + '"/>',
                selStart = textarea.selectionStart + imgCode.length;
            textarea.setRangeText(imgCode);
            textarea.focus();
            textarea.setSelectionRange(selStart, selStart);
            removeEmojiPanel();        
        }    
    } else {
        removeEmojiPanel();
    }
}

var barWrap = $('.BarWrap');

if (barWrap) {
	var emojiButton = cE('span', barWrap);
	emojiButton.classList.add('ButtonWrap');
	emojiButton.classList.add('rsiemoji');
	emojiButton.style.backgroundImage = 'url(https://i.imgur.com/tJFsnWp.png)';
	emojiButton.addEventListener('click', function(e) {
		displayEmojiPanel(e.pageX, e.pageY);
	});
    cE('span', emojiButton, 'RSI emoji');
}