FarmOS Timeline Viewer

Hi all. I’ve been messing around trying to do things I have no business doing using Claude terminal. One thing I think is both accessible and needed is more customized visualization and data input options for FarmOS.

We were working with Serena at Pasa, and she wanted to have a better interface for reviewing data that allowed her to see, in a timeline format, relationships between logs, plantings and fields.

So I decided to built a little single page web app using Claude. It’s very much a proof of concept, but it does work. It took me about 15 hours or so.

You can try it out, but you do need the Organizations module and at least one Organization which contains some assets. Also, check and make sure that your api actually has organizations–farm visible (mine did not). Lastly, your user should have API Access (the base users provided by FarmOS do, so those work). Writing this I’m realizing I could easily fix some of those issues… so yeah, next update I’ll make it so you don’t need organizations etc. as a requirement!

Anwyay, the app allows you to log in to a farmOS instance, select an organization, and then view the fields, plantings and logs associated with that organization.

Here’s a quick demo video also.

I think this kind of dovetails well with the AI conversation broadly (I’ve seen some other posts about it), it’s definitely something that’s coming as more people realize that they can actually do things without deep technical expertise (for better or for worse!).

Greg

3 Likes

Great quick visualization tool @gbathree - thanks for sharing!

For what it’s worth, here a couple of possible ways to get around the CORS issue you ran into, off the top of my head:

  1. Run your app locally with a proxy server (like you did! :tada:)
  2. Host the HTML+JS pieces on a public domain (eg: mydomain.com) and then add that domain to the “Allowed origins” config of the Consumer (aka OAuth2 client) that you’re connecting to in the farmOS Drupal admin UI at /admin/config/services/consumer (note this requires Drupal user 1 admin access).
  3. Another approach might be to package this into a module that gets installed on a farmOS server, and served directly from that domain. JS that is served from the same domain that it is accessing doesn’t need to worry about CORS. (Of course, this would also mean removing the “login” step where you pick a server to connect to).
  4. Lastly, I would be curious if this could be wrapped in Field Kit module or an Asset Link plugin. These have their own ways of dealing with CORS (via combinations of 2 and 3 above).

Also interesting to compare this with the farmOS-timeline visualization library we started building (which is used in the Crop and Grazing Plan modules)!

We ended up going with svelte-gantt as the base library for that, but curious to see what other options are out there! I hadn’t heard of vis-timeline before.

Thanks Mike - I didn’t realize that you used a JS based library, so definitely I’ll check it out. I have a question: the crop plan module currently applies to plan objects… but could you easily also use this for things other than plan objects, like actual logs and things?

I would happily use this for sure.

1 Like

Yes! That is the plan, in fact!

The next step in my own personal roadmap is to add a timeline at the top of every asset, to show a quick view of all logs associated with it! I started a draft PR a while back, but is far from complete…

1 Like

I was looking at other options, and there are some both gantt charts, but also just timeline charts, in markdown through Mermaid.

Timeline: This is an interesting option, less focused on accurate distances but organizes things cleanly and nicely: Timeline Diagram | Mermaid

GANTT View: This is the typical version Gantt diagrams | Mermaid

Seems well supported… still has dependencies but maybe better than all these libraries that keep dying, who knows.

1 Like

Ah yea! I came across Mermaid in my research too. Never got around to trying it out though. Looks promising!

I fooled with it… it’s not bad, but I have some requirements it can’t really do:

  1. Nested sections (so Fields have Plantings, Plantings have logs)
  2. More control over the vertical location of the log (or milestone)

I think actually after some fooling around, I may try to build something natively with D3. In short, none of the other open source libraries can ensure the kind of longevity and low-maintenance that I think we’d want, and generally it’s square peg round hole in terms of functionality.

It’s super powerful, been around literally forever, isn’t changing much, and now with Claude and a very good spec, I have a feeling I can get something that’s actually reasonable and probably even maintainable if I focus on long-term supported functions. Also, I can really make it farmos specific so I don’t need to skimp on functionality just to fit a particular library.

I think I’m going to give it a go. I’ll share it here if it comes out nice!

2 Likes

Posting updates as I go.

I found that I was getting CORS restrictions when trying to do auth from a local HTML file… apparently the browser says that’s a no no and there’s no fixing it.

So I turned this into a browser extension (in firefox or chrome, slightly different setup but largely the same code). That tells the browser basically ‘hey, as long as the user installs this extension and pushes a button, you can trust any code written in the extension’. This allows the user to auth once in the browser, and then do stuff in a simple web app.

Right now, the user logs in, selects a farm (there are many in this instance), then it loads each field as a separate timeline. Here’s my current visualization, by field, by farm.

I have many improvements to make, but just sharing as I go :slight_smile:

Mike suggested this is very Asset Linkable @Symbioquine and I agree. Thankfully the visualization code is kind of replicable wherever, but would maybe like to try that out after I’m done iterating here.

Overall, I could see this being a useful way for individuals to quickly and easily make small, single-page applications (custom reports, custom intake, etc.) and get them running quickly and locally without a lot of rigamarole.

2 Likes