Fórum Root.cz
Hlavní témata => Vývoj => Téma založeno: hknmtt 08. 07. 2025, 14:33:43
-
Mam na webstranke editor ktory parsuje markdown(vratane vlastnych elementov) cez lexer a doda mi tokeny, ktore ja nasledne renderujem vo Vue. Aktualne mam dva mody: github styl, kedy sa pouzivatel manualne prepina medzi editovanim a renderom, a celostrankovy mod, kde su dva stlpce - vstup na jednej strane a vedla je vyrenderovany vysledok.
Chcel by som pridat treti mod - WYSIWG, cez contenteditable. Teoreticky viem ako na to a ako to implementovat, avsak zaujimali by ma take veci, ako napriklad zistenie ak ma pouzivatel vyselektovany nejaky text, ako to spravne zachytit aby som potom vedel spravne rozdelit text, ako pracovat s poziciou kurzora a td.
Skratka ma zaujimaju take genericke rady, tipy a triky od niekoho, kto uz vlastny WYSIWYG implementoval.
-
Tak to jsem zvedav, zda dokazes ukocirovat treba situaci, kdy uzivatel vybere pulku nadpisu a pulku odstavce (uprostred slov, ne vedle mezery), a klikne na bold. Takova vec se v MD mozna ani neda reprezentovat..
-
Tak to jsem zvedav, zda dokazes ukocirovat treba situaci, kdy uzivatel vybere pulku nadpisu a pulku odstavce (uprostred slov, ne vedle mezery), a klikne na bold. Takova vec se v MD mozna ani neda reprezentovat..
A čo toto?
## nad**pis**
**te**xt
-
Tak to jsem zvedav, zda dokazes ukocirovat treba situaci, kdy uzivatel vybere pulku nadpisu a pulku odstavce (uprostred slov, ne vedle mezery), a klikne na bold. Takova vec se v MD mozna ani neda reprezentovat..
Povolené budou jen stavy, které dávají smysl. Dávno takový typ editorů schází, bohužel to asi průměrný uživatel neocení a proto vládnou nedodělky a průměrnost...
-
Implementoval jsem v praci vlastni WYSIWYG editor, potom co jsme jich nekolik zkusili pouzit. Ze zacatku to vypada jako relativne snadno ale pak to zabralo nekolik clovekomesicu. A tahle manipulace s oznacenym fragmentem a jeho konverze do bold, coz znamena rozsekani puvodniho stromu dala hodne zabrat.
Rucne se musi osetrit i takove veci jako zmacknuti Enteru.
Zkusil bych se podivat po existujicim editoru a jeho prizpusobeni.
-
Možná by šlo použít nějaký editor přes WebAssembly.
Třeba Rust má dobrou podporu WebAssembly a možná by šlo použít něco jako EasyMark (https://www.egui.rs/#easymarkeditor) editor v egui a přidat do toho WYSIWYG nebo najít existující WYSIWYG v Rustu.
-
Nejeden programátor si na WYSIWYG editoru vylámal zuby.
Já chtěl jen takovou blbost, jako udělat okolo proměnné obdélníček se spojnicí na boxík a pár dalších blbinek a najednou mi z toho bylo zle...
-
WYSIWYG nefunguje 100% správně ani ve Wordu nebo LibreOffice. Kromě problémů už vyjmenovaných jsou tam další nechutnosti jako např. pokračování ve psaní (Má to vzít nějaký formát z předchozího/okolního textu - automatizace? Nebo začít bez formátu - ruční práce? - to první bude fungovat jen z části, to druhé naštve uživatele že jim to nepomůže), nebo mazání v různých částech textu (který formát vymazat, který převzít z okolního textu a pod.). Takže určitě hodně štěstí.
-
Pridávam sa k tým, čo si na vlastnom wysiwyg vylámali zuby. Nebol a nie je to dobrý nápad. Je to nekonečne hlboká králičia nora. Začneš riešiť jednu vec, počas toho zistíš, že musíš riešiť ďalších 10 problémov, a každý z tých 10 problémov bude vyžadovať riešenie ďalších 10 problémov. Čistá psychiatria. Navyše, ľahko sa dostaneš do stavu, že budeš musieť používateľom diktovať, na akom zariadení a prehliadači ten editor majú používaťa a na akom nie.
-
Vdaka za informacie a skusenosti. V principe ten WYSIWYG az tak moc nepotrebujem, skor je to o tom ze niektori ludia markdown moc nemusia/nepoznaju, ale zase ovladaju HTML, ktore zase ja nepodporujem. Tak mi prislo, ze WYSIWYG je taka dobra stredna cesta. Ale zrejme nie teda.
-
Vdaka za informacie a skusenosti. V principe ten WYSIWYG az tak moc nepotrebujem, skor je to o tom ze niektori ludia markdown moc nemusia/nepoznaju, ale zase ovladaju HTML, ktore zase ja nepodporujem. Tak mi prislo, ze WYSIWYG je taka dobra stredna cesta. Ale zrejme nie teda.
Markdown je určen hlavně pro lidi, kteří se při psaní dokumentace chtějí soustředit na obsah a stylování přenechat stroji. Psaní HTML značek by je zbytečně rozptylovalo. Existují WYSIWYG editory, které to sice umí, ale zato jejich výstupní kód bývá příšerný. Právě Markdown měl být tou střední cestou s minimem potřebných značek.
Co třeba editor, který se používá zde na fóru? Ten je podle mne docela povedený.
-
Co třeba editor, který se používá zde na fóru? Ten je podle mne docela povedený.
To je bbcode. Je fajn, ale nekompatibilny s MD.
-
Co třeba editor, který se používá zde na fóru? Ten je podle mne docela povedený.
To je bbcode. Je fajn, ale nekompatibilny s MD.
To je takový problém ho modifikovat?
-
Co třeba editor, který se používá zde na fóru? Ten je podle mne docela povedený.
Ten editor tady je všechno, jen ne BFU friendly...
-
Co třeba editor, který se používá zde na fóru? Ten je podle mne docela povedený.
Ten editor tady je všechno, jen ne BFU friendly...
Však tady žádné BFU nemáme.
-
Co třeba editor, který se používá zde na fóru? Ten je podle mne docela povedený.
To je bbcode. Je fajn, ale nekompatibilny s MD.
To je takový problém ho modifikovat?
Sorry, to bola nespravna odpoved v ramci kontextu. Editor co tu je nie je ziaden wysiwyg a ako som pisal v povodnom prispevku, uz takyto editor pouzivam.
-
Nemyslím si, že vlastný editor je nerealizovateľný. Je rozdiel písať všeobecný editor a editor, ktorý je kompatibilný s Markdownom. Markdown značne obmedzuje to, čo sa dá vložiť a naformátovať a teda aj to, čo sa musí naprogramovať.
Mimochodom, jeden editor má Joplin. Neskúmal som ako je napísaný ani aká je tam licencia.
Všeobecné problémy editorov kompatibilných s Markdownom sú tu: https://joplinapp.org/help/apps/rich_text_editor/
-
content editable je velká bažina. Také se hlásím k těm, co v tom utopili desítky dnů práce a výsledek spíše kontroverzní.
Velký problém je třeba práce se schránkou, protože v ní jsou naprosté šílenosti, které musíš interpretovat, čistit, opravovat nebo se vykašlat kompletně na formátování, bohužel s contentEditable to vůbec nemáš pod kontrolou.
Další velký problém je chování jednotlivých prohlížečů a OS. ContentEditable totiž nemá žádné specifikace a pravidla, každý prohlížeč to dělá trochu jinak. Aktivita k nějaké standardizace běží už spoustu let https://w3c.github.io/editing/, ale už to roky nesleduji.
ContentEditable je pomsta MS budoucím generacím.
Mrkni třeba na https://github.com/basecamp/trix, celý render implementuje v js a jde naprosto skvěle přizpůsobit. Nebo https://prosemirror.net, který dokonce už markdown podporuje a také bez contentEditable, používám ho rád na projektech pro zadávání vstupu od uživatele nebo konfiguračních yamlů.
-
content editable je velká bažina. Také se hlásím k těm, co v tom utopili desítky dnů práce a výsledek spíše kontroverzní.
Velký problém je třeba práce se schránkou, protože v ní jsou naprosté šílenosti, které musíš interpretovat, čistit, opravovat nebo se vykašlat kompletně na formátování, bohužel s contentEditable to vůbec nemáš pod kontrolou.
Další velký problém je chování jednotlivých prohlížečů a OS. ContentEditable totiž nemá žádné specifikace a pravidla, každý prohlížeč to dělá trochu jinak. Aktivita k nějaké standardizace běží už spoustu let https://w3c.github.io/editing/, ale už to roky nesleduji.
ContentEditable je pomsta MS budoucím generacím.
Mrkni třeba na https://github.com/basecamp/trix, celý render implementuje v js a jde naprosto skvěle přizpůsobit. Nebo https://prosemirror.net, který dokonce už markdown podporuje, sice contentEditable, ale s hacky, používám ho rád na projektech pro zadávání vstupu od uživatele nebo konfiguračních yamlů.