highlight html editor

[PHPDev]

highlight html editor

Мне нужно сделать редактор с подцветкой синтаксиса, т.е. я ввожу какой-нибудь html код, а он сразу подсвечивается (как в обычных системных приложениях). По какому признаку подцвечивать - неважно, главное понять принцип. Потом нужно будет сделать напротив каждого тега <sometag> иконку с возможностью спрятать/развернуть контент внутри тега. Подскажите, пожалуйста, в каком направлении двигаться.

 

[bgm]

Поиск по форуму не пробовал? По сочетанию "подсветка синтаксиса"?


http://phpclub.ru/talk/showthread.p...E2%E5%F2%EA%E0+%F1%E8%ED%F2%E0%EA%F1%E8%F1%E0

 

[SelenIT]

Нужно использовать основу простейшего wysiwyg-а. Вот в этом подсветка уже реализована (правда, он IE-only). Принцип несложный - замена в innerHTML последовательностей &amp;lt;что-то&amp;gt; на <span class="стиль_раскраски">&amp;lt;что-то&amp;gt;</span> (с помощью регвыров).

 

[alexhemp]

SelenIT

Это сделано во многих редакторах - например в DevEdit тоже есть.

Другое дело - что подсветка там сделана один раз при переключении в режим "кода". А если делать подсветку каждый раз при изменении контента - то будет тормозить жутко.

Нужно что-то извращать, например подсвечивать только текущий элемент, но как-то это нужно сперва определять...

Перегрузка же текста вызовет "сбивание" позиции курсора.

 

[PHPDev]

bgmи что ты мне дал за линк? Никаких притензий, спасибо за ответ, но это скрипты которые подсвечивают переданный им текст, я про них и так знал. У меня проблема в !динамической! подсветке, С PHP вообще мало связано
Всем спасибо, буду разбираться :/

 

[bgm]

Нормальный линк.
У тебя два варианта: использовать исключительно javascript для разбора и анализа введённого текста, или использовать взаимодействие с серверной частью. Если первый вариант, то действительно c PHP никакой связи (посмотри как устроен FCKEditor.net - он подстветку делает на лету). Второй вариант - вот уже и PHP появился

 

[PHPDev]

Если кому-то надо, можно попробывать взять подобное решение отсюда:
http://helene.muze.nl/
А вообще вот что думают некоторые специалисты:

[01:13] <Yurik> это возможно? http://php.com.ua/forum/viewtopic.php?t=3333
[01:14] <tony2001> Yurik: теоретически? наверное, да. практически - бред
[01:16] <tony2001> Yurik: есть же tokenizer в PHP
[01:16] <Yurik> ну
[01:17] <Yurik> знаю что такое токенайзер, знаю что такое wysiwyg (как например spaw)
[01:17] <tony2001> вероятно, его аналог можно сделать и на js
[01:17] <tony2001> *вероятно*
[01:17] <Yurik> но какая между ними может быть связь
[01:18] <Yurik> если висивиг редактирует то что показывает
[01:18] <Yurik> а для подсветки - нужно редактировать одно (сорцы пхп) а показывать другое (сорцы пхп в формате хтмл с подсветкой)
[01:18] <tony2001> ему раскраска же нужна
[01:19] <tony2001> вот парсить код и раскрашивать
[01:19] <Yurik> ну так несоответствие же самого кода и хтмл представления кода
[01:20] <Yurik> тут что - обратную анти-подсветку после каждого нажатия клавишы делать?
[01:20] <tony2001> вот-вот
[01:22] <Yurik> tony2001: сделать подсветку на javascript вобще не проблема
[01:22] <Yurik> tony2001: тут речь именно _о редакторе_
[01:22] <tony2001> Yurik: дада. можно и землю перевернуть, только опоры нет
[01:23] <Yurik> типа пишешь, а оно на ходу красит
[01:23] <tony2001> думаю, и редактор можно сделать, только он будет работать на P4 как на ЕС

 

