Handle source code from gist.github.com

[atilacamurca]

How do you suggest to handle source code from gist.github.com?

Here's an example post https://medium.com/@lavrton/how-to-optimise-rendering-of-a-set-of-elements-in-react-ad01f5b161ae#.1hjkv2mbg

If we inspect we can see that medium creates a link to https://medium.com/media/9a839b7d6f1167898954c381e0c3b03c?maxWidth=700

This link is an iframe with the contents of the gist.

We can use the gist API https://developer.github.com/v3/gists/#get-a-single-gist

You can get a gist using the url https://api.github.com/gists/07cc0a10c7c96fb1fde4

This return a JSON with details of the gist including a Files object describing the files on the gist. We can iterate this object and generate pre tags.

We can also know the language and enable the highlight! Each file in the object Files has an language associated.

What you think?

[gunar]

Wuuut sounds great! I hadn't thought of that. Yeah medium-parser could totally use that feature :balloon:

[atilacamurca]

Great man, as soon as I have a spare time I will work on that.

I can see great things coming from this lib, keep the great work!

[gunar]

Thank you very much. I'm happy it's useful for you.

If you'd like to discuss any code, open a PR and let's talk about it.

[danarth]

Hey @atilacamurca, did you ever get round to working on this issue? If not, then @gunar I am pretty busy at the moment but would love to see this as a feature in medium-parser, so if I get the time I'll try and open a PR! 🙌

[atilacamurca]

not working on it @DanielArthurUK , you should do it :)

[danarth]

@atilacamurca @gunar I have some spare time now so I am working on a possible solution to this. I can easily obtain the src of the <iframe> that Medium creates. However, to get the ID of the gist, I will have to asynchronously visit the src url.

Is it okay to add asynchronous calls to the processElement.js script? I just thought that if the processElement script is called for every HTML element on the page, an async call might mess with the script 🤔

This isn't as easy as I first imagined 😂

[gunar]

@DanielArthurUK That's not going to work. medium-parser is a synchronous function/library.

You could add a second function (extend the API). This second function would return a Promise. THEN, you can have processElement return an object that the outer function can recognize, do the async call, and replace inline the value.

https://github.com/gunar/medium-parser/blob/2ca35786cd369fbfc947b2b75a380f00d4c4b400/src/index.js#L13

After all that is working, we could open a PR against medium-converter to add this functionality to it.

[danarth]

@gunar when you say add a second function, do you mean add a second function after processElement? Surely if we wrap processElement in an asynchronous function, the medium-parser library will still be asynchronous?

Sorry if I am misunderstanding what you are saying! Also I apologise for all of the questions 😅

[gunar]

I was just trying to say we could keep both the synchronous and promise-based APIs but looking back it seems irrelevant.

Yeah we need to make medium-parser return a promise with a major version release.

I'll reply to any questions I can! 👍

[danarth]

Maybe it is time to think about drafting some ideas for a new major release then? A new promise-based API could be a good idea like you say, plus it would be easier to integrate the GitHub Gist functionality too.

By using promises, medium-parser could be used like so:

fetch('https://medium.com/some-article')
  .then(res => res.text())
  .then(html => parse(html))
  .then(post => {
    // Use the post object as before, e.g. post.markdown, post.title etc
  }) 

The above is just an example. This is a bit off-topic and for another issue probably, just wondered your thoughts on a major change!

[danarth]

I have created a new branch DanielArthurUK/medium-parser@next that exposes a promise-based API. I believe this will allow us to easily parse GitHub Gists!!

[gunar]

I'm thumbs up on this major change!

[danarth]

@gunar That's great news 👍 I am still working on this but if you could create a next branch in the meantime I can open a PR against it 🤓