Here's a JS challenge for you

So Geek Girl was kind enough to provide some emoticons (aka emotions in older versions) that my members really liked. Since 'emotions' don't exist anymore caused it's be renamed to emoticons, and my members want those damn things back, I painstakingly added them to the plugin.min.js file manually.

I'm running into a bit of a problem though, I want to set the height and width of the table that is displayed and since there are 118 smileys I added, I want to add scroll bars instead of all of them displaying at one time.I cant figure it out in the plugin.min.js file.

Suggestions?

Is it emoticons in old TinyMCE v.3.x ?

Umm, I can say it that in 7.1.6:

- The TinyMCE folder was labeled as tiny_mce in plugins. Its now just tinymce in 7.2.1

- In plugins/tiny_mce/plugins it was labeled as 'emotions'. Its now called 'emoticons'

So to answer your question, No. It was emotions.

This is something I have yet to look at.  I will need to look at setting up the inits for TinyMCE 4 as well as my emoticons that I had done in TinyMCE 3.x.  The plugins for TinyMCE 4 are handled a bit different.  Emotions; emoticons; different names but same thing. 

Looking at TinyMCE 4 over at tinymce.com; the emtions/emoticons are held in a table that pops up when clicking the icon. 

<table class="mce-grid" role="list">

I hope that helps.

<table class="mce-grid" role="list">

It does and I have been staring a hole through it trying to determine how to may that 'grid' a fixed size and have scroll bars if that size is exceed.

We have the same problem.

Before, there was a emotions.html file to build table.

How to make now ?

I found emoji add-on here

https://github.com/boonex/dolphin.pro/tree/master/plugins/emoji-picker

Check if this can be useful for you. I have modified the JS file a bit, download the attached plugin.min.js file. Change the width and height values ( Line no #31, 32 )as per your need.

tinymce.PluginManager.add("emoticons", function(a, b) {
    function c() {
        var a;
        return a = '<table role="list" class="mce-grid" style="padding: 10px">', tinymce.each(d, function(c) {
            a += "<tr>", tinymce.each(c, function(c) {
                var d = b + "/img/smiley-" + c + ".gif";
                a += '<td><a href="#" data-mce-url="' + d + '" data-mce-alt="' + c + '" tabindex="-1" role="option" aria-label="' + c + '"><img src="' + d + '" style="width: 18px; height: 18px" role="presentation" /></a></td>'
            }), a += "</tr>"
        }), a += "</table>"
    }
    var d = [
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
        ["cool", "cry", "embarassed", "foot-in-mouth", "frown", "innocent", "kiss", "laughing", "money-mouth", "sealed", "smile", "surprised"],
    ];

    a.addCommand('show_emoticons', function() {
        a.windowManager.open({
            title: "Emoticons",
            width : 300,
            height : 200,
            html: c(),
            onclick: function(b) {
                var c = a.dom.getParent(b.target, "a");
                c && (a.insertContent('<img src="' + c.getAttribute("data-mce-url") + '" alt="' + c.getAttribute("data-mce-alt") + '" />'), this.hide())
                return false;
            },
            inline : true,
            autoScroll: true,
            scrollbars:true,
            buttons:[],
        }, {
            plugin_url : b // Plugin absolute URL
        });
    });

    a.addButton('emoticons', {
        title : 'Emoticons',
        cmd : 'show_emoticons',
    });
});

Everything seems correct, but when we download the file, the icon of smileys disappears in toolbar.

Thanks per advance

 Try clearing cache and ctrl+f5