live webview of pretty-simple in action
cdepillabout opened this issue ยท 10 comments
It would be nice to have a website that could be used interactively to show how pretty-simple formats things.
This could be done in the following steps:
- Figure how to compile
pretty-simple
with GHCJS. - Create a small frontend application in either Haskell with GHCJS or just plain JavaScript. The frontend application should roughly look like this: https://jsoneditoronline.org/. It should have a textbox on the left for entering some sort of
show
ed Haskell datatype. It should have another Haskell datatype on the right that shows the input Haskell datatype formatted with pretty-simple. - The frontend application needs a way to convert from ansi escape sequences output from pretty-simple to HTML for showing in a web page. Maybe there is already a Haskell library (or JavaScript library) that does this?
- Send a PR with the above.
- Together we can figure out how to use github-pages to host this example page.
I think there is another pretty-printing library for Haskell that does something like the above, but I forget what the library is called. It might be a good idea to look at how they are doing it.
I'm adding the beginner-friendly
label to this, since the actual code you have to write shouldn't be too difficult. However, figuring out how GHCJS works and how to make a frontend app with Haskell (or a frontend JS app that calls out to Haskell), is non-trivial. It may take a long time to actually get the above working for a beginner.
I think there is another pretty-printing library for Haskell that does something like the above, but I forget what the library is called. It might be a good idea to look at how they are doing it.
From the footnotes of this blog post, the library is called shower. Here is their interactive webpage: https://monadfix.com/shower/.
It is written using GHCJS and Reflex: https://github.com/monadfix/shower/tree/master/js
With #73, the HTML generation becomes pretty trivial:
pPrintHtml :: Show a => a -> Html ()
pPrintHtml = renderHtml . fmap renderStyle . treeForm . layoutString defaultOutputOptionsLightBg . show
where
renderStyle (Style mc b i) =
(if b then b_ else id) . case mc of
Nothing -> id
Just c -> span_ [style_ $ renderColor c]
renderColor c = "color:" <> T.pack (show c)
(I'm not quite sure what to do with the intensity value)
renderHtml
comes from prettyprinter-lucid, which I'll publish once I've found a satisfactory solution to georgefst/prettyprinter-lucid#2.
This would be quite a cool thing to have in place for the 4.0 release.
Ugly proof of concept using Miso: https://georgefst.github.io/
The full colour highlighting actually works properly in a local version (with jsaddle
), but unfortunately it seems to trigger a bug in GHCJS. I'll try to narrow down the source of that.
@georgefst Wow, that's really neat!
@cdepillabout You'll notice I've gone a bit quiet. And it could be a while yet before I come back to this. So I'm thinking, we:
- Release 4.0 on Hackage today
- Open a fresh issue detailing what can be done to polish things up (most of the discussion on this page is no longer relevant)
- Announce on Reddit, with a link to the existing webview, and the new issue, encouraging contributions. There's a workshop going on right now at Munihac about Miso, so this is potentially very good timing.
Are you happy if I go ahead with the release?
@georgefst Thanks for all your work.
Please feel free to go ahead with the release.
Eventually I'd like to move the webview URL to something like https://cdepillabout.github.io/pretty-simple/, so that I also have control over updating it, but I am fine with it being at https://georgefst.github.io/pretty-simple/ for now.
When you do the release, can you make sure to do the following two things:
- Update the
CHANGELOG.md
with all changes end-users would care about - Create a git tag at the commit you've pushed to Hackage