html5 - Pulling variables/data out of a processing sketch in a canvas to javascript so I can trigger page functions with those variables -

i making simple app user logs in , sent screen must tap button fast can 30 seconds. using processing create sketch button in on regular html page using canvas element. have tried linking processing file , have tried putting code right . both produce valid results in terms of placing sketch onto page.

i have spent hours searching , attempting solutions processing.js , javascript, none of searches explain how use data/variables inside sketch trigger/store them outside of sketch in javascript on same page.

the goal when timer inside sketch hits "0" user sent scoreboard page , asked if want submit score , if want play again.

since not know how access timer or score variables outside of sketch, cannot send user next page automatically or store scores.

i have working web page sketch @ http://rwmillerdesigns.com/im215/final/game.html , have been able put app on iphone use of phonegap.

here way have put sketch page:

<canvas id="processing" data-processing-sources="processing.pde" width="300" height="350" tabindex="0" style="image-rendering: -webkit-optimize-contrast !important;">                         <p>your browser not support canvas tag.</p>                         <!-- note: can put alternative content here. -->                     </canvas> 

if have questions on else doing, please feel free ask!

one thing have done go processingjs.org , found out have irc channel have asked immediately, instead of spending hours =) sketches don't expose variables, functions, have either a) write getters variables javascript should pull sketch, or b) bind window sketch variable called javascript, , make sketch call javascript functions right variables function arguments. see how latter (in way keeps sketch working in js java mode), see http://processingjs.org/articles/pomaxguide.html