javascript - Refactoring animation code into a class, receiving error on accessing class variable -
a similar different issue recent post of mine -
i'm experiencing error "cannot set property 'globalcompositeoperation' of undefined" when i'm trying access class variable inside prototype call. here code -
var drawslinky = function() { this.c = document.getelementbyid("c"), this.w = c.width, this.h = c.height, this.ctx = c.getcontext('2d'), this.prob = .7, this.minsparks = 3, this.maxsparks = 10, this.minarea = 5, this.maxarea = 40, this.minvel = 10, this.maxvel = 50, this.particles = [], this.frame = 0; }; drawslinky.prototype.anim = function(){ this.c.requestanimationframe(this.anim); this.ctx.globalcompositeoperation = 'source-over'; this.ctx.fillstyle = 'rgba(0, 0, 0, .04)'; this.ctx.shadowblur = 0; this.ctx.fillrect(0, 0, w, h); this.ctx.globalcompositeoperation = 'lighter'; ++frame; if(math.random() < prob) genparticles(); for(var = 0; < particles.length; ++i){ var part = particles[i]; part.use(); if(part.x < 0 || part.x > w || part.y < 0 || part.y > h || math.random() < .01){ particles.splice(i, 1); --i; } } };
what's going on?
it should referencing .ctx in drawslinky, i'm getting infinite loop of errors...
update - actually, 2 problems. 1 can't figure out how work without hardcoding this.requestanimationframe(drawslinky.anim);
(drawslinky instantiation of drawslinky class),
and two, this.cx.globalcompositeoperation = 'source-over';
isn't referencing ctx drawslinky , putting infinite loop.
so think need both, though second problem made question for
var me = this; this.c.requestanimationframe(function(){ me.anim(); });
the value of set when call function, not when declare it. more info here: https://stackoverflow.com/a/16063711/1641941 under variable
hope helps
Comments
Post a Comment