-
-
Notifications
You must be signed in to change notification settings - Fork 122
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Simplest "view-only" behavior for publishing on vanilla HTML sites? #107
Comments
I also want to ask whether it is possible to have a timeline renderer support for react. (Btw, this is a really great project, the good-looking style, the idea, etc.) |
@shah HTML output is a good idea... the timeline, like all views, is framed, so it's already well encapsulated. The only problem is that it expects some outside input to know what to render. Which would normally be given to it by the app (markwhen.com or the VS Code extension). I guess if all assets were inlined (css and js), one could simply download the page 🤔 🤔. I will investigate this further. @hikrr If you implement the view orchestrator stuff in your react site you could host the timeline component. In fact I'm kind of doing the reverse thing - the calendar view is a react component and I am running it with the ViewOrchestrator which is in vue.
|
Thanks for the elaboration @kochrt - seems like Markwhen would be a perfect fit for static site generators. Currently we're using Mermaid's Gantt and Timeline views in our Astro-based SSG but Markwhen is easier to write, more feature-packed and nicer to look at so we look forward to reading about the results of your investigation. |
@kochrt should probably be a vite plugin like https://github.com/antfu/vite-plugin-md |
@shah I just published With it you can do something like mw my-timeline-file.mw timeline.html from a terminal to convert a markwhen file to the timeline html. The html is fully contained (all js/css is inlined and no external scripts). It outputs an entire document, so if you wanted it as just a view on a page (as opposed to an entire page) you'd have to put it in an iframe. If you try it, please let me know how it goes or if you have suggestions for improvement. |
That's great news @kochrt - I appreciate the note and will give it a shot this weekend, thanks! |
Thanks for this great feature @kochrt - it worked well for me. Potential bug:
Suggestions:
|
@shah Did you provide an input file in both cases? |
Yes I tried a couple of variations, @kochrt it's pretty strange -- in my Node project, if I do this (my MarkWhen file is npx @markwhen/mw public/roadmap-prime.mw -o timeline -d public/roadmap-prime_timeline.html The content in
The content in I run the commands directly from my NodeJS root and I have a package.json task defined so I can run it conveniently from there, too. |
Sorry about that, should be fixed in |
Excellent, thanks @kochrt I'll check it out soon and report back. |
@kochrt should $ npx @markwhen/mw public/roadmap-prime.mw -o timeline -d public/roadmap-prime.html My Thanks! |
Hm can you try adding
|
Perfect, that did the trick @kochrt - thanks! |
@kochrt this is a fantastic project, thanks for putting it together! We're using the VS Code extension for editing but we have a (seemingly) simple need: publishing a read-only interactive web version for in use in browsers. Similar to Mermaid and Markmap others that allow text to HTML/Js visualizations does Markwhen support creating browsable output for vanilla HTML sites (this is not the same as export/SVG).
For example, Mermaid and Markmap have an easy integration by just using
<div class="mermaid">...content...</div>
. How could we do something similar to make Markwhen markdown browsable?The text was updated successfully, but these errors were encountered: