Feature request: Importing Observable module as an Observable notebook.

1

Following the discussion with Aaron , would it be possible to create or edit an Observable notebook from a module import ?

I’m thinking of the opposite of the ‘download code’ button.
This would certainly help editing big notebooks with our preferred editors and then put them back online.

1 Like
2

Just curious, why do you develop a notebook locally with your preferred editor? I have a half-finished project of running an Observable notebook in atom, but part of the reason why I stopped was because I assumed there weren’t many people who wanted to work on an observable notebook offline

2 Likes
3

Well one use case as was saying Aaron would be to renmame a bunch of variables.

Another, for me would be to jump around the file with keyboard shortcuts, use multiple cursors, grep it and maybe keep my own git logs.

Maybe this is just an issue for people who are still learning like me, but I would really find it easier to develop a notebook with my editor rather than in the navigator.

Now, I don’t think there are many people using emacs as their preferred editor so your probably right any way.

Edit: and I didn’t know about Codemirror before reading this post.

2 Likes
4

Something like what you describe is certainly possible, but it would take some work to put the pieces together.

Suppose you start with a modified notebook JS module and want to upload it to observablehq.com. Observablehq.com has an internal API it uses for user / notebook data that @mootari has investigated and written some client code for (see this thread).

The API and the Observable editor use a different representation of notebooks, which I’ll call notebook JSON. Roughly speaking, these JSON objects consist of some metadata and a field called nodes with an array containing cell objects. These cell objects have fields:

  • id, a unique numerical cell ID,
  • pinned, a boolean which is true if the source of the cell is pinned, and
  • value, a string containing the contents of the notebook cell.

These notebook JSON objects are “notebooks as data” and JS modules are “notebooks as code”. Therefore, transforming from one to the other is a type of compilation / decompilation. I investigated this a while back for the V1 runtime format (inspired by this notebook by @asg017 on the Observable parser) in the following pair of notebooks:

  • This notebook contains a function that compiles notebook JSON to a runtime V1 module.
  • This notebook has a function that decompiles a runtime V1 module to notebook JSON (with some limitations).

Thus, returning to the scenario where you have a modified notebook JS module file, you first need to “decompile” it to a notebook JSON file (using something like the fromV1 notebook above but for the V3 runtime).

Once you had that, you could then try using this nodejs script from the above forum thread to upload the notebook JSON as a new notebook. Then you could merge the new notebook into your already-existing notebook. The script could probably be adapted to do these last few steps automatically for you.

Note that I haven’t used this script in months so I’m not sure if it still works. (It would probably be better to rewrite it using @mootari’s observable-client library.)

As you can see I’m quite interested in offline tools for Observable notebooks as well. Given more time and energy I’d want to clean up the bits and pieces above and then put some effort into an Observable notebook VS code extension…

6 Likes