WIP OpenSCAD live web editor + Three.js work around

classic Classic list List threaded Threaded
8 messages Options
Reply | Threaded
Open this post in threaded view
|

WIP OpenSCAD live web editor + Three.js work around

OpenSCAD mailing list-2
Hey,

Two things to go over here.

Firstly I'm working on a live OpenSCAD editor. Very much work in progress.
I understand OpenSCAD has seen many of these type of projects come and go, and probably the most well known is thingiverse customiser which is in a rather sad state atm.

So nothing new here, something worth mentioning though is it's is 100% openscad, it's not some re-implementation of the syntax in javascript, it's just running OpenSCAD serverside. Hopefully that will have two good outcomes
1) Should be 100% compatible with OpenSCAD scripts.
2) Hopefully it will stand the test of time as it should just be a matter of upgrading the OpenSCAD version (and even if CadHub dies, since I've dockerised it maybe someone else can use it)

Very much a work in progress, but you can see what's under construction at https://cadhub.xyz/dev-ide. (though often the first image load is quiet slow due to lambda cold start), there's also a video here (https://github.com/Irev-Dev/cadhub/issues/235)
If you play with it at all you'll notice something is off with the viewer which leads me to the next point.

I'm using openscad's image output instead of full render as I'm assuming that will remain quick at renders even with complex shapes? (since I assume it's just an output of the preview). So in order to still give it more of a real-time 3d feel, I want to allow rotating with the mouse as per the desktop version, but using a Three.js reference object so that the user can keep track of their orientation before I fetch a new openscad image. That's the idea but I'm currently having trouble converting between the rotation system of OpenSCAD and Three.js.

If anyone able to help with that last point I'm happy to take advise, but honestly I'm struggling more with Three.js's rotation system. (I've asked on their forum https://discourse.threejs.org/t/pointers-for-understanding-rotations/24223)

Other than that just wanted to let you all know what I'm working on.

Obviously something like this will always be inferior to the desktop version, but I hope it will be a handy way of sharing snippets, codepen style.

If anyone want's to see code, most of it was introduced in this pull request. https://github.com/Irev-Dev/cadhub/pull/228

Cheers,
Kurt


Sent from the OpenSCAD mailing list archive at Nabble.com.

_______________________________________________
OpenSCAD mailing list
[hidden email]
http://lists.openscad.org/mailman/listinfo/discuss_lists.openscad.org
Reply | Threaded
Open this post in threaded view
|

Re: WIP OpenSCAD live web editor + Three.js work around

mixotricha
I've been working away at something like this for years. After a couple of years of studying the code and understanding how things like Gold Feather work I have shifted my focus to some more core ( I would argue ) useful problems to do with things like MFPR / Parallaelization. Where I got up to was a web based front end that hands out constructive geometry tasks to a back end cluster and does some pipe line type stuff and some other optimizations. It was definitely faster but I have shelved it as I have come to see my implementation as flawed because of the web stuff involved. So I have quit stuff like Node and the Three.js and chucked all that out. Instead I've successfully managed to build the very basics of the interface in web assembly. That is Scintilla. The Qt basics of the Qt stuff. But I have halted this because as stated above I just come to see that some more core approaches need a rethink. And those core problems are not really OpenSCAD problems. OpenSCAD does what it was designed to do and in retrospect I think it is pretty good / excellent code. Just trying to say this path has been well walked already and this is what I have learned. 

On Wed, Mar 10, 2021 at 9:41 PM irevdev via Discuss <[hidden email]> wrote:
Hey,

Two things to go over here.

Firstly I'm working on a live OpenSCAD editor. Very much work in progress.
I understand OpenSCAD has seen many of these type of projects come and go, and probably the most well known is thingiverse customiser which is in a rather sad state atm.

So nothing new here, something worth mentioning though is it's is 100% openscad, it's not some re-implementation of the syntax in javascript, it's just running OpenSCAD serverside. Hopefully that will have two good outcomes
1) Should be 100% compatible with OpenSCAD scripts.
2) Hopefully it will stand the test of time as it should just be a matter of upgrading the OpenSCAD version (and even if CadHub dies, since I've dockerised it maybe someone else can use it)

Very much a work in progress, but you can see what's under construction at https://cadhub.xyz/dev-ide. (though often the first image load is quiet slow due to lambda cold start), there's also a video here (https://github.com/Irev-Dev/cadhub/issues/235)
If you play with it at all you'll notice something is off with the viewer which leads me to the next point.

I'm using openscad's image output instead of full render as I'm assuming that will remain quick at renders even with complex shapes? (since I assume it's just an output of the preview). So in order to still give it more of a real-time 3d feel, I want to allow rotating with the mouse as per the desktop version, but using a Three.js reference object so that the user can keep track of their orientation before I fetch a new openscad image. That's the idea but I'm currently having trouble converting between the rotation system of OpenSCAD and Three.js.

If anyone able to help with that last point I'm happy to take advise, but honestly I'm struggling more with Three.js's rotation system. (I've asked on their forum https://discourse.threejs.org/t/pointers-for-understanding-rotations/24223)

Other than that just wanted to let you all know what I'm working on.

Obviously something like this will always be inferior to the desktop version, but I hope it will be a handy way of sharing snippets, codepen style.

If anyone want's to see code, most of it was introduced in this pull request. https://github.com/Irev-Dev/cadhub/pull/228

Cheers,
Kurt


Sent from the OpenSCAD mailing list archive at Nabble.com.
_______________________________________________
OpenSCAD mailing list
[hidden email]
http://lists.openscad.org/mailman/listinfo/discuss_lists.openscad.org


--
Damien Towning
CEO / Developer 
http://makertron.io
 

_______________________________________________
OpenSCAD mailing list
[hidden email]
http://lists.openscad.org/mailman/listinfo/discuss_lists.openscad.org
Reply | Threaded
Open this post in threaded view
|

Re: WIP OpenSCAD live web editor + Three.js work around

nophead
OpenScad's camera only changes X and Z angles and Y is always 0.

Not true, you can rotate around Y by holding shift when dragging with the mouse.

On Wed, 10 Mar 2021 at 11:00, Damien Towning <[hidden email]> wrote:
I've been working away at something like this for years. After a couple of years of studying the code and understanding how things like Gold Feather work I have shifted my focus to some more core ( I would argue ) useful problems to do with things like MFPR / Parallaelization. Where I got up to was a web based front end that hands out constructive geometry tasks to a back end cluster and does some pipe line type stuff and some other optimizations. It was definitely faster but I have shelved it as I have come to see my implementation as flawed because of the web stuff involved. So I have quit stuff like Node and the Three.js and chucked all that out. Instead I've successfully managed to build the very basics of the interface in web assembly. That is Scintilla. The Qt basics of the Qt stuff. But I have halted this because as stated above I just come to see that some more core approaches need a rethink. And those core problems are not really OpenSCAD problems. OpenSCAD does what it was designed to do and in retrospect I think it is pretty good / excellent code. Just trying to say this path has been well walked already and this is what I have learned. 

On Wed, Mar 10, 2021 at 9:41 PM irevdev via Discuss <[hidden email]> wrote:
Hey,

Two things to go over here.

Firstly I'm working on a live OpenSCAD editor. Very much work in progress.
I understand OpenSCAD has seen many of these type of projects come and go, and probably the most well known is thingiverse customiser which is in a rather sad state atm.

So nothing new here, something worth mentioning though is it's is 100% openscad, it's not some re-implementation of the syntax in javascript, it's just running OpenSCAD serverside. Hopefully that will have two good outcomes
1) Should be 100% compatible with OpenSCAD scripts.
2) Hopefully it will stand the test of time as it should just be a matter of upgrading the OpenSCAD version (and even if CadHub dies, since I've dockerised it maybe someone else can use it)

Very much a work in progress, but you can see what's under construction at https://cadhub.xyz/dev-ide. (though often the first image load is quiet slow due to lambda cold start), there's also a video here (https://github.com/Irev-Dev/cadhub/issues/235)
If you play with it at all you'll notice something is off with the viewer which leads me to the next point.

I'm using openscad's image output instead of full render as I'm assuming that will remain quick at renders even with complex shapes? (since I assume it's just an output of the preview). So in order to still give it more of a real-time 3d feel, I want to allow rotating with the mouse as per the desktop version, but using a Three.js reference object so that the user can keep track of their orientation before I fetch a new openscad image. That's the idea but I'm currently having trouble converting between the rotation system of OpenSCAD and Three.js.

If anyone able to help with that last point I'm happy to take advise, but honestly I'm struggling more with Three.js's rotation system. (I've asked on their forum https://discourse.threejs.org/t/pointers-for-understanding-rotations/24223)

Other than that just wanted to let you all know what I'm working on.

Obviously something like this will always be inferior to the desktop version, but I hope it will be a handy way of sharing snippets, codepen style.

If anyone want's to see code, most of it was introduced in this pull request. https://github.com/Irev-Dev/cadhub/pull/228

Cheers,
Kurt


Sent from the OpenSCAD mailing list archive at Nabble.com.
_______________________________________________
OpenSCAD mailing list
[hidden email]
http://lists.openscad.org/mailman/listinfo/discuss_lists.openscad.org


--
Damien Towning
CEO / Developer 
http://makertron.io
 
_______________________________________________
OpenSCAD mailing list
[hidden email]
http://lists.openscad.org/mailman/listinfo/discuss_lists.openscad.org

_______________________________________________
OpenSCAD mailing list
[hidden email]
http://lists.openscad.org/mailman/listinfo/discuss_lists.openscad.org
tp3
Reply | Threaded
Open this post in threaded view
|

Re: WIP OpenSCAD live web editor + Three.js work around

tp3
In reply to this post by OpenSCAD mailing list-2
On 10.03.21 11:40, irevdev via Discuss wrote:
> I understand OpenSCAD has seen many of these type of projects
> come and go, and probably the most well known is thingiverse
> customiser which is in a rather sad state atm.

Indeed. I'm even more sad the emscripten based solution died.
I really would like to see that happening at some point again.
Not as replacement for the Desktop version but as useful extra
way of generating (simpler?) models.

> 2) Hopefully it will stand the test of time as it should just
> be a matter of upgrading the OpenSCAD version (and even if
> CadHub dies, since I've dockerised it maybe someone else can
> use it)

