Selective heading levels

[peter-power-594]

Greetings @Ionaru and other EasyMDE developers,

Pierre-Henri alias Peter here, the french fry guy behind WordPress Markup Markdown, a WordPressified working version of EasyMDE 😁 First, congratulations for having the gut to code the project. It's a great piece of work that probably required a consequent amount of time and energy 👏 I wouldn't have been able to do it myself.

For my first contribution, similar to the environment described in issue #354 , I was looking for a way to disable the H1 tag as WordPress has already its own post title field by default. Actually it was far more complicated than I thought... 🥵

It's a work in progress but this version is usable at least. What I did is basically adding a new option to specify heading levels, and then using the CodeMirror beforeChange event to do some magic to modify the update if need be. Nothing amazing, I mostly prevent the user inputting some characters by tuning the output.

I have no idea if it's a match for you in a future release, any feedback is welcome, especially if we can collaborate on a few features 🤲

Kind regards, and have a wonderful day

Peter

[Ionaru]

Hi Peter, thank you for your contribution!

Firstly, I commend your bravery for diving into the code that inserts the heading tags, it's not the easiest part of the editor. 👏

Then, I can see your use-case and I think a configuration option is the right call. I'll be happy to merge this once finalised :)

Without having looked at the code yet and just out of interest, how do you prevent a user from just typing # title and creating a <h1> tag that way?

I'll go through your code as soon as I can and provide more feedback.

[peter-power-594]

Hi @Ionaru ,

Thank you for your kind words and for your quick reply :-)

To answer your question if the user types # title, then I switch automatically the output to the h2 tag ## title if allowed.
(Or the next heading level defined in the setup like h3 or h4 if the h2 one was forbidden)

I use the CodeMirror event beforeChanges. I don't know if the approach is good but this is the best proxy / bridge I found just after a user input and just before a content update.

About the UX, for a brand new heading, I setup the "sharp jump" when the user presses the space between the "#" sign and the "title" text to kindly notify the closest level defined is H2 for example and not H1. When pasting, deleting or modifying an existing heading or a line containing a heading, the update is done live without delay: sharp signs are added or removed straight forward.

Don't know if my explanations make sense, gonna try to do a tiny post / video during the week-end.

No worries at all about the timing, please do as you can. Brain is getting hot quickly hehe.

Keep in touch

[peter-power-594]