javascript - Add new canvas context method -

i use following code make sure resettrasform method available canvas.

if (!canvasrenderingcontext2d.prototype.resettransform) {     canvasrenderingcontext2d.prototype.resettransform = function() {         canvasrenderingcontext2d.prototype.settransform(1, 0, 0, 1, 0, 0);     }; } 

formerly, used use

var canvas      = document.getelementbyid("canvas"); var context     = canvas.getcontext("2d");  if (!context.resettransform) {     context.resettransform = function() {         context.settransform(1, 0, 0, 1, 0, 0);     }; } 

but depends on variable context. if name differently, following code wouldn't work, or i'd have modify if statement.

anyway, using prototype approach want define method. tried following

canvasrenderingcontext2d.prototype.newblankframe = function() {     canvasrenderingcontext2d.prototype.resettransform();     canvasrenderingcontext2d.clearrect(0, 0, canvas.width, canvas.height); }; 

but doesn't work. throws error

uncaught typeerror: illegal invocation 

at canvasrenderingcontext2d.prototype.resettransform();

also if remove canvasrenderingcontext2d.prototype.resettransform(); , use canvasrenderingcontext2d.clearrect(0, 0, canvas.width, canvas.height);, still throws error: uncaught typeerror: canvasrenderingcontext2d.clearrect not function.

i want have method that'll remove transform , clear canvas. make this

var canvas      = document.getelementbyid("canvas"); var context     = canvas.getcontext("2d");  context.newblankframe = function() {     context.resettransform();     context.clearrect(0, 0, canvas.width, canvas.height); }; 

but this, said before, dependent on variable name. there way make work using prototype? want method available canvas context.

both methods missing context in have called. can fixed using this keyword refers canvas context trying manipulate.

if (!canvasrenderingcontext2d.prototype.resettransform) {     canvasrenderingcontext2d.prototype.resettransform = function() {         this.settransform(1, 0, 0, 1, 0, 0);     }; }  canvasrenderingcontext2d.prototype.newblankframe = function() {     this.resettransform();     this.clearrect(0, 0, this.canvas.width, this.canvas.height); // canvas of context }; 

here little fiddle show can call methods on context now. http://jsfiddle.net/87ac5j8w/