This may also open the option of defining versions to run the
scripts against. I really love the way https://godbolt.org/
does that for a huge list of compilers.

> I'm using openscad's image output instead of full render as
> I'm assuming that will remain quick at renders even with
> complex shapes? (since I assume it's just an output of the
> preview).

Yes, it should in normal cases. I wonder if it would help to
have some defined resolution limit to prevent trivial attacks
just setting $fn to huge values. It probably will still need
some time threshold.

I don't know too much about Three.js, but there's a branch
working on using a newer CSG code path in CGAL which is much
faster in most cases. So maybe there's more chance generating
the actual mesh.

> If anyone want's to see code,

Yep, I certainly do :-). I'll think about options to maybe
also put up a related topic for Google Summer of Code which is
just starting this years instance.

ciao,
  Torsten.

_______________________________________________
OpenSCAD mailing list
[hidden email]
http://lists.openscad.org/mailman/listinfo/discuss_lists.openscad.org
-- Torsten
Reply | Threaded
Open this post in threaded view
|

Re: WIP OpenSCAD live web editor + Three.js work around

OpenSCAD mailing list-2
Sorry I'm a bit slow to replying again to this thread. I was head down trying to get the coordinate systems synced between OpenSCAD and Three.js. I've had success, definitely still problems which I've got some questions about but really happy with the feel of the UI so far. Even though it's not real time I think it's a really good compromise. There's a video of where its up to in this PR https://github.com/Irev-Dev/cadhub/pull/238 or again you can play with it at https://cadhub.xyz/dev-ide.

