pubpub / pubpub-editor

A stand alone, extensible WSIWYG editor based on ProseMirror
GNU General Public License v2.0
101 stars 9 forks source link

Syntax highlighting for code blocks #47

Open joeltg opened 3 years ago

joeltg commented 3 years ago

It would be really amazing to have syntax highlighting for code blocks; this is my biggest pain point in trying to write technical pieces on PubPub right now.

I like the way Notion does this, with a little dropdown to select the language in the corner that only appears on hover.

metasj commented 3 years ago

This would be +++, and should take a stab at guessing the right language. There are some decent classifiers out there designed for just this use case (short blocks).

shaunagm commented 2 years ago

Currently trying to decide whether to stick with pubpub for a technical project I'm working on—the lack of syntax highlighting is weighing heavily.

gabestein commented 2 years ago

Thanks for letting us know! We discussed adding it a few weeks back, but went with improving LaTeX blocks first since we have a little more LaTeX usage than code. But I don't think it seemed that complex, so I'll bring it back up next week and see what it might look like. Any particular timeframes you're working with?

shaunagm commented 2 years ago

No hard deadlines, but we are planning to make a decision about what tool/host to use in the next few weeks. Knowing that syntax highlighting is on your radar is helpful.

shaunagm commented 2 years ago

Hi @gabestein, did you end up discussing syntax highlighting again? If so, was there any consensus on whether or not to tackle it?

gabestein commented 2 years ago

Hello! Yup, we did. It'll be next up after we land the LaTeX changes. We'd start next week and would develop for something like 2-4 weeks, I would expect, depending on complexity.

Are there specific needs you have for syntax highlighting beyond the basic ability to select a language? I suspect we'll end up enhancing existing code blocks rather than trying to add more editor-like features for writing code (tab memory, bracket and paren auto-closure, etc.) since we imagine most folks will be pasting in from code editors, but we discussed adding a few smaller features to make writing/editing small snippets of code easier, so if you have thoughts, those would be helpful.

shaunagm commented 2 years ago

That's great news!

We'll be copying and pasting existing code that we've written elsewhere, so we don't need IDE-type features. Most of our code blocks are Python, so making it easy to copy and paste in while preserving indentation would be very useful. But really our core need here is just readability. I wrote some custom css so that code blocks have a different font and background color, but it looks kind of hacky. Having styling that's consistent and well-designed, and with language-specific syntax highlighting, will make the documentation so much easier to read.

Really grateful that you'll be tackling this soon.

shaunagm commented 2 years ago

Hi @gabestein! Any updates on this? We'd like to do a publicity push in the next month or so and drive people to our site, but the code blocks still look quite messy. Any improvements would be much appreciated.

gabestein commented 2 years ago

Hello. Yup, we're working on it now and should have a first pass with JS support in the next few days, followed quickly by the ability to choose languages. This repo is more or less retired (we've merged the editor into our main codebase because it ended up being reliant on a lot of core PubPub functions), but you can follow along here and here.