User Tools


Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
user_guide_website [2018/03/19 12:49]
z3dev [Install Locally]
user_guide_website [2018/06/12 14:00] (current)
z3dev [Install Locally]
Line 14: Line 14:
 The initial design is the JSCAD logo, which is created from the contents of the script shown in the editor. The initial design is the JSCAD logo, which is created from the contents of the script shown in the editor.
  
-{{ :wiki:477aa145-2903-4e65-beb6-476d6c7be5fa.jpeg?​nolink&​400 |}} +{{ :wiki:jscad_website_01.mp4 |Initial View}}
- +
-{{ :​wiki:​477aa145-2903-4e65-beb6-476d6c7be5fa.jpeg?​linkonly ​|}}+
  
 The view can be rotated, zoomed in or out, and moved by using the mouse buttons. (Or fingers if using a tablet or mobile phone.) The view can be rotated, zoomed in or out, and moved by using the mouse buttons. (Or fingers if using a tablet or mobile phone.)
Line 23: Line 21:
  
 The editor can be hidden or shown by clicking on the right hand tab. The editor can be hidden or shown by clicking on the right hand tab.
 +
 +//Note: Special keystrokes must be performed while using the editor.//
  
 There’s not much else to learn, as you are already using JSCAD. You may want to try a few of the examples, which can be found by clicking on //​Examples//​ in the info panel. There’s not much else to learn, as you are already using JSCAD. You may want to try a few of the examples, which can be found by clicking on //​Examples//​ in the info panel.
Line 28: Line 28:
 ==== Making Changes ==== ==== Making Changes ====
  
-  * changing parameters  +When browsing examples, the contents of the editor panel will also change. These are the actual designs, which were created by writing JSCAD scripts. The design can be changed by opening the editor, and changing ​any of the values, etc. 
-  changing ​designs+ 
 +Try it out. In the first example, change line 18. Update scale(10) to scale(5). Then hit RETURN+SHIFT. 
 + 
 +//Note: If the page fails to respond due to errors, just reload the website using your browser.//​ 
 + 
 +Some of the examples show a small panel on the lower left, which allows changes to the design ​parameters. For example, the example called "​Interactive Params: Servo Motor" allows different values for "Show plate"​. Change that to "​No"​ then hit the Update button. 
 + 
 +{{ :​wiki:​jscad_website_02.mp4 |}} 
 + 
 +**This is a unique feature of designs ​written in JSCAD. Any number of designs can be created by simply changing parameters.** 
 + 
 +Take the "​Interactive Params: Gear" example for a spin. Its really impressive, and fun. 
   * creating new designs   * creating new designs
  
Line 38: Line 50:
   * Importing other designs   * Importing other designs
   * Sharing designs   * Sharing designs
 +
 +The format of a file is determined from the file extension when importing designs, For example, JSCAD designs are stored as files with the .jscad file extension.
 +
 +When you start to edit directly using your browser, the default language is '''​JSCAD'''​.
  
 ==== Install Locally ==== ==== Install Locally ====
  
-There is no need to install anything. Just jump to the project website and start in.+There is no need to install anything. Just jump to the project website ​at [[http://​www.openjscad.org|www.openjscad.org]] ​and start in.
  
-However, for those who want more control, the website can be installed and used locally. The browsers of today can open locally installed or downloaded website content. And that means, you can download the project website and open the content, examples, etc. Here's how.+However, for those who want more control, the website can be installed and used locally. The browsers of today can open locally installed or downloaded website content. And that means, you can download the project website, view and explore ​the contentsread the examples, etc. Here's how. 
 +  - Download ZIP from [[https://​github.com/​jscad/​OpenJSCAD.org|GitHub]] 
 +  - Place the ZIP file into a directory 
 +  - Unzip the contents 
 +  - Open the folder called OpenJSCAD.org-master 
 +  - Then open index.html which is found in packages/​web
  
-To be written+For those with a little more technical background, the download can be down from the command line. 
 +  - cd <base directory>​ 
 +  - git clone https://​github.com/​jscad/​OpenJSCAD.org.git 
 +  - cd OpenJSCAD.org
  
 +install dependencies npm install
 +if desired, make the openjscad command refer to the code in this folder: npm link
 +if desired, start dev server: npm run start-dev
 ==== Integrate into a Website ==== ==== Integrate into a Website ====
  
 The website can be integrated into an existing website. The website can be integrated into an existing website.