Taylor-CCB-Group / MDV

GNU General Public License v3.0
8 stars 6 forks source link

Add Markdown option to Text box #37

Closed bioinfbloke closed 1 year ago

bioinfbloke commented 1 year ago

Could be wysiwig editor e.g. https://bl.ocks.org/lsbardel/29fe806656fc6b77df9239186e456ff2

xinaesthete commented 1 year ago

Technically, that's not so much a wysiwig editor, as a realtime preview alongside a raw code editor. Which is fine. They use something called marked to parse the markdown, and d3-view to render the resulting HTML, but the latter doesn't seem to particularly add much - updating innerHTL of some element via another mechanism would be pretty trivial.

I can add a basic version of this.

I'm starting to think about ways it might be useful to have ways of embedding little custom bits of script; potentially, you could author something that would have functionality for manupilating the wider state of the page: buttons that when pressed would do some combination of selecting a range of columns, perhaps (at some point) changing the set of charts that are displayed and their arrangement... anyway, may as well get a basic editor in there for now.

xinaesthete commented 1 year ago

If we want something actually WYSIWYG and do decide that we want to use this for more elaborate things down the line, it seems like Quill might be interesting

It allows customization and new additions of formats and content. Quill considers the web as a target output, not just paper. Therefore, in addition to supporting traditional formats commonly found in word processors (like bold, italics and lists), Quill allows the definition of entirely new formats and content not previously imagined. Quill’s users have already added customizations to embed slide decks, interactive checklists and 3D models.

xinaesthete commented 1 year ago

I've added this now, in a very raw form. I also made it sanitize the HTML output to avoid any potential security issues.

Without that, we probably could make a demo project with some flashy script embedded in one of these elements, but I suppose it's better not to leave glaring vulnerabilities, so we can consider what should and shouldn't be allowed, or how to author it, later.

xinaesthete commented 1 year ago

It does mean a bit more bloat, as we're now adding both marked and dompurify to the stuff we import.

martinSergeant commented 1 year ago

experimented with conditional import of marked and dompurify. Together were only 58 KB minified anyway