Add support for HTML output

[aayushmau5]

This library currently supports JSON, & YAML output.

We need to support HTML output.

Check #75

The format of HTML output

The goal is to generate a HTML(or jsx?) that can be reused in AsyncAPI studio as well. Thus, we need to have a detailed discussion on the format.

[Khadeeejah]

@aayushmau5 hello, iwould like to work on this

[aayushmau5]

@Khadeeejah Awesome! Issue is yours, but first, I think we need to have a detailed discussion on what the HTML should look like 🤔

[aayushmau5]

The goal is to generate a HTML(or jsx?) that can be reused in AsyncAPI studio as well. Thus, we need to have a detailed discussion on the format.

CC @magicmatatjahu what do you think the format should look like?

I'll see what I can come up with. @Khadeeejah it's a good opportunity to checkout AsyncAPI studio as well 🙂

[Khadeeejah]

Please let me know what you come up with

[aayushmau5]

Sorry for the late reply.

I'm just throwing around some ideas, so feel free to suggest or make some changes.

I think the HTML structure will look very similar to the markdown output. Ex.

<h1>Diff</h1>

<h2>All Breaking Changes</h2>

Changes inside code blocks?

<p><span bold>Action :</span>Add</p>
<p><span bold>Path :</span>/some/path</p>
<p bold>Before :</p>
<code syntaxHighlight>
  {
  Hello: "world"
  }
</code>
<p bold>After :</p>
<code syntaxHighlight>
  {
  Hello: "world"
  }
</code>


<h2>All Non-Breaking Changes</h2>
....

<h2>All Unclassified Changes</h2>
....

Some features may be:

• Syntax highlighting in code block(not sure what approach we are taking for styling though)
• Instead of having After and Before, we can perhaps have the changes in a single code blocks with highlights what's changed. Just like github does in diff output.

This is what I came up with.

My current question is what approach are we taking to styling?(Should we include style sheets in the output, having class names in html structure so users can make changes based on class names, some other approach?)

CC @derberg Need some suggestions here :)

[derberg]

sorry @aayushmau5 but I'm the worst person to ask for styling feedback 😄
what I know though is that I like to copy from others if I do not have an idea on my own 😄

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity 😴

It will be closed in 120 days if no further activity occurs. To unstale this issue, add a comment with a detailed explanation.

There can be many reasons why some specific issue has no activity. The most probable cause is lack of time, not lack of interest. AsyncAPI Initiative is a Linux Foundation project not owned by a single for-profit company. It is a community-driven initiative ruled under open governance model.

Let us figure out together how to push this issue forward. Connect with us through one of many communication channels we established here.

Thank you for your patience ❤️

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity 😴

It will be closed in 120 days if no further activity occurs. To unstale this issue, add a comment with a detailed explanation.

There can be many reasons why some specific issue has no activity. The most probable cause is lack of time, not lack of interest. AsyncAPI Initiative is a Linux Foundation project not owned by a single for-profit company. It is a community-driven initiative ruled under open governance model.

Let us figure out together how to push this issue forward. Connect with us through one of many communication channels we established here.

Thank you for your patience ❤️

[sambhavgupta0705]

Hi @aayushmau5 is this issue still active?

[aayushmau5]

@sambhavgupta0705 yes! You want to take this up? Let me know if you need any help.

[sambhavgupta0705]

yeahh @aayushmau5 I need some more clarity on this issue.

[barat-sh]

Hi @aayushmau5 is this issue still active? i can contribute.

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity 😴

It will be closed in 120 days if no further activity occurs. To unstale this issue, add a comment with a detailed explanation.

There can be many reasons why some specific issue has no activity. The most probable cause is lack of time, not lack of interest. AsyncAPI Initiative is a Linux Foundation project not owned by a single for-profit company. It is a community-driven initiative ruled under open governance model.

Let us figure out together how to push this issue forward. Connect with us through one of many communication channels we established here.

Thank you for your patience ❤️

[imabp]

@aayushmau5 do you need a static html file, which can be displayed on studio? I want to understand the requirement here.

The goal is to generate a HTML(or jsx?)

As you mentioned in issue description about jsx. If we go with jsx method, we need to use transpilers, and make necessary changes in asyncapi studio as well, whereas, static file serve, do not need extra efforts

Before we start, I wanted to know the requirements, how do we want to present it in studio?

[imabp]

In my mind, I want to have something like this. This will essentially, take care of generate of static html file as an asset, which can be used in CIs for. visualization or in studio. What are your thoughts? @aayushmau5

cli generate-diff document1 document2 --html --path "/"