How do I dispatch a custom event from an actionscript 3 class and listen for it in the document root?

Question

I built a custom event dispatcher that passes variables. I dispatch the event and then I try to listen for the event in my document root, but I never receive the event. How do I bubble the event up to my document class?

addEventListener(CustomVarEvent.pinClicked, pinClickedHandler);

function pinClickedHandler(e:CustomVarEvent) {
  trace("main says " + e.arg[0] + " clicked");//access arguments array
 }

package zoomify.viewer
{
import com.maps.CustomVarEvent;
    protected function hotspotClickHandler(event:MouseEvent):void {
  var hotspotData:Hotspot = hotspotsMap[event.currentTarget] as Hotspot;
  trace(hotspotData._name + " was clicked");
  /*if(hotspotData) {
   navigateToURL(new URLRequest(hotspotData.url), hotspotData.urlTarget);
  }*/
  dispatchEvent(new CustomVarEvent("pinClicked",true,false,hotspotData._name));
 }
}
package com.maps
{
// Import class
import flash.events.Event;
// CustomVarEvent
public class CustomVarEvent extends Event {
 public static const pinClicked:String = "pinClicked";
 // Properties
 public var arg:*;
 // Constructor
 public function CustomVarEvent(type:String, ... a:*) {
  var bubbles:Boolean = true;
  var cancelable:Boolean = false;
  super(type, bubbles, cancelable);
  arg = a;

 }

 // Override clone
 override public function clone():Event{
  return new CustomVarEvent(type, arg);
 };
}

}

The pinClicked event that is being dispatched is nested two levels deep in classes. I add an instance of class ZoomifyViewer to the stage. ZoomifyViewer adds and instance of ZoomGrid to the stage and ZoomGrid dispatches the event.

When I add the same event listener and handler function directly into my ZoomGrid class (the same class that the event is dispatched from), then the listener and handler work properly. However, when the listener and handler are in a parent class or on the stage, I get no response.

Is a dispatcher necessary to bubble up to bubble up?

Also, are these two lines functionally identical based on the constant pinClicked that is defined in my CustomVarEvent?

 dispatchEvent(new CustomVarEvent(CustomVarEvent.pinClicked, hotspotData._name));

 dispatchEvent(new CustomVarEvent("pinClicked", hotspotData._name));

Answer 1

Events bubble up the display list. I cannot tell from your code sample what object you're dispatching the event from, only that you have a method on a class to do so. Has an instance of that class been added to the display list?

Answer 2

Bubbling only works when the object that dispatches the event is on the displaylist. Which is any grandchild of the stage.

That is properly your problem, but I can't see from code snippet if you add you dispatching class to the displaylist.

Also, it does not look like you made a custom EventDispatcher, but a custom Event. But I could be wrong (can't see all of your code).

Answer 3

Hello, In order to listen your custom event you should have a valid reference to the dispatcher in your document class.

yourDispatcher.addEventListener(CustomVarEvent.pinClicked, pinClickedHandler);

Where yourDispatcher is the class dispatching the custom event.

Answer 4

The event can only bubble up through the display list if the object that dispatched the event is a DisplayObject (or an ancestor of DisplayObject, such as a Sprite or MovieClip) so that it can be in the display list AND it is added to the display list at the time of the event dispatch.

The code you have written does not have the line that dispatches an event as part of a class at all, just a function in a package, so I'm not sure where you intend on it bubbling to.

A quick fix for you would simply to have the same object that was clicked have the event dispatched off of it, cuz since it was clicked it is obviously a display object that is on stage, which meets our two stipulations for bubbling.

package zoomify.viewer
{
    import com.maps.CustomVarEvent;

    protected function hotspotClickHandler(event:MouseEvent):void
    {
        // BY THE WAY, event.currentTarget will return the actual object, so you
        // don't need whatever the hotspotsMap[] thing is, just cast event.currentTarget
        /*var hotspotData:Hotspot = hotspotsMap[event.currentTarget] as Hotspot;*/
        var hotspotData:Hotspot = event.currentTarget as Hotspot;

        // here we dispatch the event off of the target, since it is definitely
        // in the display list already, so therefore bubbling will work right
        event.target.dispatchEvent(new CustomVarEvent("pinClicked",true,false,hotspotData._name));
    }
}