TinyMCE je uzasny aneb jak se s nim pracuje

Vcera v noci jsem se zase docela trapil. Jsem si usmyslel ze uz nebudu pouzivat zadny prvek z Ajax Control Toolkit, protoze to je vsechno dost zmatene a porad jsem musel bojovat se konflikty nazvu css trid s jinymi CSS Frameworky hlavne.

Zacal jsem tedy hledat novy html editor – bylo mi jedno zda bude pouze v JS nebo kombinaci .NET/JS. Ale chtel jsem se hlavne vyhnout TinyMCE – jednoduse proto ze jsem se zase obaval konfliktu s CSS tridami a nastavovanim.

Nejjednodussi a zaroven docela neotrely se mi zdal tento: WYSIHTML5. Tak jsem ho nastavil podle instrukci , jenze nejen ze to bylo stejne jako u jinych html editoru ktere jsem jiz mel, ale jeste jsem musel bojovat s absolutnim pozicovanim – CSS totiz bylo uzpusobene pouze na stranku WYSIHTML5 , a kdyz jsem dal html editor dolu a chtel jsem vlozit odkaz nebo obrazek, tak se mi dialog zobrazil nahore a dole to zase bylo pruhledne atd.

Proste nedodelek a jiz spatny navrh, a sam osobne se snazim absolutni pozicovani nikdy nevolit. Pak jsem si rekl ze nebudu spolehat na cizi reseni a napisu si neco vlastniho na miru.

Prvni co me napadlo co jsem nevedel bylo jak zjistit text ktery je oznacen v editoru. Na to jsem si nasel knihovnu jquery.wrapSelection.js, sice starsi ale jinou jsem nenasel a pak nastal prvni problem – nesnasim javascript a jeho netypovost.

Snazil jsem se napsat na 781 radku te knihovny TypeScript Definition, ale nevedel jsem jake tridy a hlavne typy jejich promennych a metod tam jsou a tak jsem to musel vzdat.

Tim skoncil muj sen o vlastnim HTML editoru. A protoze u ostatnich HTML editoru nebylo na webu ani ukazka ve vetsine pripadu, nebo me i ta ukazka odradila, sel jsem nakonec do TinyMCE a rozhodne nelituji.

Nezavislost na jQuery, nevidane funkce, libivy design, a tridy jsou oznacovany treba .mce-btn takze nehrozi konflikt s jinymi tridami – v mem pripade treba Metro UI CSS FW.

Konfigurace je taky jednoducha az to snad ani neni mozne:

V kodu jsou pripojene vsechny pluginy ktere se dodavaji ve standardnim zipu – nicmene na webu je seznam pluginu jeste rozsahlejsi.

A HTML kod je jeste jednodussi, primitivnejsi byt uz nemuze:

Uz jen ho napojit na ASP.NET a priste uz nic jineho:).

PS: jen samozrejme nejsou uplne potreba tyto pluginy: example,example_dependency,bbcode. bbcode je dokonce v mem pripade nezadouci, protoze pak vam tinymce vraci misto html kodu bbcode syntaxi.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.