javascriptxmlflashflashvars

xml file as flashvars in SWFobject

I have a flash file with an xml file as flashvars. when I use this code it works in every browser, but not in IE 7 or higher. 

OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
         codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
         WIDTH="530" HEIGHT="410" id="usa_locator" ALIGN="">
         PARAM NAME=movie VALUE="app_themes/theme1/usa_locator_demo.swf">
         PARAM NAME=FlashVars VALUE="app_themes/theme1/usa_locator.xml"> 
         PARAM NAME=quality VALUE=high>
         param name="wmode" value="transparent">
         PARAM NAME=bgcolor VALUE=#F5F5F5>
         EMBED src="app_themes/theme1/usa_locator_demo.swf?xmlfile1=app_themes/theme1/usa_locator.xml" quality=high  wmode="transparent" bgcolor=#F5F5F5  WIDTH="530" HEIGHT="410" NAME="usa_locator" ALIGN=""
         TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
EMBED>
        /OBJECT>

After reading a lot, SWFObject seem to be a good option. All u need to do is:

1- Include swfobject.js in header 2- Create an empty div for the flash object to be included

<div id="myContent">
  <p>Alternative content</p>
</div>

3- Embed the flash in the div via javascript:

<script type="text/javascript">
        swfobject.embedSWF("app_themes/theme1/usa_locator_demo.swf", "myContent", "530", "410", "6", false, **flashvars**);
    </script>

The only problem I have is: I don't know how to pass the flashvars via a url for an xml file. It seems to me that SWFObject does not support this. Instead, you need to create a list of flashvars as 

var flashvars = {
  name1: "hello",
  name2: "world",
  name3: "foobar"
};

and pass the variable to the javascript. The xml file i have is very large, and has many variables, I don't know how to do this. Please help.

My XML file is something like:

usa_map_locator>
config>
  color_state_name>0xffffff</color_state_name>
  color_state_name_over>0xffffff</color_state_name_over>
  type_of_gradient>1</type_of_gradient>
  background_color>0xffffff</background_color>
  show_links>0</show_links>
  light_effect>1</light_effect>
  border_color>0xffffff</border_color>
  sound>on</sound>
/config>


map_data>
state>
  id>1</id>
  name>Washington</name>
  link>#</link>
  comment>Address:
Phone:
E-mail:
  /comment>  
  color_map>0x7798BA</color_map>
  color_map_over>0x0054A6</color_map_over>
  frame>_top</frame>
  image>photo.jpg</image>
/state>
state>
  id>2</id>

..... for all 50 states

Solution

  • you should only need to do something like:

    var flashvars = { xmlfile1: "app_themes/theme1/usa_locator.xml" }

    What you would normally pass as the GET (that is, the flashvars) is a simple list of key/value parameters, and in that same spirit you convert that list to a key/value object in javascript.