Kolorowanie składni na bieżąco Opcje

[Capellini]

Nie wiem, czy umieściłem ten temat w dobrym dziale bo nie wiem, jakie technologie tu będzie najlepiej wykorzystać.

Chodzi mi o kolorowanie składni, ale przed kliknięciem przycisku "Wyślij". Po prostu w textarea. Jak najlepiej się za to zabrać? W zwykłym textarea nie ma raczej możliwości kolorowania tekstu więc to odpada. Dwie możliwości, jakie mi przyszły na razie na myśl to zrobienie "własnego textarea" np. w JavaScript, tylko że tutaj będzie potrzebne bardzo dużo pracy (będzie trzeba zaprogramowywać naciśnięcie każdego przyciskum, np. backspace) i wydaje mi się, że to trochę głupie rozwiązanie. Druga możliwość, która mi przyszła na myśl, to zrobienie tego jako aplet w Javie i wstawienie na stronę. Co o tym myślicie?

[Crozin]

Zobacz sobie na jakiej zasadzie działają okna edytorów WYSIWYG w JS. IMO na takiej zasadzie powinieneś to właśnie zrobić. Do tego mechanizm kolorowania składni - również w JS by działało to płynnie.

[marcio]

Lub zrobic Div'a pod Textarea gdzie ktos pisal by kod do tego napisac funkcje JS ktora bedzie na bierzaco przesylala kod z tego Textarea to div'a w ktorym potem wszystko przeparsujesz i wyswietlisz cos jak podglad postu z gotowym bbcode.

[Capellini]

Sorry, że odpowiadam tak późno...

Zobacz sobie na jakiej zasadzie działają okna edytorów WYSIWYG w JS. IMO na takiej zasadzie powinieneś to właśnie zrobić. Do tego mechanizm kolorowania składni - również w JS by działało to płynnie.

Poszukałem takich edytorów, ale trochę trudno jest przestudiować ich działanie

Lub zrobic Div'a pod Textarea gdzie ktos pisal by kod do tego napisac funkcje JS ktora bedzie na bierzaco przesylala kod z tego Textarea to div'a w ktorym potem wszystko przeparsujesz i wyswietlisz cos jak podglad postu z gotowym bbcode.

Nie wiem, czy dobrze zrozumiałem Twój pomysł, ale jeżeli tak, to chodzi mi o co innego - chciałbym, żeby kolorowanie składni nastąpiło natychmiast, a nie po naciśnięciu przycisku Podgląd.

Jedyny pomysł, jaki przychodzi mi do głowy, to po prostu zdarzenie onKeyPress i odpowiednio reagować na na przykład naciśnięcie przycisku A.

W jaki sposób działa wstawienie emotikonek na tym forum (chodzi o to, że jak kliknąłem na emotikonkę, to pojawiła ona się natychmiast w miejscu, gdzie piszę, jako obrazek, a nie na przykład znak dwukropka i zakończenia nawiasu)?

[Crozin]

marciowi chodziło o to by po wpisaniu czegokolwiek w textarea pod spodem dynamicznie wyświetlało się to jako zwykły tekst.

Co do zasady działania WYSIWYG: http://www.google.pl/search?hl=pl&q=js...+Google&lr= przeszukaj (ew. pod podobnymi frazami)

[Capellini]

Poszukałem trochę i jest wiele artykułów na temat jak napisać swój edytor WYSWIG, ale ja znalazłem chyba prostszy sposób. Znalazłem, że jeżeli wpiszemy w pasku adresu przeglądarki poniższy kod, to można edytować stronę.

Kod

javascript:document.body.contentEditable = 'true'; document.designMode='on'; void 0

Poszukałem więc info na temat contentEditable i stwierdziłem, że najprościej będzie w taki sposób:

1. Tworzymy diva o nazwie "RichEdit".
2. W body onload dajemy funkcję w której ustawiamy contentEditable naszego diva na true, np. w ten sposób:

Kod

var zm = document.getElementById("RichEdit");
zm.contentEditable = "true";

3. Naszemu divovi ustawiamy onKeyPress na funkcję kolorującą tekst znajdujący się w divie.

[erix]

Do tego mechanizm kolorowania składni - również w JS by działało to płynnie.

O ile pamiętam, to taka biblioteka nazywała się Chili (w jQuery).

[Capellini]

Pojawił się mały problem. Kiedy koloruje tekst w divie, to go zmieniam, a kiedy go zmieniam to kursor ustawia się zawsze na początku, a koloruję tekst za każdym razem, kiedy zostanie dopisana jakaś litera. Czy ktoś wie jak w JavaScript ustawić kursor w jakimś miejscu albo jak inaczej rozwiązać ten problem?