WYSIWYG editor

[rlanzafame]

TeachBooks has a functioning WYSIWYG app that was developed by a group of students at Delft last Spring. It might be interesting for JB2 (and already works for JB1). I will start with a brief explanation and some useful links. Later I will try to post a video demonstrating usage of the tool.

The tool (we called it the TeachBooks Wizard) currently works in JB1 as a Sphinx extension: an "edit this book" button is added, then the WYSIWYG interface is activated. I presume this would need to be implemented as a plugin for JB2. Edits to the source code are committed to the repository (using a PAT for authentication/access); the user can choose which branch to commit to, and write the commit message. The design perspective focuses on supporting a particular user type: those that are learning about JB and the related tools (git, python, etc) and lowering the barrier to contribute to a book as much as possible. The intention was also to endow the tool with tips and hints to help users learn how to be more independent.

• the source code is in https://github.com/teachbooks/wizard
• A test repo (and template) is https://github.com/TeachBooks/Editor_Test
• to try it out, follow the instructions on the test repo page using Option 2: it takes around 5 minutes to set up. you can also skip the PAT step if you only want to test the editor without committing to the new test repo you make.
• the students also used JB1 to write their report documenting the tool! https://lopalov.github.io/Final-Report/main/intro.html#

@ryanlovett @fperez @JimMadge

[JimMadge]

I could see this being popular with Turing Way contributors. I believe a lot of our contributors use the GitHub interface to edit files, which is a bit of a poor experience. Something like this which is in-browser but also not trying to be an IDE, like the VSCode-like offering on GitHub, could suit them quite well.

I think I would still recommend people take the time to learn MyST Markdown though, to take advantage of all of the features. We did also talk @rlanzafame about using something like editing in JupyterHub with live previews. That is a different idea though.

[rlanzafame]

I think I would still recommend people take the time to learn MyST Markdown though, to take advantage of all of the features.

Definitely. I think this tool would be ideal as a temporary aid for users who need a bit more help and time to absorb the tools/workflows/concepts required to make and maintain a book.

We did also talk @rlanzafame about using something like editing in JupyterHub with live previews. That is a different idea though.

Yes, that was different: it was using a JupyterHub or Binder hub to run something like myst/jupyter book start to support book building with 0 install for user. This tool should be able to work in any environment as long as the GitHub PAT authentication can communicate with the repository where the commits are to be made.

[JimMadge]

Starting a new thread for a bit of a tangent about the jupyterlab-myst extension.

Advantages,

• (Probably) familiar Jupyter interface for editing.
• Live previews for both ipynb and md.
  (Although the md previews are hidden in a context menu. It might be possible to open them automatically, or we can make a docs improvement to point this out).
• Presumably, you can use other other IDEs to edit after connecting to the Jupyterlab instance.

Disadvantages,

• You need to stand up a Jupyter lab for editing
• Plugins don't seem to be used

To be used like the WYSIWYG editor, there will need to be some way to commit changes and push them to a repo. I wouldn't be surprised if there was already an extension that does this.

[choldgraf]

I wonder if you could set up jupyterlite to run jupyterlab-myst, and then enable editing workflows with github using jupyterlite...you could use the "notebook" interface so it wasn't so complex

[JimMadge]

Very similar to what @agoose77 said. (Sorry, I'm kind of splitting this conversation between here, Discord and in person).

I feel The Turing Way Community would really like an interface like this, so if there is a question of defining the requirements or finding a partner to look for funding, it would be good to work together.

[ryanlovett]

Although the md previews are hidden in a context menu.

Thanks for showing that to me today @JimMadge !

[mforbes]

You might also consider CoCalc.com: they already have a WYSIWYG Markdown editor, but it does not yet support MyST Extensions. They will be releasing a standalone version (called CoCalc Lite maybe?) which I am hoping will be a very good option for general MyST editing. They keep track of what is happening with Jupyter, so it might be useful to chat with @williamstein at some point to help this get moving.

[rlanzafame]

@jnywong

[jnywong]

Thank you @rlanzafame for showing me the tool at JupyterCon! I am keen to see how this progresses, and it looks like there are several ideas where this could go. I am personally a +1 to the the thread above of wiring this up to JupyterLite and using the JLab-style editor that allows a preview of the rendered content so that folks can make the most of what MyST markdown can provide 🚀

[rlanzafame]

I am going to create a new Discussion to describe the tool needed for GitHub authentication in JupyterLab. Let's keep this discussion going but focus on the editing side of things.

Specifically, this is a list of requirements brainstormed by @fperez at the sprint. It is part of a user story we will document elsewhere. The key thing is to make sure the user editing experience in a ipynb or md file is first class. It does not explicitly need to be WYSIWYG, but WYSIWYM..."what you mean," similar to the LyX processor for LaTeX. It should be semantically correct; it does not need to get the style of the entire book right. It focuses on the contents of a page; user would need a myst build when checking things at book scale.

Features to consider (i think not mutually exclusive...not my area of expertise!):

• metadata fields
• completion and hints
• lsp-integration
• menus with myst help, links to docs, etc
• syntax highlighting
• making the preview buttons and website preview are smooth

Some items in this list can be checked with/transferred to issues in the Jupyter Lab Extension repo.