Code-GUI bidirectional editing via LSP • Hacker News Board

Re: Code-GUI bidirectional editing via LSP

#51

Post by disconcision » Wed, Jul 02, 2025, 7:35 AM UTC

Here's a similar example using lean widgets (in the live programming part of the talk): https://www.youtube.com/watch?v=c5LOYzZx-0c

Re: Code-GUI bidirectional editing via LSP

#52

Post by phatskat » Wed, Jul 02, 2025, 7:46 AM UTC

jasonjmcghee wrote: post #8

Hey nice - this stuff is so much fun to me. I've worked a number of experiments like this too, especially related to live coding. Love seeing it in the wild. I built a small project where you can live-code Love2D. The running program updates in real time (no saving needed) and see all values update in real-time, via LSP. https://github.com/jasonjmcghee/livelove And also added the same kind of interactivity like a num…

I’ve been wanting to get into game programming and was looking at Love2D. I don’t know much Lua outside of what I’ve picked up with NeoVim configs.

This looks like it could be a great way to get my feet wet - I don’t do well with math and physics programming, but I used to make things in Flash back in the day that were similar to the particles demo and being able to quickly change things and see the updates makes it a lot easier for me to grok. Thanks for sharing!

Re: Code-GUI bidirectional editing via LSP

#53

Post by rjsw » Wed, Jul 02, 2025, 9:26 AM UTC

rao-v wrote: post #37

fwip wrote: post #11

Earlier quoted context omitted.

I don't think they change programs very often, and only very rarely in the middle of a project.

I think this maybe why! Of course it’s great for vendor lock-in. But given how many companies need to work with diverse suppliers, there must be a whole bunch of re-creating models happening. There is no chance that everybody is using the same CAD tool

The big example of this is Airbus on the A380 [1], design offices were using different versions of CATIA, we added some features to STEP to allow wiring harnesses to be modelled explicitly.

[1] https://en.wikipedia.org/wiki/Airbus_A380#Production_and_del...

Re: Code-GUI bidirectional editing via LSP

#54

Post by ogoffart » Wed, Jul 02, 2025, 10:20 AM UTC

czei002 wrote: post #49

ogoffart wrote: post #20

For Slint [ https://slint.dev ], a (native) GUI Toolkit, I've also developed a LSP server that do live preview and editing. You can try it online at https://slintpad.com : if you click on the toolbar button to enable the right panel, you can edit the properties from the UI, and this is all done through the LSP and can be integrated in any editor that supports it.

cool! how does this work? e.g. how do you know which UI element matches which text element, do you track it while rendering? How do you propagate changes in the UI? do you update the text and then re-render the whole UI?

I use the the code lenses of code action feature of the LSP so that the user can start a preview. The LSP server will then open a native window on desktop.

Every time the users do some change in the code, the editor sends the document and we re-render the preview.

I use the textDocument/documentHighlight request to know when elements are being selected from the code so I can highlight them in the preview.

When selecting an element in the preview UI, my LSP server sends a window/showDocument to position the cursor at the right location. And if the user changes property or do change in the file, we do a workspace/applyEdit command with the changes.

Btw, the code is there: https://github.com/slint-ui/slint/tree/master/tools/lsp

Re: Code-GUI bidirectional editing via LSP

#55

Post by [deleted] » Wed, Jul 02, 2025, 11:11 AM UTC

KRAKRISMOTT wrote: post #24

jasonjmcghee wrote: post #8

Hey nice - this stuff is so much fun to me. I've worked a number of experiments like this too, especially related to live coding. Love seeing it in the wild. I built a small project where you can live-code Love2D. The running program updates in real time (no saving needed) and see all values update in real-time, via LSP. https://github.com/jasonjmcghee/livelove And also added the same kind of interactivity like a num…

Isn't autocad lisp powered?

[deleted]

Re: Code-GUI bidirectional editing via LSP

#56

Post by cetinsert » Wed, Jul 02, 2025, 11:25 AM UTC

low_tech_punk wrote: post #22

rtcode_io wrote: post #14

See https://new.rt.ht for bidi i⇄o sync demos! The PDF ones are especially fun! The whole playground is built for bidi sync!

Wait, what is this?! It's really cool

See more at https://rtcode.io

Re: Code-GUI bidirectional editing via LSP

#57

Post by Bjartr » Wed, Jul 02, 2025, 12:43 PM UTC

I know it's not quite the same, and maybe it's just the demo video doing it, but this reminds me of the Light Table IDE http://lighttable.com/

Re: Code-GUI bidirectional editing via LSP

#58

Post by legobmw99 » Wed, Jul 02, 2025, 2:37 PM UTC

The idea of a language server also being some other kind of server is almost fiendishly clever to me and I'm shocked I hadn't seen other people play with this before. Definitely can think of applications to game programming -- a sufficiently dedicated engine team could fork their language's LS and allow you to e.g. integrate the map editor's feedback into the source code. I know hot-reloading is considered super valuable in games, but this is almost the dual of that idea. So clever!

Re: Code-GUI bidirectional editing via LSP

#59

Post by legobmw99 » Wed, Jul 02, 2025, 2:47 PM UTC

taeric wrote: post #18

Reminds me of the excitement I got on seeing https://www.youtube.com/watch?v=4tyTgyzUJqM . I still get excited about trying something like this again pretty much every time I see it. Have yet to really get any traction on anything. :( A lot of folks had fun watching Minecraft built using a live code session, if I recall.

Hot reload in Java is still a crucial part of my workflow for modding Minecraft, but it doesn't have the other direction where an action in the game could alter the code

Re: Code-GUI bidirectional editing via LSP

#60

Post by taeric » Wed, Jul 02, 2025, 3:18 PM UTC

legobmw99 wrote: post #59

taeric wrote: post #18

Reminds me of the excitement I got on seeing https://www.youtube.com/watch?v=4tyTgyzUJqM . I still get excited about trying something like this again pretty much every time I see it. Have yet to really get any traction on anything. :( A lot of folks had fun watching Minecraft built using a live code session, if I recall.

Hot reload in Java is still a crucial part of my workflow for modding Minecraft, but it doesn't have the other direction where an action in the game could alter the code

Ah, fair. Seems that is probably more applicable to image based development than it is typical batch processed source files? Doesn't seem too strange to have your code editing a data file, for example. No reason you couldn't treat your source as a data object, in some sense. Though, I'll note Common Lisp explicitly warns against editing literal objects. Such that I'm assuming this was considered and largely agreed to be a bad idea. :D