I'm using prototypal inheritance with a Circle and Square object both inheriting from a RootShape object. I am using EaselJS and am not sure if the behavior I'm encountering is specific to prototypal inheritance, the EaselJS library, or a mix of the two.
You can see my problem illustrated here: http://fiddle.jshell.net/sdg9/UNY6E/
When I add an event listener (specifically a pressmove
listener) to the Circle or Square prototype it works as I'd expect. All circle objects respond to the circle prototype listener and all square objects do likewise with the square prototype listener.
When I add an event listener to the RootShape
prototype that both Circle and Square inherit from I encounter a strange behavior. The Square events trigger Circle listeners and vice versa. In fact all 3 listeners (on RootShape
, Circle
, and Square
) are triggered. I didn't think objects further down the prototype chain would conflict this way. Is there an alternative approach I can take to have an eventListener
on the RootShape
object and not cause the Square and Circle to trigger each other's listeners?
It seems that all the event listeners you defined are added to your RootShape prototype instead of each sub-prototypes. A solution would be to add the event listeners when you initialize each sub-prototypes.