@jwc/jscad-web

v1.10.2

Published

3 years ago

Web UI for OpenJsCAD

Downloads

0High
0Medium
0Low

johnwebbcole

@jscad/web: OpenJSCAD Web UI

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

Usage

Immediate Use (no installation)

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

Use within a Web Site (pre built files)

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
<start a web server 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).

Use within a Web Site (custom build)

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
<start a web server 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 :

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

Adding new features the other modules in this repository:

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)

Adding new features in CSG.js or other modules:

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

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

Tooling:

and many more!

Backers

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

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):

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme