Native WebRender COMP

It would be nice to have a more tightly integrated WebRender as a PanelCOMP to create UI’s without the need of the python interaction the WebRenderCOMP is using.

4 Likes

+1, also would be very nice if web render top/comp could easily utilize texture resources inside the active TOE,or at least load texture resources from disk in some non hackish way.

It would be so powerful if we could do these things, it’s essentially in some limited but useful ways like the Engine COMP except for panels, being that it’s a multi threaded system. :slight_smile:

Pushing this again in the hopes that maybe this can get some traction. I’m working more and more with webFrameworks and integrating them tightly with Touch. This leads to often building the UI twice. Once for the local user and once as the webUI.
Using the existing webRenderCOMP is possible but this feels kind of sluggish and not really responsive. Sometimes clicks do not get recognized and so forth.
I can also use the webbrowser python module to just start a seperate browser but lossing control and focus over the TD application.
Is this maybe a feature worth putting some pro-hours in? @lucasm You in?

1 Like

always! though I have not messed with the webRenderCOMP yet, so a bit behind the curve on some of the newest things.

webRenderCOMP? :pleading_face: Where are you seeing that?

I’ve been yearning for something as well that can put a TD UI into a LAN accessible webpage, but the key missing piece for me is displaying current TOP data easily.

The best option I’ve found is using the “return images” example in the WebServer DAT snippet (which won’t actually work on a native TD install, you have to add PIL somehow) for serving a TOP as an image in TD’s built in web server, and then having OpenStageControl display that <img src="random"> as an image in their UI that can be told to reload itself via an OSC command (aka without having to reload the rest of the web page)

This uses the least amount of extra software (just TD, OpenStageControl, and PIL installed with your handy OLIB tox) and is the most seamless and efficient way to get an image to a web UI since I can control when the image gets refreshed by only choosing to send an OSC ‘reload’ command when the TOP “cooks” in TD, but it still relies on python, external libraries, and also can not display a constantly moving / animating TOP image. Maybe a looping one if I were to export a gif from MovieFileOut TOP and then have that display in the OpenStageControl UI, but that’s even less streamlined and not instant.

Since most of my stuff is via a lighting console, for now I have an ugly hack involving old and buggy software that just sends my pixelmapping generator live previews to the lighting console via CITP/MSEX, but I would love to be able to display that on a web page for console operators to see on their own tablets / iPads or even computers (without having to install TD).

image

I don’t have pro support hours (maybe that’s why I don’t see a webRenderCOMP?) but I would gladly kick in to a Patreon / Kickstarter to make this happen, or maybe even finally get a pro license and throw my pro hours into that pool.

The webRenderCOMP is in the palette. but it is for rendering and interacting with webpages inside TD. Not the other way around . There is an RFE for webrtc support here ADDED: WebRTC Input/Output - #8 by raspberry402

+1 Using a web framework to build interfaces as a PanelCOMP would be awesome.

Thank you for your input. I was talking about the webBrowser Component. My bad.

Displaying images in TD got easier some time arround using the handy saveBytesArray function of tops (got introduced shortly after the webServerDAT). For that to work you just need to return
bytes( myTop.saveBytesArray(".jpg") )
This works totaly ok but can take some ressource power whith big images. Also realtime is somewhat possible (i got something running at 60 fps using websockets and sending the encoded bytedata) but this still relies on encoding every frame.

What I try to figure out is if it is currently possible to use the shared texture feature of the webRender top to feed images directly into the CEF (edit: it is not. This is only about how the image is transported from CEF to Touch.)
, but this would only work for the local mashine (which is fine by me, I only want to build UI using VUE :wink: )

@Achim def. good call. Gonna chime in there!

That sounds perfect for my purposes, all I’m trying to do is send 256x256 textures at like 15fps (which doesn’t work in my other mentioned method). Would you be willing to share the file you did with WebSockets? or at least point me in the right direction?

It’s been a while but the idea is to use saveBytesArray(‘.png’) to get the top as bytes, then use decode to get the byte as a base64 string. Send it via websockets and on server-side take the you can use the string the an img tag with I think

src=`data:image/png;base64,${string}`

2 Likes