Because a cell, may have more attributes than just the content, we may want a way to edit those attributes. For example, a file block, could contain a user, path, and other attributes to set. It could be useful to introduce a set of operations (🖊️ edit, |> run, "..." content options menu, o select) to help distinguish operations on a block.

Inspiration:

Browsing and loading a file has many drawbacks... including inability to process associated relative files, such as images, or private tokens (not included in repositories).

Instead, we can phase out browsing files to replace with these other options:

• import from github (which clones into a space we can manage and control, and thus handle things like images, etc.)
• load notebooks from notebookdir, much like "examples" are loaded. Jupyter also has the "homedirectory" concept as well: jupyter notebook --notebook-dir D:/my_works/jupyter_ipynbs
• Provide option to start server from different directory for case where you didn't want to copy/move files into central notebook store. This can replace the browse button for "ad-hoc" stuff for when these other options aren't workable.

Once done, then we complete with:

• Remove browse button and endpoint.

The output of a command can be represented in a fixed-sized scrollable box, with a "terminal" look and feel.

Inspiration:

Need to have a respectable min. size for the cells, in the event the cell is too small. Furthermore, it should not be too responsive to the size of the content, but constant based a fixed parent width, etc.

I hope I can edit and save it online

docable is incorrectly adding a cell class to the pre block. This is not the responsibility of docable, nor is it the correct structure we need.

Rather than,

<pre class=docable cell>
    <div class=sideannotation>
    <code>
</pre>

Instead we something like this.

<div class=cell>
    <div class=sideannotation>
    <pre class=docable>
       <code>
    </pre>
	<div class=output></div>
</div>

The sideannotation should be outside of pre block.

This has implications on layout as the side annotation is a div and may have certain padding, vs. the <code> block is a inline element.

Give me an in-situ way to edit vector diagrams and you can have all my money.

https://twitter.com/gvwilson/status/1290617242678435840?s=20

Hmm, a simple step in this direction. Probably could just render a code block with svg code into a real svg.

```svg|{type:'svg'}
```

keeping misc imgs, gifs, demos here.

When looking at step 2:
Upload your data: git push

It was unclear as to what values were to be inserted for and . It would be really helpful if the instructions were more specific/clear as to what values should be used. My local branch was master while remote defaults to main.

https://twitter.com/phil_eaton/status/1292630562985988098?s=20

Very cool! Might recommend having an always-there Play button below the snippet otherwise it's not so clear that the code is executable unless you've seen the demo. (I don't normally hover over code while I'm reading Markdown or a blog post).

I often want to tinker with a cell to try different arguments, but eventually go back to the cell's original content provided by the tutorial before I proceed. However, there does not seem to be an easy way to do this, so I have to memorize the contents or reload the page.

While editing a cell, if I undo or redo then the prior text is appended to the current text. This does not appear to happen in every notebook. It seems to only happen if you execute the cell between edits. (Chrome 89, Windows 10)

Example:

1. Go to the git example notebook.
2. Run the first cell.
3. Edit the cell to say dir.
4. Run the cell.
5. Click into the cell again and undo.

The content is now incorrect. If you redo then it will continue to append the text.

We can indicate that there are special settings, such as user or permissions with icons, such as this "security badge".

We should have a basic menu (☰) for docable.

Some useful pages, would include:

• Menu on nav bar.
• A home page with a list of clickable notebook examples.
• User's notebooks page (home directory of their notebooks).
• Settings/Preferences.

Inspiration:

As we execute each cell, we can update progress in UI.

Inspiration:

• do a tiny bit of clean-up: change format to json5, clean up css rules, look-n-feel.
• integrate m2html inside main notebook server...
• work on basic bridge for execution based on "data-attributes" in docable
• work on executed, look and feel... how is output rendered and displayed.
• deal with "serialization" ... how are things saved?