Rotation seems to be working perfectly, and I've got the fov matched between the two as well. What's not working is when you "move" the model (with right click drag) the axes get separated. I thought this might just be a scaling issues, but nothing I've tried is working with the exception of using very low values of the camera dist ie --camera=${px},${py},${pz},${rx},${ry},${rz},5  the last number 5 or less, but doing so seems to effect the distance at which objects remain in view, so it's really not practical to use such low numbers, anyone have any insight or ideas with this?

>I've been working away at something like this for years. After a couple of years of studying the code and understanding how things like Gold Feather work I have shifted my focus to some more core ( I would argue ) useful problems to do with things like MFPR / Parallaelization. Where I got up to was a web based front end that hands out constructive geometry tasks to a back end cluster and does some pipe line type stuff and some other optimizations. It was definitely faster but I have shelved it as I have come to see my implementation as flawed because of the web stuff involved. So I have quit stuff like Node and the Three.js and chucked all that out. Instead I've successfully managed to build the very basics of the interface in web assembly. That is Scintilla. The Qt basics of the Qt stuff. But I have halted this because as stated above I just come to see that some more core approaches need a rethink. And those core problems are not really OpenSCAD problems. OpenSCAD does what it was designed to do and in retrospect I think it is pretty good / excellent code. Just trying to say this path has been well walked already and this is what I have learned.

