Confirm
656
edits
Changes
→Ways to Use Processing.js
Processing.js was originally created in order to allow existing Processing developers and existing Processing code (often referred to as ''sketches'') to work unmodified on the web. As a result, the recommend way to use Processing.js is to write Processing code, and have Processing.js convert it to JavaScript before running it.
Over time, many web developers have begun using Processing.js, and asked that we design a way for the API to be used separate from the Processing language itself. Therefore, we have provided a way for JavaScript developers to write pure JavaScript code and still use the Processing.js functions and objects. NOTE: Processing.js is first and foremost a port of Processing to the open web, with design decisions favouring compatibility with Processing. It was not designed as a general purpose HTML drawing library. Having said that, it can be used as a high-level drawing API for canvas.
Below we discuss the various methods for using Processing.js in your web pages.
</pre>
Processing.js will automatically scan the document on page load for <canvas> elements with '''data-processing-sources''' attributes, download the files using XMLHTTPRequest, and feed them to the Processing-to-JavaScript translator. The resulting JavaScript is run using eval.
===Pre-compiling Processing code to JavaScript===
====Mixing JavaScript and Processing====
The previous example kept a clean separation between the JavaScript and Processing code, while loosening the boundary between the two. Because Processing.js converts Processing code to JavaScript, it's also possible to mix them directly. The Processing.js parser will leave JavaScript it finds within the Processing code unaltered, allowing developers to write a hybrid of Processing and JavaScript(NOTE: this is why we don't use a pure Processing parser approach in processing.js). Here is the previous example rewritten using this method:
<pre>
