Web Based Interface Ideas

[Levi-Armstrong]

This is to start the discussion around what direction we should go with a web based interface for Tesseract.

• React Ecosystem
  • React is a JavaScript library for building user interfaces. Its ecosystem includes tools for routing, state management, and server-side rendering.
    • React: Component-based library for building UIs. Developed by Facebook.
    • Next.js: Framework for React with server-side rendering, static site generation, and API routes.
    • Gatsby: React-based framework for building static websites with GraphQL.
    • Remix: Full-stack React framework focused on web standards and performance.
    • React Native: Framework for building mobile apps using React.
• Vue.js Ecosystem
  • Vue.js is a progressive JavaScript framework for building user interfaces, emphasizing simplicity and flexibility.
    • Vue.js: Core library for building UIs with reactive data binding.
    • Nuxt.js: Framework for server-side rendering and static site generation with Vue.js.
    • Quasar: Framework for building responsive, cross-platform applications with Vue.js.
    • Vuetify: Material Design component library for Vue.js.
• Angular
  • Angular is a comprehensive, opinionated framework maintained by Google.
    • Full-featured framework with built-in tools for dependency injection, routing, and state management.
    • Ideal for large-scale enterprise applications.
    • Provides powerful tools for two-way data binding and forms management.

[johnwason]

We developed PyRI which uses a Python based user interface based on Pyodide. It uses Vue for user interface elements. PyRI itself has a lot of useful features like scripting and data management. I am planning on working on the project this year and finishing the integration with Tesseract as the planner: https://github.com/pyri-project/pyri-core/blob/master/README.md It would be helpful if there was some code sharing with this project since I need to complete the user interface components for Tesseract anyway.

There is also the tesseract_viewer_python which is a Three.JS based viewer: https://github.com/tesseract-robotics/tesseract_python/tree/master/tesseract_viewer_python This does not have any user interface elements beyond displaying the scene and adding markers using the API.

[Simon248]

Just to add some ideas to the discussion,
I like the concept of having CAD semantic in IHM, ie. the ability to manipulate/select part, edges, surfaces to perform CAD operations.
It's not native when using mesh models. That's what Freecad / OpenCascade provide.

opencascade js is a port of opencascade in web browser (javascript) using WebAssembly technology.
An exemple of a nice use of occjs: cascade studio

RobotWebTools provide roslibjs to have ros2 on client/browser side.
As well as rosbridge to run on the server side.

[johnwason]

@Simon248 I have had similar ideas about using OpenCase for this purpose, but the main issue is that the meshes used for Tesseract are triangulated meshes and do not contain much detail. We would need something similar to step or parasolid files to make it work. ABB RobotStudio is capable of doing this type of operation on triangulated meshes, but I do not know how they are able to work around the lack of detail.