Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Визуальный редактор своими руками (https://javascript.ru/forum/misc/57112-vizualnyjj-redaktor-svoimi-rukami.html)

zhurchik 20.07.2015 11:49

Визуальный редактор своими руками
 
Всем привет.
Готовые решения не приемлю, хочу своё + опыт.

Прежде чем начать реализацию, хочу задать пару вопросов.

Реализовать редактор хочу при помощи contenteditable

Многие из вас знаю, что contenteditable ведет себя по разному в разных браузерах и даже одних и тех же браузерах, но разных версиях.
К примеру:
Переносы в хроме добавляются так <p><br></p> а в мозиле так <br> ну и разные другие особенности.

Что я хочу сделать, вот что:
Перехватывать нажатия символьных клавиш и полностью управлять вставкой символом и тегов, то-есть, отменять действия по умолчанию и полностью добавлять и удалять символы, теги и т.д.

Если подобное реализовать, будут ли тормоза при печатании или удалении символов (на средних компах)? У кого какой опыт в этом? Стоит ли вообще так делать или же это плохо?
И так ли реализованы популярные визуальные редакторы?

tsigel 20.07.2015 14:55

Цитата:

И так ли реализованы популярные визуальные редакторы?
Откройте пару, да посмотрите. Они почти все пользуют iframe

kostyanet 21.07.2015 08:07

Цитата:

Сообщение от zhurchik
Прежде чем начать реализацию, хочу задать пару вопросов.

Готовые решения все - гавно и вы лучше не сделаете. Чтобы сделать как в Ворде - надо написать еще один веб-Ворд. Боюсь там парой вопросов не обойдется.

zhurchik 21.07.2015 09:03

kostyanet,
Дело в том, что мне не нужен функционал Бога. Мне хватит того, чтобы можно было задавать текст жирным, курсивом и некоторыми цветами, но то для чего я все это затеял это картинки, которые я хочу вставлять прямо в редактор и свой мини плеер на HTML5 при загрузки песен, а еще добавление смайлов и прочая мелочь.

Функционал как в Ворде ни к чему.

А готовые решения тормозные, мне это не нравится, да и хрен их под себя переделаешь там столько кода, даже залезать не хочется туда. А свое решение всегда можно доделать, переделать и т.д. и это будет гораздо приятнее, удобнее и проще!

tsigel 21.07.2015 09:33

http://ckeditor.com/demo#widgets
Вот вам минимальный функционал. Можно вообще все кнопки убрать. Редактор - это очень много кода, и сложная задача. Я не думаю что у вас получится сделать что-то приличное с помощью "contenteditable".

zhurchik 21.07.2015 10:26

tsigel,
Я юзал и этот редактор и многие другие. Меня ни один из них не устраивает!

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

kostyanet 21.07.2015 11:45

Contenteditable не генерит никаких событий и никакие попытки навесить таковые не увенчаются, ибо это не научно.

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

Contenteditable вообще не для этого сделан, для чего вы хотите приспособить этот атрибут. Вот например у меня есть страница ценника товара - которая для печати на бумаге. На этой странице вообще никакого интерфейса быть не может, иначе он напечатается вместе с ней. Но бывает что цена товара в бд не актуальна, или там надо укоротить или дописать наименование или еще какие-то параметры - я делаю эти элементы contenteditable='true' и операто спокойно все правит и печатает. Без сохранения, конечно.

Кстати, надо проверить еще - в файл изменения запишутся?

kostyanet 21.07.2015 11:50

Проверил - так и есть, сохраняет изменения на диск. Вот и ответ для чего редактируемый контент.

zhurchik 21.07.2015 12:49

kostyanet,
А какие вам еще события нужны? Чем вас не устраивают keypress, keydown и прочие? А управлять содержимым и т.д. можно через range и selection объекты. Что из этого вас смущает?

kostyanet 22.07.2015 06:31

Это они вам нужны, мне-то нахрен. Вы все равно нифига не поняли и поймете только когда начнете мастырить свой лисапед. Вот и начинайте.


Часовой пояс GMT +3, время: 11:31.