Template:Jscad: Difference between revisions

From BITPlan Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(23 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<noinclude>
<noinclude>
= Usage =
= Usage =
Put your JSCAD code inside a source tag and add a call of this template
<pre>
<pre>
{{jscad|code=// title      : OpenJSCAD.org Logo
{{jscad|title=OpenJSCAD example|code=function main() {
// author    : Rene K. Mueller
    return CSG.cube();
// license    : MIT License
// revision  : 0.003
// tags      : Logo,Intersection,Sphere,Cube
// file      : logo.jscad
 
function main () {
  return union(
    difference(
      cube({size: 3, center: true}),
      sphere({r: 2, center: true})
    ),
    intersection(
      sphere({r: 1.3, center: true}),
      cube({size: 2.1, center: true})
    )
  ).translate([0, 0, 1.5]).scale(10);
}
}
}}
}}
</pre>
</pre>
== Example ==
= Example =
{{jscad|code=// title      : OpenJSCAD.org Logo
{{jscad|title=OpenJSCAD example|code=function main() {
// author    : Rene K. Mueller
    return CSG.cube();
// license    : MIT License
}  
// revision  : 0.003
// tags      : Logo,Intersection,Sphere,Cube
// file      : logo.jscad
 
function main () {
  return union(
    difference(
      cube({size: 3, center: true}),
      sphere({r: 2, center: true})
    ),
    intersection(
      sphere({r: 1.3, center: true}),
      cube({size: 2.1, center: true})
    )
  ).translate([0, 0, 1.5]).scale(10);
}
}}
}}
 
<pre>
[[Category:Template]]
</noinclude><includeonly>
{{#tag:html|
  <script src="/extensions/OpenJsCad/lightgl.js"></script>
  <script src="/extensions/OpenJsCad/csg.js"></script>
  <script src="/extensions/OpenJsCad/openjscad.js"></script>
   <style>
   <style>
pre, code, textarea {
pre, code, textarea {
Line 73: Line 34:
canvas { cursor: move; }
canvas { cursor: move; }
</style>
</style>
<link rel="stylesheet" href="/extensions/OpenJsCad/openjscad.css" type="text/css">
</pre>
<script>
[[Category:Template]]
  var gProcessor=null;
</noinclude><includeonly>
  // Show all exceptions to the user:
= {{{title|}}} =
  OpenJsCad.AlertUserOfUncaughtExceptions();
The preview below currently only works for older JSCad code using the CSG syntax. See [https://github.com/jscad/OpenJSCAD.org/issues/448 OpenJsCad Issue 448]
 
{{#tag:jscad|{{{code|}}}}}
  function renderJscad()
= Source code =
  {
Just cut&paste the source code below to https://www.openjscad.org/
    let viewer = document.getElementById("jscadviewer");
{{#tag:source|{{{code|}}}|lang=javascript}}
    gProcessor = new OpenJsCad.Processor(viewer);
[[Category:OpenJSCAD]]
    updateSolid();
  }
 
  function updateSolid()
  {
    gProcessor.setJsCad(document.getElementById('code').value);
  }
</script>
<div id='jscadviewer'/>
<input type="submit" value="Update" onclick="updateSolid(); return false;">
<textarea id='code'>{{{code|}}}</textarea>
</div>
<script>
  // call javascript in middle of page
  // https://stackoverflow.com/a/19869671/1497139
  renderJscad();
</script>
}}
</includeonly>
</includeonly>

Latest revision as of 08:37, 18 June 2019

Usage

{{jscad|title=OpenJSCAD example|code=function main() {
    return CSG.cube();
}
}}

Example

OpenJSCAD example

The preview below currently only works for older JSCad code using the CSG syntax. See OpenJsCad Issue 448 <jscad>function main() { 

   return CSG.cube();

}</jscad>

Source code

Just cut&paste the source code below to https://www.openjscad.org/ 

function main() {
    return CSG.cube();
}

  <style>
pre, code, textarea {
  font: 12px/20px Monaco, monospace;
  border: 1px solid #CCC;
  border-radius: 3px;
  background: #F9F9F9;
  padding: 0 3px;
  color: #555;
}
pre, textarea {
  padding: 10px;
  width: 100%;
}
textarea {
  height: 200px;
}
textarea:focus {
  outline: none;
}
canvas { cursor: move; }
</style>
Retrieved from "https://wiki.bitplan.com/index.php?title=Template:Jscad&oldid=9282"