Как реализовать смайлики на сайте?

Question

[mynewvk]

Я вот решил добавить emoji на сайт, но не знаю как лучше. Первое что пришло в голову -- на сервере менять код смайлика на
<i class="emoji emoji-*"></i> и заносить в базу данных.

Вроде все было хорошо, но потом обнаружил ошибку: в поле разрешено вводить 255 символов, а после замены на смайлики, длина увеличивалась и MySQL резал лишние символы.

После этого появилась идея менять код смайлика на изображения после доставания текста из базы, но, думаю, что если будет много полей, будет великая нагрузка на сервер.

Можно ли JS использовать, чтобы заменять на смайлы? Или это непрактично?
Посоветуйте, как лучше это все организовать.

И еще вопрос: как отображать смайлики в Input или textarea?
Спасибо.

Answer 1

[Николай Васильчук]

менять код смайлика на изображения после доставания текста из базы, но думаю что если будет много полей, то будет великая нагрузка на сервер

Смотря как менять. Вообще, не должно быть нагрузки от обычной замены подстроки в строке.

можно ли JS использовать, чтобы заменять на смайлы?

Можно. Вполне практично.

Как отображать смайлики в Input или textarea?

Гуглите аттрибут contenteditable

Comments

[iDennis]

contenteditable не кроссбраузерен, правда вконтакте решил эту проблему swf, но лучшее решение от codemirror (только на телефонах не работает)

Answer 2

[iDennis]

я бы вобще сделал бы текст и отдельно json (информация о том где и какой смайл) , отправлял бы на сервер и то и другое, и на клиентах разбирал этот json для конкретного текста, и серверного скрипта не надо.

Answer 3

[Mandor]

После этого появилась идея менять код смайлика на изображения после доставания текста из базы, но, думаю, что если будет много полей, будет великая нагрузка на сервер.

Нормальная идея. Вообще, такие вещи нагрузку на сервер не создают. В реализации не используйте регулярки и ненужные циклы, обратите внимание на функцию strtr().

Можно ли JS использовать, чтобы заменять на смайлы? Или это непрактично?

Если отдаёте контент в виде HTML, то серверный вариант замены предпочтительнее.