I've been working on a new Flash app recently. I ran into an interesting scenario where and I needed external ui components to monitor the app changes. After some trial and error I came up with the following:

The first step is to download a nifty class called EmbedObject here. It allows you to get the ID of the Flash embed object.

The next step is to create a class that will dispatch the event using an ExternalInterface call.

package {
 
import flash.external.*;
import com.asorg.browser.*;
 
public dynamic class JSEventDispatcher{
 
  public static function dispatchEvent(event:String):void{
 
    var script_js:XML = <script>
      <![CDATA[
        function(id,event){
           var flashObject = document.getElementById(id);
           var evObj = document.createEvent('Events');
           evObj.initEvent(event, true, true);
           flashObject.dispatchEvent(evObj);
        }
      ]]>
   </script>
    ExternalInterface.call(script_js, EmbedObject.getId(), event);
   }
  }
}

The JSEventDispatcher class has a static method called dispatchEvent. Embedded JavaScript gets a reference to the Flash embed object associated with the SWF and dispatches your event.

When you want to dispatch an event from your SWF you would simply call:

JSEventDispatcher.dispatchEvent('yourEvent');

The last step is to setup an event listener on your page that listens for the event.

<script language="JavaScript"type="text/javascript">
	function addListeners(){
		var flashObject = document.getElementById('yourEmbedObjectID');
  		flashObject.addEventListener('yourEvent',eventHandler,false);
	}
 
	function eventHandler(e){
	  	alert('fired')	
	}
</script>

NOTE! Be sure that the Flash object is instantiated before you attach the listener.

There you have it. Now your embed object will dispatch events sent by your SWF!