diy / jquery-emojiarea Goto Github PK

Can i add two or more emojis textboxes in the same page ?

I am not sure how this plug in works honestly, but lets say you have <textarea>value</textarea>

if you set value to be <script>alert("test");</script> which is a script code but encoded to prevent js injection, then it gets transformed and excecuted, this one just alerts test.

I have made a fiddle as proof https://jsfiddle.net/1tkpcjbq/

I want popup bottom 0. But is default is top:0 can i change this ?

When running JQuery's val() function on a emojiarea, the div is not affected. For example, $("textarea").val(''); does not clear the div.

A workaround can be used: $(".emoji-wysiwyg-editor").html('');

This thingy doesn't work with IE8.
You can't pick any emoji what so ever. There is no "emoji" text to select emojis.

Screenshot attached

If you have the same image for many smiley (i. e. ':)' and ':-)'), emoji-menu has duplicate entries.

To avoid this, I changed your code.
Here if you want to integrate this feature:

        var filenames = [];
        for (var key in options) {
            if (options.hasOwnProperty(key)) {
                var filename = options[key];
                var alreadyExists = ($.inArray(filename, filenames) > -1);
                if (!alreadyExists) {
                    filenames.push(filename);
                    html.push('<a href="javascript:void(0)" title="' + util.htmlEntities(key) + '">' + EmojiArea.createIcon(key) + '<span class="label">' + util.htmlEntities(key) + '</span></a>');
                }
            }
        }

I want that the user writes in the textarea and if he write a smiley that the plugin render it live in the textarea, anyway to do this? (Maybe he write :-) and the smiley cooming..)

I have a field that I would like to include only 1 emoji and that's it. However the current function appends the textarea/field. Is there an easy way to overwrite the field with only the new value?

Focusing on a textarea that has been converted to emojiarea does not work:

$("#my-textarea").focus();

Hi,

the value of the textarea placeholder attribute should be cloned to the div.emoji-wysiwyg-editor.

Regards
Philip

When using CTRL+CMD+SPACE on a mac to paste an emoji from the mac utilities the emoji will be shown as black outline character. Only clue how to solve this?

What am I getting wrong?

EmojiArea.createIcon = function (group, emojiName) { var filename = $.emojiarea.icons[group]['icons'][emojiName]; return '<img class="emoji emoji-" src="data-emoji:../../images/sprites/emoji.png"' + filename + '" alt="' + util.htmlEntities(emojiName) + '">'; };

@brianreavis

Hi there

I've used your lib in my project but had two issues. HTML was not escaped (content was cut on first HTML tag as it was rendered by the browser) and the new lines were not preserved.
Here is my solution - maybe you would like to introduce this fix in the main repo:

In EmojiArea_WYSIWYG function I've changed
var html = this.$editor.text();
to
var html = this.$editor.html();
to preserve content when sharp parenthesis are used (mostly HTML).

Now, as we switch here from <textarea> to content editable <div>, new lines must be presented in HTML to be saved, hence additional line just under the previous one:
html = html.replace(/\n/g, '<br>');

Hope it helps.
Cheers

hi, recently we want to add your lib on https://cdnjs.com, but we need a version number for each lib, can we regard this lib as version 1.0.0 ? or do you have any idea?
thank you very much!

cdnjs/cdnjs#6159

this script creates contenteditable div inside the page and when the user still editing this layer and press space key the page scrolling down!
I use this
$(document).on("keypress", function(e) { var $focusElem = $(":focus"); if(e.which == 32 && ($focusElem.is("input") || $focusElem.attr("contenteditable") == "true")){ e.preventDefault(); } });

but the page still scrolling down!

Is it possible to have a space inserted right after the emoji has been added?

Thanks

allow to readonly textarea

Thanks for plugin. How i can download jQuery emojiarea plugin with bower package manager.

I downloaded this plugin and noticed three things:

1. It doesn't contain all icons (I fixed that by downloading JQuery Emoji and writing a short php script to generate that [if you like it just tell me])
2. There is a small error in the CSS which prevents scrolling in the icon list, add this at the end of the jquery.emojiarea.css

.emoji-menu div {
overflow-x: hidden;
overflow-y: auto;   
}

1. And I have a question: Can I split up the icons into sections like this
   

I quite like this plugin in, nice job 😉

Hi,

Can .emoji-wysiwyg-editor turn readonly?

Thanks,
Yair

Is there a way to render emoji as you type? So when you type 😄 , the contenteditable div will rerender the text into smile emoji?