About
Projects
Photos
Links


Latest Blog Entries:
Flex, Javascript, IE
Posted: 2010-06-28 15:13:53

Earlier I was working on a project that required use of the ExternalInterface class in Flex that allows for Javascript communication. I have used it a few times before, but for some reason, I just couldn’t get it to work in IE...

It was working fine in Opera and Firefox, but IE kept passing a null value. I had an ID value and name for the object and embed tags respectively, the codebase was correct, still nothing. I even had the object and embed tag hardcoded on the page.

Finally, I ran across a post that mentioned another problem with IE and Flex/Javascript (IIRC, it was about Object does not support this method or property) that suggested using swfobject2. That fixed my issue null issue as well giving me the ability to send and receive values between Flex and Javascript.

Text Flow Images
Posted: 2009-11-28 16:45:28

The problem came up where I needed to figure out how to use Base64 embedded images within text layout format xml that would then be imported into a text flow.

My first attempts were trying to use the id attribute so that I could use getElementById(), then attempting to use the IConfiguration inlineGraphicResolver; at one point I even tried wrapping the whole thing into a span tag and trying to link that tag with a dictionary of the Base64 images. All of those didn't seem to do the trick, mainly because each time the inlineGraphicElement.graphic property was null, and, of course, that property is read only.

The way I finally was able to make it work was to use the event listener from the StatusChangeEvent. Immediately after the text flow is created (via the TextConverter.importToFlow), add in the event listener:
textFlow.addEventListener(StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGE, updateImages);

Then, the function updateImages:
private function updateImages(event:StatusChangeEvent):void
{
  var element:InlineGraphicElement = event.element as InlineGraphicElement;
  if(element.graphic != null && event.status != InlineGraphicElementStatus.READY)
  {
    var graphic:Loader = element.graphic as Loader;
    var source:String = element.source as String;
    if(source != null)
    {
      var subSource:String = source.substr(-4,4);
      if(subSource != ".jpg" && subSource != ".gif" && subSource != ".png" && subSource != "jpeg")
      {
        var decoder:Base64Decoder = new Base64Decoder();
        decoder.decode(source);
        graphic.loadBytes(decoder.toByteArray());
      }
    }
  }
  textFlow.flowComposer.updateAllControllers();
}

This solves the issue of the graphic element being null and at the same time will only replace the loader once (as it won't try to replace the whole thing again when the image status is ready). This will also allow regular paths to pass through without being turned into base64 strings, so that you don't just have to use one or the other.