AS3 Dispatch Custom Event from class to class

Question

I want to dispatch a custom event from the Country() sto the MenuButton();

CountryEvent

package  {
import flash.events.Event;

public class CountryEvent extends Event {

    public static const COUNTRY_HOVERED:String = "onCountryOver";

    private var _countryName:String = "";

    public function CountryEvent(type:String, countryName:String, bubbles:Boolean=true, cancelable:Boolean=false) {
        super(type, bubbles, cancelable);
        _countryName = countryName;
    }

    public function get countryName():String {
        return _countryName;
    }

    public override function clone():Event
    {
        return new CountryEvent(type,countryName,bubbles,cancelable);
    }
}

} Country Class

package 
{

    import flash.display.MovieClip;
    import flash.events.MouseEvent;
    import flash.events.Event;

    public class Country extends MovieClip
    {
        private var countryEvent:CountryEvent;


        public function Country()
        {
            this.addEventListener(MouseEvent.MOUSE_OVER,onMouseOver);
            this.addEventListener(MouseEvent.MOUSE_OUT,onMouseOut);
        }

        private function onMouseOver(e:MouseEvent):void
        {

                countryEvent = new CountryEvent("onCountryOver",this.name);

                dispatchEvent(countryEvent);

            }
        }

        private function onMouseOut(e:MouseEvent):void
        {

        }
    }

}

MenuButton Class

package  {

    import flash.display.MovieClip;
    import flash.events.MouseEvent;
    import CountryEvent;


    public class MenuButton extends MovieClip {

        public var countryName:String = "";

        public function MenuButton() {

            this.buttonMode = true;
            this.addEventListener(MouseEvent.MOUSE_OVER,onMouseOver);
            this.addEventListener(MouseEvent.MOUSE_OUT,onMouseOut);
            this.addEventListener(CountryEvent.COUNTRY_HOVERED,onCountryOver);
        }

        private function onCountryOver(e:CountryEvent):void {
            if(e.countryName == countryName) {
                this.gotoAndPlay(2);
            }
        }

        private function onMouseOver(e:MouseEvent):void {
            this.gotoAndPlay(2);

        }

        private function onMouseOut(e:MouseEvent):void {
            this.gotoAndPlay(11);
        }
    }

}

When a country is hovered a custom event is dispatched which I want the MenuButton to listen and if the parameter passed is the same as its name to get highlighted. The Country Class is the Base Class for my countries movieclips I have on stage and the MenuButton the Base Class for the menu button

It seems that the event never gets through

Thanks in advance

Answer 1

You have to make two modifications:

First, set your event bubbles property to true, so when a Country clip dispatches an event it will go up to the top level.

Then your MenuButtons should listen to stage, not to themselves. So when a Country dispatches an event it goes up to stage and can be caught by the buttons. If you want to listen to the stage you have to do a slight change in your code:

public function MenuButton() {

    this.buttonMode = true;
    this.addEventListener(MouseEvent.MOUSE_OVER,onMouseOver);
    this.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
    this.addEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
}

private function onAddedToStage(e:Event):void 
{
    removeEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
    stage.addEventListener(CountryEvent.COUNTRY_HOVERED,onCountryOver); 
}