A full web-deployable openscad, sounds epic.
Currently my approach is to have a very light touch, wrapping openscad with some web technologies to get it on the web with minimal effort and no changes to openscad, I'm optimising for being able to easily upgrade with new versions of the software, thanks for the insight.

>Not true, you can rotate around Y by holding shift when dragging with the mouse.

Oh okay, good to know.

> I'm even more sad the emscripten based solution died.

Oh I didn't know about this :(

> This may also open the option of defining versions to run the
scripts against. I really love the way https://godbolt.org/
does that for a huge list of compilers.

I don't think I follow, versions of openscad to run scripts against?

> Yes, it should in normal cases. I wonder if it would help to
have some defined resolution limit to prevent trivial attacks
just setting $fn to huge values. It probably will still need
some time threshold.

So I'm planning on just going with timeout to begin with, I don't want to start parsing the code if I can avoid it, but if there were some way of limiting max $fn in the command line, that would be very useful.

> I don't know too much about Three.js, but there's a branch
working on using a newer CSG code path in CGAL which is much
faster in most cases. So maybe there's more chance generating
the actual mesh.

Oh awesome, I'll keep an eye on that.

> Yep, I certainly do :-). I'll think about options to maybe
also put up a related topic for Google Summer of Code which is
just starting this years instance.

Did you have much of a look. I'm happy to even jump on a call to give a bit of an overview to anyone if that's useful. I'm using node to run the command line, partly because it's what I'm best at and I want to keep the CadHub repo all one language where possible.
Keep me in the loop with the summer of code stuff and if I can be of assistance.

Sent from the OpenSCAD mailing list archive at Nabble.com.

_______________________________________________
OpenSCAD mailing list
To unsubscribe send an email to [hidden email]
Reply | Threaded
Open this post in threaded view
|

Re: WIP OpenSCAD live web editor + Three.js work around

kintel
Administrator
This looks nice!

I’m not sure how useful this is, but I’ve shared some code I had lying around that implements a light-weight OpenSCAD customizer UI in Javascript as an Angular app.
Feel free to use any of this code if you find it useful: https://bitbucket.org/shapefactory/scad-web

 -Marius
_______________________________________________
OpenSCAD mailing list
To unsubscribe send an email to [hidden email]
Reply | Threaded
Open this post in threaded view
|

Re: WIP OpenSCAD live web editor + Three.js work around

OpenSCAD mailing list-2
Thanks Kintel, Glad you like it 😁

Thanks for the link. I had a quick go at getting the app running to have a poke around, but I don't have the time right now to get mongodb setup locally. I'll try and get back to it though.

Sent from the OpenSCAD mailing list archive at Nabble.com.

_______________________________________________
OpenSCAD mailing list
To unsubscribe send an email to [hidden email]
Reply | Threaded
Open this post in threaded view
|

Re: WIP OpenSCAD live web editor + Three.js work around

kintel
Administrator
You may not need to run it, just pick out the javascript pieces that manage customizer variable extraction. I believe all that was done directly in the browser anyway, although I may be wrong..

 -Marius

On Mar 12, 2021, at 15:22, irevdev via Discuss <[hidden email]> wrote:

Thanks Kintel, Glad you like it 😁

Thanks for the link. I had a quick go at getting the app running to have a poke around, but I don't have the time right now to get mongodb setup locally. I'll try and get back to it though.

Sent from the OpenSCAD mailing list archive at Nabble.com.
_______________________________________________
OpenSCAD mailing list
To unsubscribe send an email to [hidden email]


_______________________________________________
OpenSCAD mailing list
To unsubscribe send an email to [hidden email]