Thanks for the debugging hints! The frame content works fine in its own browser tab. And now it also works fine in the frame!
So I went to my old Mac, running LibreWolf as well. Opened the forum page: just a grey rectangle. Loaded the frame content in a tab: works fine. Back for the forum page: works fine as well. Something happens to browser state.
One good Neko deserves another:
I am into this. And we are not alone. There this failed demo about a company letting “designers” as in “graphical designers” push to production from a convo within the IDE. Some people are experimenting with similar workflow but working from discord / slack.
Quoting @khinsen original thread:
That, in my humble opinion, what happens in Möbius. Each one has its own workbench, and there is a shared space, but none can overload existing work (it is append only), and “fork” have an history, a lineage. I wonder whether that is what you had in mind with “equal peer relation”?
I created a prototype notebook-like app, where I can create, embed and debug applications on-the-fly in the conversation:
There is step, big or small, to turn that into a plugin for discourse, but I can imagine / dream a code path toward that goal.
When I started working on Möbius I had the idea of using a concatenative language, but the requirement to also have every identifier translatable broke the “design”, so I fallback to non-concatenative language. I mention this, because the problem of the prototype in the above screenshot is the almost complete absence of agency code-wise [0]. Change in micro-apps can only be done via natural language. My goal is / was to let the user “open the (generated) clicker game source” and edit it directly, an inspector and commit it in the shared space, and let people look at the work-in-progress process, and the result.
[0] editing python and json soup of pseudo html in a notebook is not something find malleable.
I am working on allowing Lopecode to be published on the atproto
Seems like several links break iframe though, core-functionality works though, you can click fork or download, for example (then all the links work properly as its no longer in an iframe).
Still working on the discovery and upload side of things for collaboration but a global feed of everyone’s notebooks here https://lopecode.com which (in theory) gives your the remixing and stuff.
There are personal pages of what people wrote @lopecode/ledger
I am trying to get all these features working without mandating a domain (i.e. lopecode.com) and going direct to the atmosphere where possible, so most of this stuff should work from a local file as well.
I find your Lopecode-in-an-iframe useful enough even if I have to click the “fork” button to do anything but read it. Which is a good reason to keep “fork” on the top!
yeah I changed a notebook to make sure the exporter module was the landing page! I think self-serialization across mediums is really the main thing.
If anyone thinks they would like that in their work, we could try packaging a pure JS application into a module and then it would inherit all the Lopecode stuff but with the opening module being your app, then it can transmit on atproto or via file. Lopecode can bundle files so we can bundle any Javascript and additional assets. Not in turn-key way yet but I would like to try to figure out how to do it on a real example.
Also nice to have: a minimal Lopecode notebook with just the infrastructure, including the exporter. As a starting point for a new project. I did find something similar on your site a while ago, but it didn’t even have the exporter, at least not in some visible form (button).
Do we really need “Advanced” in the title?
I assume the thread title is aspirational…? 
We are certainly still in need of basic / foundational malleable research, as well as more advanced levels, whatever that might look like.
OK so I think hopefully a few different different ways of starting a new notebook are possible now. As Lopecode is local-first I think uploading a file is the primary. Then you can also self-modify the notebook your are looking at, you can fork off a notebook you find from an at atproto address (because published notebooks are not guaranteed to contain the publish module but even if true you can use a different notebook to grab it) and then what @khinsen said, fork the current notebook but add a new blank module. You can achieve the last thing inside a notebook after a fork but I think its worth fast pathing that to get running quickly.
Only in the process I writing this I discovered the sign-in works even in an iframe. Probably forking should not require a signin as neither are actually publishing, I will maybe fix that (maybe not right now as it doesn’t seem fatal).
I tried starting from this entry point.
First observation: it requires a lot of authorizations! I understand it needs BlueSky access to make posts, but maybe I don’t want that? And why should Lopecode authenticate for other services?
Second observation: how do I start with a blank notebook?
live fork is essentially the analogy for the blank notebook option.
Lopecode has no concept of UI. So giving you a pre-baked notebook template is conceptually the wrong thing, because that presumes you want a specific set of userspace modules to support the notebook format (e.g. notebook renderer, the multi module layout, the editor, UI and then a blank template), and I don’t think that configuration will be a very stable long term, that blank notebook config will go out of date real fast.
Forking the current runtime and adding a module on the otherhand, is a composable abstraction from any starting condition, sort of regardless of what UI abstraction is in play. Without any centralised concept of lineage or authority I think this is the most conceptually honest option.
Yes auth should upgrade permissions when needed but thats more complex than what I want to do now so you jsut have to trust it will not post without signalling you. The Bluesky stuff is so we can reuse the social layer (likes, follows) without hosting it, its very cool atproto can do that.
I see the point, but I still don’t know what I am supposed to do get a blank notebook. The module that I need to specify is, if my understanding is right, something like the “notebook standard library”. It’s great to be able to choose that myself, but as a newbie I don’t have a personal module and I have no idea where I would get a good initial one from.
OK yes, its probably unnecessarily confusing. Live Fork is what you need. I have improved the language on what happens after you click that, and made you only fill in one text input now (the module id). Also you don’t need to authenticate for that step because a fork doesn’t require any network.
You have to name the module/notebook because its difficult to change later, I acknowledge thats asking a lot for a newcomer, but also its in-memory so the cost of a mistake is essentially zero. If I wanted to change the name of a module I would sed the exported file.
Now when you manage to fork, you open on the new module and other modules in the top are
I call them modules because they are Javascript ESM modules with a specific default export, but in the notebook format they are rendered as notebooks. I think I often exchange notebook for module which doesn’t help with understanding.
sidenote, the O.G. iframe containing Lopecode updates when I publish, probably that should be pinned as the conversation will go out of sync, and this is possible with at-proto I think, not got the lineage part in yet though.
Ahhh… thanks! Now I see that the “module” is just a name for something generated automatically. Before, my understanding was that it’s something I need to provide for creating a notebook.
The current version is much clearer. I still wonder what the handle is for, and if it should be a handle that is already registered somewhere, but I note that I can type any handle I want and it works, at least locally in my browser.
What I haven’t figure out so far is how I can save my new notebook after some edits. There is no “save” button, and I don’t see how I can add it myself.
After forking, you have a new Runtime with your extra module (notebook). At the top are some tabs, you now go back to the at-write notebook and publish the “The notebook open in this lopecode session”, which is also not very good wording as you are publishing the whole Runtime, not a specific notebook, which will pull along your new module (notebook) and your modifications with it and upload to ATProto. There are other tabs open as well, like exporter-3 which would allow you to download the runtime as a file.
I removed the BlueSky stuff as well. Quite cool you can downscope the permissions to something not social
Thanks! So now I can finally present to the public… my first… Lopecode notebook published via atproto:
No idea why it’s called “jashkenas-url-querystrings-and-hash-parameters”, but the universe will always retain some mysteries
Update: I saved the notebook again under a more reasonable title, and updated the link in this post.
Thats so cool! Your user #2 on the Lopefeed
It tries to guess the name from runtime and gets it wrong, you can customize it when you publish. If you regret publishing you can delete it from profile
very cool you have your own domain and that it works with that!
OK back on topic! We collaborated (just)!
So that is Lopecode, you almost hit the intro for the Tour notebook word-for-word! Observable-like notebooks that are just single static files, and now also can be shared on ATProto. You might hate my editor, but you can exporter and publish from ATproto direct from Observablehq.com too (Exporter 3 / Tom Larkworthy | Observable, Untitled / Tom Larkworthy | Observable). It is Observable notebook compatible.
I think the basic infrastructure is there now. I just need to make it more user friendly. You can help by filing bugs Issues · tomlarkworthy/lopecode · GitHub. I added LSP integration last week, but the mechanisms of editing is still wonky and bug ridden.
Often when I’m writing a post or reply with the Markdown editor, I wish for a workflow closer to literate programming where I can write code or diagrams as easily as writing words in natural language, without breaking my train of thought. For now, I’m trying to solve it by having a code editor and web browser side by side, and preparing a public domain and server to quickly deploy an HTML page; then I can link to a running code example, or make rough sketches to try ideas as we’re talking. But wouldn’t it be nice to solve that for all forum members somehow?
Ideally I’d love a unified interface to “write” by interweaving dynamic blocks with text, like we can with images, links, lists, tables. But I suppose that would mean extending Discourse, written in Ruby if I remember right. Maybe something like a shared Observable (or similar) notebook is more suitable, though that requires a server and database I imagine, not just static files.
When I was developing NegI, I came to realization that medium matter less than the meaning behind it. Like when we are talking about something, that something is a description of thoughts, rather than text being the ultimate truth. Basically I had to derive universal uniform protocol that describe any possible concept interaction. By that I mean that there are no “code” or “data” or “text”, only the “description” or “knowledge” that user manipulates via some interface (be it CLI or GUI).