[crocodile2u]

Писать на JS такую штуку - это будет слишком тормозить. Вариант: показывать сорс с подсветкой по нажатию на кнопку.

 

[PHPDev]

можно еще каждые n (выбрать оптимальное) секунд посылать на сервер ajax запрос и обновлять код в поле.

-~{}~ 11.07.06 19:42:

Может кто-то сталкивался с данной проблемой? чтобы обновить содержимое используется слеующий код:
document.getElementById("my_iframe_id").contentWindow.document.body.innerHTML = "somecodehere";

В ИЕ курсор при этом отправляется в конец, а в FireFox в самое начало. Как сделать чтобы он оставался на своей позиции?

-~{}~ 12.07.06 14:47:

для ИЕ проблему решил так:
Код:
var rng = document.getElementById(pointer).document.selection.createRange();
var position = { left : rng.offsetLeft, top : rng.offsetTop};
AddContent(content)
rng.moveToPoint(position.left, position.top);
rng.select();


Может кто-то знает аналог для Мозиллы?

-~{}~ 12.07.06 14:59:

для ИЕ проблему решил так:
Код:
var rng = document.getElementById(pointer).document.selection.createRange();
var position = { left : rng.offsetLeft, top : rng.offsetTop};
AddContent(content)
rng.moveToPoint(position.left, position.top);
rng.select();


Может кто-то знает аналог для Мозиллы?

 

[senich]

Автор оригинала: PHPDev
Если кому-то надо, можно попробывать взять подобное решение отсюда:
http://helene.muze.nl/
А вообще вот что думают некоторые специалисты:

[01:13] <Yurik> это возможно? http://php.com.ua/forum/viewtopic.php?t=3333
[01:14] <tony2001> Yurik: теоретически? наверное, да. практически - бред
[01:16] <tony2001> Yurik: есть же tokenizer в PHP
[01:16] <Yurik> ну
[01:17] <Yurik> знаю что такое токенайзер, знаю что такое wysiwyg (как например spaw)
[01:17] <tony2001> вероятно, его аналог можно сделать и на js
[01:17] <tony2001> *вероятно*
[01:17] <Yurik> но какая между ними может быть связь
[01:18] <Yurik> если висивиг редактирует то что показывает
[01:18] <Yurik> а для подсветки - нужно редактировать одно (сорцы пхп) а показывать другое (сорцы пхп в формате хтмл с подсветкой)
[01:18] <tony2001> ему раскраска же нужна
[01:19] <tony2001> вот парсить код и раскрашивать
[01:19] <Yurik> ну так несоответствие же самого кода и хтмл представления кода
[01:20] <Yurik> тут что - обратную анти-подсветку после каждого нажатия клавишы делать?
[01:20] <tony2001> вот-вот
[01:22] <Yurik> tony2001: сделать подсветку на javascript вобще не проблема
[01:22] <Yurik> tony2001: тут речь именно _о редакторе_
[01:22] <tony2001> Yurik: дада. можно и землю перевернуть, только опоры нет
[01:23] <Yurik> типа пишешь, а оно на ходу красит
[01:23] <tony2001> думаю, и редактор можно сделать, только он будет работать на P4 как на ЕС

по поводу редактора http://tinymce.moxiecode.com/example_full.php?example=true

 

[PHPDev]

и зачем тут линк на tinyMCE?

 

[senich]

блин, протупил сорри, запарился. я в это диалоге чорт знает что прочитал.

 

[PHPDev]

Продолжаю делать редактор, может кто-то знает как можно поставить каретку в определенный div/span.
Например, у меня есть следующий html код:

тут какой-то текст <div id="result"></div> тут опять текст.

Пусть у меня сейчас курсор находится в конце строки. Каким образом можно сделать, чтобы он оказался между тегами <div></div>? Нужно определенный фокус задать, может что-то еще...