You are viewing archived messages.
Go here to search the history.

Josh Sunshine 2024-09-24 18:46:55

We just released Bloom, new way to create interactive diagrams and visual explanations. Creating interactive diagrams usually requires a programmer to write tedious event handling, collision detection, and tree update code. In Bloom, you simply tell the library what properties you want to maintain and the system does the hard work for you. Read this blog post to see cool example diagrams and learn more about Bloom.

Ivan Reese 2024-09-24 19:40:46

Oh that's super cool. Is it the same solver as used in Penrose, or something new? And, any plans to allow folks to use this without taking a dependency on React? Also… is this project open source? I couldn't find any links to view the source code.

Josh Sunshine 2024-09-24 21:30:25

Ivan Reese it's based on the same optimizer, but with one major tweak. If you run the vanilla Penrose optimizer, shapes that you are not interacting with tend to jump disconcertingly. We add what's called a "lasso term" so shape continuity is preserved during interaction.

Konrad Hinsen 2024-09-25 06:52:22

This looks great, something I have been wanting for years! Not just for the interactivity, the constraint-based diagram construction on its own is something I find very useful.

But... React? No. I need components that I can combine as I want. Anything forcing me to use a single master framework is too much of a constraint.

Joshua Horowitz 2024-09-25 08:52:37

Based on a quick look at the code, looks like it should be pretty easy (albeit undocumented) to use this without React.

Josh Sunshine 2024-09-25 15:38:02

You definitely do not have to use React. Konrad Hinsen what are you hoping to use it for? Would you be interested in talking to someone on our team to help you out?

Konrad Hinsen 2024-09-25 16:10:37

@Josh Sunshine My use case would be illustrations for scientific articles or courses. These illustrations would have to be embeddable in plain HTML pages, e.g. drawing on a canvas. A static export to SVG would be a plus, both for PDF exports and for people browsing without JS support.

Josh Sunshine 2024-09-25 19:14:21

If you are primarily interested in static diagrams then vanilla Penrose may be a better fit.

Konrad Hinsen 2024-09-26 07:54:31

I am interested in both!

Josh Sunshine 2024-09-26 13:48:57

Konrad Hinsen we don't currently provide an explicit SVG export/capture button. However, if you are viewing a website with a bloom interactive diagram, you can use the chrome developer tools to capture the current SVG source at any moment of interaction. That SVG source will be a "static SVG."

Konrad Hinsen 2024-09-26 19:20:43

@Josh Sunshine Thanks, that’s good enough for occasional use.

Nilesh Trivedi 2024-09-26 07:21:12

In this thread: Some demos shown at the FOC meetup in Bangalore yesterday (not everyone has joined this Slack yet):

Nilesh Trivedi 2024-09-26 07:22:38

Paras Chopra: Program synthesis via naive search and genetic algorithms, with/without leveraging abstractions

image.png

Nilesh Trivedi 2024-09-26 07:26:22

Adithya: Personal AI server (cloud-in-a-box)

image.png

Nilesh Trivedi 2024-09-26 07:27:50

Me: Implementing Eric Hehner's unified algebra

image.png

Nilesh Trivedi 2024-09-26 07:33:06

Ruturaj Mohite: Circuitverse: Web-based Digital Logic Circuit Simulator

image.png

Nilesh Trivedi 2024-09-26 07:39:16

Ishan Bhanuka: Semantic Code Search using Data flows

image.png

image.png

Nilesh Trivedi 2024-09-26 07:41:39

Advait: Remote-compute for video editors

image.png

Nilesh Trivedi 2024-09-26 07:46:40

Tagging @unnati patel**@Prabhanshu Gupta @Atharva Raykar @KS Sreeram** about their demos.

Nilesh Trivedi 2024-09-26 07:48:40

Shubhojit Basu: Agent-based swarm simulation with Love2D and Lua (and its use for EV battery swapping network optimization)

image.png

image.png

Maikel van de Lisdonk 2024-09-26 08:45:39

Very cool that there's a FoC meetup in Bangalore!

Prabhanshu Gupta 2024-09-26 14:02:48

My demo: An alternative formula language in spreadsheets (functions and frames!).

image.png

image.png

Kartik Agaram 2024-09-26 18:07:59

OMG, why have these projects been flying under the radar until now?! I need more companions on #devlog-together so people who are on the Slack: represent!

Arvind Thyagarajan 2024-09-28 18:09:17

(crosspost) a small tool, built live, at & for a small gathering:

💬 #in-india@2024-09-28

[September 28th, 2024 9:28 AM] arvind: Oh a little late but this is the small app built during the session using the Remix Studio node/wire editor. Couldn't quite finish it during the 3 minute lighting demo :joy: but here it is as intended. It is a little tool to say, "Hi I'm here", or "I'm raising my hand": https://remix.app/event/focjam|https://remix.app/event/focjam (ps: It should load as a native app clip if you're on iOS, I'm not, so I can neither confirm nor deny...)

The structure: • the runtime is housed in a webcomponent, and can run on web, in an appclip, in our native app, or as an embed anywhere you can stick a webcomponent • the "app" is a .remix executable, packaged from the visual code you saw in the demo • the interactions are brokered via a cloud service hosting agents (ok, API endpoints) also built visually and installed on cloud via a .remix file • Liveness comes from server sent events, a native primitive in our visual programming language Will share a build video separately on <#CCL5VVBAN|>

Arvind Thyagarajan 2024-09-28 18:15:08
  • the flow is a simple one: an entry screen where you pick a colour, icon, a few tags for yourself / the "room" where everyone hangs out / and an overlay to show you anyone's avatar/name/tags
  • this is the nodegraph for the "room" view: here you'll see the api calls to the service returning your profile and everyone else who's joined, some decision logic to show a different profile card, and navigation actions, etc.
  • everything is "data" so it can flow from node to node (live of course :-))
  • yellow lines are data, blue lines are cards, pink lines are action messages
  • there are lots of node primitives, like object, filter, lookup, join, database queries, card, component, decision, state machine, various actions like save, navigate, API calls, etc. etc. etc.
  • the "cloud agent" is a simple one, no params even in this case, it just queries the data store it's sitting in and returns all the records to the caller (which is in the view in #2 above)

image.png

image.png

image.png