Question

I’m trying to use the following code:

$('#clicker').click(function(){
  var canvasRef = $('<canvas id="project_canvas"/>');
  var p = Processing.loadSketchFromSources(canvasRef, '/anything.pde');
  $('#loader').append(canvasRef);
});

To load a processing-js sketch using jquery / ajax and it’s doing something weird – trying to break up all the characters of /anything.pde throwing this error:

GET http://localhost:8888/a 404 (Not Found)
GET http://localhost:8888/n 404 (Not Found)
GET http://localhost:8888/n 404 (Not Found)
GET http://localhost:8888/y 404 (Not Found)
GET http://localhost:8888/t 404 (Not Found)
GET http://localhost:8888/h 404 (Not Found)
GET http://localhost:8888/i 404 (Not Found)
GET http://localhost:8888/g 404 (Not Found)
GET http://localhost:8888/p 404 (Not Found)
GET http://localhost:8888/d 404 (Not Found)
GET http://localhost:8888/e 404 (Not Found)

Any idea what’s going on?

Answer 1

Should be passes as an array:

var p = Processing.loadSketchFromSources(canvasRef, ['/anything.pde']);

As the name says loadSketchFromSources, Sources, you can pass multiple source as an array.