Question

I’m using the following code listed in the processingjs docs to load an image onto the canvas. Because I’m using this in JS mode, I’m prefixing the Processingjs code with Processing object, e.i. the “processing.”

/* @pjs preload="laDefense.jpg"; */
processing.PImage b;
b = processing.loadImage("laDefense.jpg");
processing.image(b, 0, 0);

When I use this code, I get the following error:
“Uncaught SyntaxError: Unexpected identifier”

The Processingjs docs reference the following snippet for loadImage() (http://processingjs.org/reference/loadImage_/):

// @pjs preload must be used to preload the image 
/* @pjs preload="laDefense.jpg"; */
PImage b;
b = loadImage("laDefense.jpg");
image(b, 0, 0);

Does anyone know why I get this error?

I tried using the second listed snippet in the standard mode–in a .pde file, and it worked fine.

Answer 1

I am not understanding the purpose of prefixing with processing.. Typically straight processing style code is loaded via a .pde file or embedded in a html page. When you use the javascript mode in the processing ide, the former is being done for you. There is no need to add processing..

If you removed your prefixes, such as in the 2nd example, everything should work correctly in either the standard/java mode in processing or the javascript/processing.js mode.

The only things that you cannot use in processing.js are java specific calls and libraries. You can, however, mix and match javascript in your .pde file using processing.js which is common practice. You can also access the processing “sketch” from javascript, for example, to pass data from javascript/ajax/jquery/etc. You can find more inforamtion on this at Pomax’s Guide to Processing.js or on the Processing.js website.