index.template.html and its significance in Flex Project Development

I had posted a couple of posts earlier (the contextMenu based fullscreen & the fullScreenVideo) where it required you to edit the html wrapper in which the Flex App SWF is embedded. A lot of people came back to me saying that they still were getting the following error whenever they re-ran the app, even though they had edited the html source …

SecurityError: Error #2152: Full screen mode is not allowed.
at flash.display::Stage/set displayState()

So, I wanted to discuss here, why this error is occurring and also discuss a couple of things about html generation in FlexBuilder.

In FlexBuilder3, if you look at the project tree you will see a folder called “html-template“. This folder contains the following files..

  • AC_OETags.jsA JavaScript source file used by client to detect and embed the Flash Player
  • playerProductInstall.swf - This implements the Flash Player Express Install mechanism which comes into play if the client does not have the required player
  • index.template.html -HTML template that is used by the FlexBuilder to generate the wrapper html for all the application files in your project.

The error discussed in the beginning is caused by the last mentioned file. Whenever FlexBuilder compiles an app, it verifies the signature of the wrapper html to the index.template.html. if there are any variations, it recreates/overwites the html file to match the template.

So, any changes that you might have made on the html is lost whenever you run the application and hence the error. There are various ways of solving this.

  1. The easiest way out is to create your own wrapper html and use that instead of the default wrapper generated. You can copy the code and then extend it with your additions on it…
  2. The above way is recommended if your project has a lot of applications inside it. But, if your project hosts only one application and other files supporting it, it would be better for you to go ahead and edit your index.template.html itself, which would then reflect in your wrapper file without any hassles.

You can also read this post by Mike Morearty on “ Changing the filenames in Flex Builder html templates” which will provide some more insight into the html-template…

About these ads

2 Responses to index.template.html and its significance in Flex Project Development

  1. [...]  Update March 07 2008: A lot of people said they got a security error when they tried using the code above. Here is a post articulating the problem and the solution. [...]

  2. [...] Update March 07 2008: A lot of people have complained that they got a security error when they tried using the code above. Here is a post articulating the problem and the solution. [...]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.