Collision Detection With Javascript, Canvas, And Alpha Detection

I'm currently working on a basic javascript game that has two sprites that are not to be collided together. However, basic bounding box collision won't suffice as there are portio

Solution 1:

Two things are wrong with this.

You made a function:

functioncreateImageData(image){...}

But what you are calling is:

spriteA.getImageData();
spriteB.getImageData();

The dot notates a property of an object. You were trying to call a function that was never part to the objects. There are some simple fixes.

add the createImageData() function to your constructor :

functionSprite(){
    ...
    this.createImageData = function(image){...};
    ...
}

or :

Sprite.createImageData = function(image{...};

or just call it correctly:

createImageData(spriteA.image); // or whatever the image is

Second, your function calls for an image parameter, but you aren't supplying one. Simply remember to supply the image when you call it. You could also remove the parameter and get the image from within the function.

Sort of like this:

functionSprite(){
    ...
    this.createImageData = function(){
        var image = this.image;
        // or just use this.image, or whatever it is
        ...
    }
    ...
}

Hope this helped.