Trying to call one of my ember components functions, however I am getting the error: e-signature.js:28 Uncaught TypeError: this.testFunc is not a function
I have clearly declared the function, however. I am calling testFunc()
when the user presses their mouse (which is when the error is thrown). What is the issue?
Component.js
import Ember from 'ember';
export default Ember.Component.extend({
mousePressed: false,
lastX: 0,
lastY: 0,
ctx: null,
Draw(x, y, isDown) {
if (isDown) {
this.ctx.beginPath();
this.ctx.strokeStyle = $('#selColor').val();
this.ctx.lineWidth = $('#selWidth').val();
this.ctx.lineJoin = "round";
this.ctx.moveTo(this.lastX, this.lastY);
this.ctx.lineTo(x, y);
this.ctx.closePath();
this.ctx.stroke();
}
this.lastX = x; this.lastY = y;
},
InitThis() {
this.ctx = document.getElementById('myCanvas').getContext("2d");
console.log(this.ctx)
$('#myCanvas').mousedown(function (e) {
this.mousePressed = true;
this.testFunc();
this.Draw(e.pageX - $(this).offset().left, e.pageY - $(this).offset().top, false);
});
$('#myCanvas').mousemove(function (e) {
if (this.mousePressed) {
this.Draw(e.pageX - $(this).offset().left, e.pageY - $(this).offset().top, true);
}
});
$('#myCanvas').mouseup(function (e) {
this.mousePressed = false;
});
$('#myCanvas').mouseleave(function (e) {
this.mousePressed = false;
});
},
testFunc: function() {
console.log('testFunc');
},
didRender() {
console.log('eSignature didRender()');
this.InitThis();
},
actions: {
clearArea() {
// Use the identity matrix while clearing the canvas
this.ctx.setTransform(1, 0, 0, 1, 0, 0);
this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height);
}
}
});
Aucun commentaire:
Enregistrer un commentaire