Welcome to od|forum

Register now to gain access to all of our features. Once registered and logged in, you will be able to contribute to this site by submitting your own content or replying to existing content. You'll be able to customize your profile, receive reputation points as a reward for submitting content, while also communicating with other members via your own private inbox, plus much more! This message will be removed once you have signed in.

Sign in to follow this  
Followers 0
sebkaine

How to connect HTML5 / JS UI with Houdini

Hi Guys !

I was wondering if someone know how we could control houdini with a html5 / javascript UI.

Something similar to this :

http://www.sidefx.com/docs/houdini/hom/rpc

https://www.youtube.com/watch?v=n2G0phKUKnk

But with a javascript interface like this.

http://idflood.github.io/ThreeNodes.js/index_optimized.html#example/particle2.json

Thanks for your lights !

Cheers.

E

 

 

Share this post


Link to post
Share on other sites

whats your main target?

if you want to make a gui on top of houdini where you can create nodes and create setups i see the biggest challenge in the 3D viewport part. for the nodes you can get it thru the RPC or PYTHON as you noted.

if you want to edit some function in a hip file for that i can sent you a simple setup.  

Share this post


Link to post
Share on other sites

Use a web framework based on Python.

https://docs.python.org/2/library/xmlrpclib.html

There are many Python web frameworks to choose from depending on the complexity of the project.

https://wiki.python.org/moin/WebFrameworks

If you don't want to use Python you could simply open a port and pass whatever data you want but you'll have to do more legwork.

Share this post


Link to post
Share on other sites

Well guys thanks a lot for your feeback !

There is nothing really serious for the moment, but i was curious to know how we could connect houdini with a webgl canvas.

trigger write sop / read geo pop cache directly in a webgl canvas ... stuff like that.

basically at the core of this i guess the best bet is to rely on pyrpc and use python for the backend and js in the front end.

I have heard good thing about this one :

https://github.com/pallets/flask

or maybe node.js could also be an option ?

https://nodejs.org/api/child_process.html

 

EDIT 

Actually francis i've just realised that you are the guy who already make it work :)

 

 

 

Edited by sebkaine
1 person likes this

Share this post


Link to post
Share on other sites

yes, that's me :-)

i sent you the file hope it helps. :D

 

 

 

2 people like this

Share this post


Link to post
Share on other sites

Thanks a lot francis that's definitly great to have a starting point !

I would be curious to know what geo format you use with three.js ?

I'm tear apart beetween

- Three Json -> https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4

- glTF -> https://github.com/KhronosGroup/glTF

- sea -> https://github.com/sunag/sea3d

 

For the moment it looks that

- json support lot of feature but compression / size suck ,

- glTF 2.0 is the theoretical good choice , agnostic / webgl oriented / pbr etc ... but specs are not final and compression with Open3DGC is not implemented yet ... so still wip !

- sea looks at the moment the best choice, lot of supported features / best compression with Open3DGC / instancing support etc ... but need 3dsmax to export geo :(

Thanks again for your feedback guys !

 

Edited by sebkaine

Share this post


Link to post
Share on other sites

Custom implementation i guess ;)

For the mesh i like realy realy PLY it's easy to read and small. :D

But texture and specialy bones uffff thats a good challenge. Instancing i find not that hard (simple one).

When i have got some time i write the idea what i have got in my head. :ph34r:

 

Share this post


Link to post
Share on other sites

Thanks Francis !

Well .ply is a little too academic for me.

i would prefer to use a full equiped format with scene description / bones / morph etc ...

for the moment sea has the edge with all feature supported / best compression. But the Max exporter while working perfectly is really not sexy imo.

when i see this thread i'm also afraid glTF could become the next collada 

https://github.com/KhronosGroup/glTF/issues/696

the guys are debatting to support spec/gloss workflow, lot of big brain like cedric pinson / eric haines advise to support both metallic and specular but they doesn't look to listen so much ...

Share this post


Link to post
Share on other sites

sea3d looks very interesting i just haven't found the document specification.

only what i have found is this: http://community.poonya.com/152

it looks like they use FBX as base and then they convert it to sea3D thats fine for a file conversion but not ideal if you want to make streaming data on the fly.  

for gITF you have got at least a specification even when it's not final there is one. :rolleyes:

https://github.com/KhronosGroup/glTF/blob/master/specification/2.0/README.md

it looks like there is no c++ lib for export or i haven't seen one. for the FBX->gITF converter would be not the fastest path but for a prototype the way to go.

Share this post


Link to post
Share on other sites

If you want your JS UI run outside of Houdini, the way to go is a client/server REST approach. You have to write server side code to run in Houdini. Similar, you can write standalone server app running outside of Houdini and communicate with Houdini via hrpyc.

One more interesting approach I used in the past is using QtWebKit based widget to render HTML inside Houdini and using Qt Signals/Slots to fire events from JS callbacks. Works good, but only if you have access to JS source code, or write your own with this integration purpose in mind.

Edited by Stalkerx777

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0