EaselJS通过事件传递参数

Question

I am using Adobe Flash CC to create EaselJS output manipulating the HTML5 canvas. However there seems to be a massive oversight in the ability to pass parameters to event listeners.

The issue is that I offer multiple animation outputs for compatibility, one using EaselJS and one using Raphael , however the interface that controls these remains the same, these are plain HTML elements with data stored in attributes that I wish to call functions written in the Flash IDE by triggering events and passing parameters.

I could easily find ways to avoid using EventDispatcher such as registering them with the root object and calling them directly with custom handlers. However I would rather keep my Flash IDE output as universally compatible as possible and not pollute object's namespaces I have little control over. I consider it a bad design pattern to write code in the Flash IDE that won't work without external aid.

Is there a way to pass parameters from an EaselJS event dispatcher to the listening events? I know on() provides a data parameter but that is useless as I need to pass different parameters to the same event depending upon user interaction.

Answer 1

You can put any properties on an Event object that you want. When you dispatch an event, you can use a string like "complete" (which is better if you don't need parameters, since it won't generate an object if there are no listeners). If you have parameters, create a new createjs.Event , and put whatever properties on it that you want:

var event = new createjs.Event("complete");
event.time = new Date();
this.dispatchEvent(event);

Then you can inspect the event object in your handler.

myObject.addEventListener("complete", handler); // add a listener
function handler(event) {
    console.log(event.time);
}

Hope that helps!