@jscad/web: OpenJSCAD Web UI

This is the Web based UI for OpenJsCAD, either to host yourself, or use directly at https://openjscad.org/.



 

Table of Contents

- Usage
- Development
- Documentation
- Known issues
- Contribute
- Community
- Acknowledgements
- License
- Screenshots
- See also

Usage

$3

Go to OpenJSCAD.org (Tested browsers include Chrome, Firefox, Opera, Safari)

$3

``
cd base-directory-of-website
git clone https://github.com/jscad/OpenJSCAD.org
cd OpenJSCAD.org
cd packages/web . // this is where the web version is
cp ../examples ./examples // copy the examples here

`
And then access the contents via the URL of the web-site.
* index.html for the standard version
* viewer-minimal.html for the barebones viewer
* viewer-options.html for the 'all options' variant of the above


>NOTE: You might need configuration changes to allow access to the some of the contents (examples etc).

$3

`
install node.js > 6.0
cd base-directory-of-website
git clone https://github.com/jscad/OpenJSCAD.org
cd OpenJSCAD.org
npm run boostrap
cd packages/web . // this is where the web version is
cp ../examples ./examples // copy the examples here

modify the code as you see fit (see 'Adding new features the other modules in this repository' section)
`

#### Use of proxies for remote file loading:

if you want the capability , just like the official OpenJSCAD.org site, to load remote projects/files directly
from the web based user interface, but without the hassle with CORS issues,
you can use a proxy file (see remote.pl & remote.php):
this is a server side script that does the following
- caches the remote file locally on the server
- returns the local path to the downloaded file for OpenJSCAD to use

use and path of the proxy can be set by:
- changing the proxyUrl value in src/ui/index.js
- since this is hardcoded , if you do not use the provided dev server,
rebuild your main file (npm run build-web etc, see Development)


then you can use it like so:
https:///?uri=http://www.thingiverse.com/download:164128
or
https:///#http://www.thingiverse.com/download:164128

>Note: a PR with a node.js based proxy would be a welcome addition :)

Development

We offer pre-built versions of OpenJSCAD to be uses directly here :
- standard
- minimalist
- with options

but you can also rebuild them manually if you need :

- standard: `npm run build-web`
- minimalist: `npm run build-min`
- with options: `npm run build-opt`




$3


Since OpenJSCAD is made up of multiple dependent modules (csg.js, openscad-openjscad-translator etc),
the easiest method is to use `npm link` to have a 'live' updating development version of OpenJSCAD:
- create a base directory
- clone this repository `git clone https://github.com/jscad/OpenJSCAD.org.git`
- go into OpenJSCAD.org folder `cd OpenJSCAD.org`
- install dependencies & setup inter package links `npm run bootstrap`
- go into the web folder : `cd packages/web``
- if desired, start dev server: `npm run start-dev`

> Note : you can also change the code in all the other packages/xxx folders and it will also
impact the web ui (ie : if you make changes to packages/core in parts that are used in the Web Ui,
you do not need to run additional commands)

$3

Then, for example for CSG.js:
- go back to base directory `cd ..`
- clone CSG.js `git clone https://github.com/jscad/csg.js.git`
- go into OpenJSCAD.org folder again `cd OpenJSCAD.org`
- now type `npm link ../csg.js` to make @jscad/csg refer to local ../csg.js.

You can now make changes to the CSG.js code and see it impact your locally running
copy of OpenJSCAD live.

Documentation

- OpenJSCAD User & Programming Guide
- OpenJSCAD Quick Reference

Known Issues

There are a few known issues, please be sure to check this out before submitting additional bug reports/issues.

- Q: issues running certain npm commands like `npm run build-web`` with cnpm
- A: this is a know issue in cnpm , see issue #283 for more information

- Q: Attempting to use OpenJSCAD from file:// in Chrome results in errors like
"File Error: [EncodingError] Please check permissions error."
- A: This is a permissions issue in Chrome : restart chrome using the "--allow-file-access-from-files" option

Contribute

OpenJSCAD.org is part of the JSCAD Organization, and is maintained by a group of volunteers. We welcome and encourage anyone to pitch in but please take a moment to read the following guidelines.

Thank you to all the people who have already contributed to this project:

* If you want to submit a bug report please make sure to follow the Reporting Issues guide. Bug reports are accepted as Issues via GitHub.

* If you want to submit a change or a patch, please see the Contributing guidelines. New contributions are accepted as Pull Requests via GithHub.

* We only accept bug reports and pull requests on GitHub.

* If you have a question about how to use the OpenJSCAD.org, then please start a conversation at the OpenJSCAD.org User Group. You might find the answer in the OpenJSCAD.org User Guide.

* If you have a change or new feature in mind, please start a conversation with the Core Developers and start contributing changes.

Small Note: If editing this README, please conform to the standard-readme specification.

Community

See for more details
* G+ OpenJSCAD.org Announcements
* G+ OpenJSCAD Community
to discuss with other user and developers.

Acknowledgements

OpenJSCAD and its sub components are built upon great open source work, contribution & modules
- csg.js core & improvements by
Evan Wallace,
Eduard Bespalov,
Joost Nieuwenhuijse,
Alexandre Girard

For input/output
- xmldom
- sax

Tooling:
- browserify
- babel

and many more!

Backers

Thank you to all our backers! 🙏 [Become a backer]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]

License

The MIT License (MIT)
(unless specified otherwise)

Screenshots

Simple JSCAD example (logo.jscad) try it:

More sophisticated JSCAD example, with functions dedicated to object generation and with interactive parameters (gear.jscad) try it :

Import of STL models (frog-OwenCollins.stl) try it:

Drag & drop a local file:

Drag & drop multiple files (Chrome & Firefox) or a folder (Chrome):

See Also

- OpenJsCAD, starting point of OpenJSCAD.org
- OpenSCAD.net, another place of inspiration, where the OpenSCAD translator was adapted from
- CoffeeSCad, JavaScript simplified (no more {}) (defunct)
- stl2pov to convert .stl to .pov, and then render via PovRay.org
- P3D STL/AMF/OBJ viewer

That's all for now,

Rene K. Mueller, Jeff Gay, Mark Moissette & JSCAD Organization