Question

if i use this:

$(document).ready(function() {
    pjs = Processing.getInstanceById("EyeCanvas");
    console.log(pjs);
}

then pjs is always undefined

when i use this:

function test() {
    pjs = Processing.getInstanceById("EyeCanvas");
    console.log(pjs);
}

and trigger test() with a button then pjs = D.Processing, as it should be.

I load the scripts in this order:

    <script type="text/javascript" src="processing-1.3.6.min.js"></script>
    <script type="text/javascript" src="jquery1-7-1.js"></script>
    <script type="text/javascript" src="script.js"></script>

How can i work with pjs without have people to press a button?

Answer 1

Please try this – just to also see if it is a timing issue – note the swapped scripts too:

<script type="text/javascript" src="jquery1-7-1.js"></script>
<script type="text/javascript" src="processing-1.3.6.min.js"></script>
<script type="text/javascript" src="script.js"></script>

var tId,pjs,cnt=0;
$(document).ready(function() {
  tId=setInterval(function() {
    pjs = Processing.getInstanceById("EyeCanvas");
    console.log(cnt+':'+pjs);
    if (pjs) clearInterval(tId);
  },500);
});

and what does this say?

var tId,pjs,cnt=0;
$(document).ready(function() {
  pjs = Processing.getInstanceById("EyeCanvas");
  console.log(cnt+':'+pjs);
  if (!pjs) tId=setInterval(function() {
    pjs = Processing.getInstanceById("EyeCanvas");
    console.log(cnt+':'+pjs);
    if (pjs) clearInterval(tId);
  },500);
});