Communicate with JavaScript, send-receive

Actually its quite simple to communicate with Javascript from Flash, simply by importing the externalInterface library. The following code displays a simple use, from which the Javascript "reads" the available space within the browser window and sends it to the flex application, which draws a panel to match this space, so you can have a full screen application no matter the screen resolution and/or browser...

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" viewSourceURL="srcview/index.html">

<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.*;
import mx.controls.*;
import flash.external.*;

public var w:uint;
public var h:uint;
public function callWrapper(event:MouseEvent):void
{

var jsWidth:String = "getWidth";
var jsHeight:String = "getHeight";
w = ExternalInterface.call(jsWidth);
h = ExternalInterface.call(jsHeight);
//testPanel.width=w/2;
//testPanel.height=h/2;
Alert.show(w.toString()+"*"+h.toString());
resizeMe.widthTo=w;
resizeMe.heightTo=h;
resizeMe.play();
}

public function original():void
{
resizeMe.widthTo=200;
resizeMe.heightTo=300;
resizeMe.play();
}
]]>
</mx:Script>

<mx:Resize id="resizeMe" target="{testPanel}"/>

<mx:Canvas height="100%" width="100%">

<mx:Button label="Expand!" click="callWrapper(event);" horizontalCenter="0"/>

<mx:Panel id="testPanel" width="200" height="300" backgroundColor="#BDE018" y="0" x="0" borderStyle="none">
<mx:Button label="Return" click="original();"/>
</mx:Panel>

</mx:Canvas>

</mx:Application>



add this 2 functions to your html that contains the produced .swf

<script language="JavaScript" type="text/javascript">

function getWidth() { return document.body.clientWidth; }
function getHeight() { return document.body.clientHeight; }

View working example here