emoji-picker
emoji-picker copied to clipboard
Initialize with multiline text
Hi. Steps to reproduse:
- Create new emojiarea for new post/comment/etc
- Enter multiline text -> it would be with linebreaks
- Create emojiarea for editing this post/comment/etc -> all new lines will be ignored.
EmojiPicker.prototype.appendUnicodeAsImageToElement generates content for contenteditable block, but it ignores new line separators and don't allow to pass already prepared (with <div> or <br>) content becouse of val = document.createTextNode(text);
Is there any way to initialize emojipicker on existed multiline text?
I can suggest such solution. Create buffer textWithImages
variable, don't use document.createTextNode
and use regexp to replace new lines with <div> (I use <div> because editor by default use it for new lines)
split_on_unicode = input.split(Config.rx_codes)
textWithImages = ''
for text in split_on_unicode
val = ''
if Config.rx_codes.test(text)
val = Config.reversemap[text]
if val
val = ':' + val + ':'
val = $.emojiarea.createIcon($.emojiarea.icons[val])
else
val = text
textWithImages += '' + val;
textWithImages += '\n';
textWithImages = textWithImages.replace(/\n+$/g, '\n')
textWithImages = textWithImages.replace(/(.*)\n/g, '<div>$1</div>')
element.append(textWithImages);
add this css to fix:
.emoji-wysiwyg-editor{ white-space: pre-wrap; }
👍