showdown icon indicating copy to clipboard operation
showdown copied to clipboard

News about the event_refactor branch?

Open VoltanFr opened this issue 2 years ago • 2 comments

Hello @tivie

I'm a user of Showdown: in my application, users create memory cards with Markdown, and the cards are rendered thanks to Showdown. Works perfectly nice, very convenient.

I'm trying to beautify the user's text, with two ideas (I have more, this is the current iteration):

  • Replacing some spaces with nbsp, to prevent carriage returns before punctuation (in French, there is a space before some punctuation marks).
  • Automatically adding thousand separators.

Implementing this (specially the latter) with the current release of Showdown (2.0) and its implementation of extensions and listeners is complicated, because the regex to write are awful since I have to consider the whole text (I don't want to alter URLs or citations, for example).

I dug into the code of the event_refactor branch: the new event system looks brilliant. Being able to work on the text caught by a subparser should be a game changer (captureStart).

  • Do you think I will be able to catch an event to work on plain text, ie text which is not of a specific type? Maybe I'm just talking about the paragraph subparser, but if there is a link in a paragraph, will the event include the link in the caught text of this subparser?
  • The /dist/showdown.js file in the branch is not in line with the source code. This prevents me from playing with the implementation. How can I build it? Or, will you update it?
  • Do you have an idea about when this branch will make it to production release?

Thanks a lot and congrats for this excellent work.

Vincent

VoltanFr avatar Apr 02 '22 23:04 VoltanFr

Hey,

Thank you. I'm really glad you like the new event system. It should simplify extension building and implementation.

Q1

Do you think I will be able to catch an event to work on plain text, ie text which is not of a specific type? Maybe I'm just talking about the paragraph subparser, but if there is a link in a paragraph, will the event include the link in the caught text of this subparser?

Humm... I see what you mean. This one is tricky. Since markdown (and HTML) can have infinite nesting, there isn't a simple way to catch only clean text. For instance:

some title

some blockquote text with a list:

  • with bold and then emphasis with a ~~strikethrough~~ inside yeah
    • and this is a sublist which has ~~a strikethrough then emphasis then bold which complicates~~ stuff
> #### some title
>
> some blockquote text
> with a list:
>
> - with **bold and then *emphasis with a ~~strikethrough~~ inside* yeah**
>     - and this is a sublist which has ~~a strikethrough then *emphasis then **bold** which* complicates~~ stuff

The makehtml.spanGamut.onStart event would give you these results (or similar):

showdown.extension('foo', function() {
  let counter1 = 1,
      counter2 = 1;
  
  return [{
    type: 'listener', //or output
    listeners: {
      'makehtml.spanGamut.onStart': function(sdEvent) {
        console.log('makehtml.spanGamut.onStart', counter1, sdEvent.input);
        counter1++;
      },
      'makehtml.spanGamut.onEnd': function(sdEvent) {
        console.log('makehtml.spanGamut.onEnd', counter2, sdEvent.input);
        counter2++;
      }
    }
  }];
});

output:

1 'some title'
2 'and this is a sublist which has ~~a strikethrough then *emphasis then **bold** which* complicates~~ stuff'
3 'with **bold and then *emphasis with a ~~strikethrough~~ inside* yeah**\n\n¨K2K\n\n'
4 'some blockquote text\nwith a list:'

The makehtml.spanGamut.onEnd event would give you similar results but with the text already converted to html (or hashed).

1 'some title'
2 'and this is a sublist which has ~~a strikethrough then ¨C0C complicates~~ stuff'
3 'with ¨C1C\n\n¨K2K\n\n'
4 'some blockquote text\nwith a list:'

(in this example strikethrough option was not enabled)

Q2

The /dist/showdown.js file in the branch is not in line with the source code. This prevents me from playing with the implementation. How can I build it? Or, will you update it?

Building is easy.

  1. Clone the repository
  2. Checkout the event_refactor branch
  3. run npm install
  4. run npx grunt build

It should build (if there are no errors or failed tests). I always try to commit passing even to branches, but it's not garanteed.

I will, however, push an updated build so you can test stuff around. Keep in mind this branch is under active development. It's super experimental at this stage and stuff will probably change, a lot.

Q3

Do you have an idea about when this branch will make it to production release?

This will be ready for 3.0.0 release-alpha1 release, which shouldn't take that long. For stable release, it might take a while, cannot give you an ETA.

tivie avatar Apr 03 '22 01:04 tivie

Hello @tivie

After rebuilding, I've been able to listen to some of the new events (eg headers.captureStart). It works and confirms it looks powerful and easy.

Thank you for all these details. It looks like my project is not so easy to implement, due to the permissiveness of Markdown. Maybe using some sort of stack to keep track of the syntactical tree would help, I'll need to pore over that.

At least for development, it would be cool if we could listen to groups of events, something like 'makehtml.*.onCapture'.

Thanks for all this information. Vincent

VoltanFr avatar Apr 03 '22 07:04 VoltanFr