html5 - combine kineticjs and pixastic to apply image effect -

i'm trying use features pixastic libary , combine kineticjs. 1 of apply sepia effect in pixastic image created kineticjs.

i have jsfiddle setup here:

http://jsfiddle.net/skvju/28/

i thought following work:

function sepia() {     pixastic.process(darth, "sepia");     layer.draw(); } 

but image stays same. have missed or not possible combine both libraries together?

my guess can't apply pixastic function directly onto kinetic.image object, different regular image object.

alternatively, need grab original source of image, can run pixastic effects on image, , set kinetic.image object new affected image after.

function sepia() {   var sepia = pixastic.process(darth.attrs.image, "sepia");   darth.setimage(sepia);   layer.draw(); } 

here's full code: jsfiddle

note: you'll have run on local server, won't work on jsfiddle (the pixastic library can't loaded external resource, without cdn host)

2nd note: had declare var layer outside of imageobj.onload function, or else sepia() function not access layer inside imageobj.onload. can see how did in jsfiddle.