AJAX type of call for Flash 1

[d0nny]

OK, I've played around with this for too long now, so I'm hoping I'll get some expert advice here. ;-)

What I have is a page that loads with a large top banner on it (large image across the page), then in the main body I have 3 thumbnails.
When any of the thumbnails is clicked, I want to dynamically load a Flash SWF into the same area as the image and start the 'movie'.
The movie itself is loaded as such...

<script type="text/javascript">
     var flashvars = {xmlFile:"xml/traditional.xml"};
     var params = {};
     params.menu = "false";
     params.quality = "high";
     var attributes = {};
     swfobject.embedSWF("Banner.swf", "header", "1024", "411", "9.0.0", false, flashvars, params, attributes);
</script>

and this uses the swfobject.js script.
As you can see, this loads an XML which details the images to scroll round the flash gallery, and the Banner.swf which loads into the container 'header'.

The problem I have is that I need to load 3 separate Flash movies (although the Banner.swf would be constant, just a different XML) and I need them loaded AJAX style.

Any help?

 

[d0nny]

Sorry, just realised I probably only gave you half the information!

I'm trying to load the different flash galleries in separate include files like this:

<a href="javascript:ajaxpage('o_header_trad.inc.php', 'header');"><img src="../images/image_1.gif" border="0"></a>

And here's my 'ajaxpage' function...

var bustcachevar=1
var loadedobjects=""
var rootdomain="[URL unfurl="true"]http://"+window.location.hostname[/URL]
var bustcacheparameter=""

function ajaxpage(url, containerid){
     var page_request = false
     if (window.XMLHttpRequest) // if Mozilla, Safari etc
     page_request = new XMLHttpRequest()
     else if (window.ActiveXObject){ // if IE
          try {
               page_request = new ActiveXObject("Msxml2.XMLHTTP")
          }
          catch (e){
               try{
                    page_request = new ActiveXObject("Microsoft.XMLHTTP")
               }
          catch (e){}
          }
     }
     else
     return false
     page_request.onreadystatechange=function(){
          loadpage(page_request, containerid)
     }
     if (bustcachevar) //if bust caching of external page
     bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
     page_request.open('GET', url+bustcacheparameter, true)
     page_request.send(null)
}

 

[BillyRayPreachersSon]

You don't actually say what happens right now, nor what error messages (if any) you get... but here's my feedback anyway:

- The 'loadpage' function is not defined.

- The 'loadpage' function is being called by 'onreadystatechange' regardless of the state - i.e. it would be called even if the AJAX request has not completed. Look into checking the status of the request before calling it.

- The flash script has no function() call around it, so presumably it is being run immediately instead of when needed?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[d0nny]

Thanks....

What happens is precisely nothing.
How I previously tested this was with using just standard PHP include files for the JS call, and each include file simply contained an image - <img src="blah">.
Each thumbnail called a separate include file and therefor a separate image. That all worked fine and dandy.

What I then did was replaced the image tag for the script listed above for the Flash SWF, but nothing happens. I mean the initial top image disappears but I'm just left with a blank container where the SWF should be. No error.

Here's the loadpage function

function loadpage(page_request, containerid){
     if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
     document.getElementById(containerid).innerHTML=page_request.responseText
}

TBH, I'm not sure this is the best way to do this but I simply need to load the Flash SWF (with different parameters) AJAx style for the different thumbnails.

 

[BillyRayPreachersSon]

Aaah - so you're returning the <script> from an AJAX call and hoping that it will run. AFAIK, this is not the case when you insert SCRIPT elements using .innerHTML.

My advice is to remove the open and closing <SCRIPT> tags, and simply "eval" the response.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[d0nny]

Thanks.
Can you perhaps give me an example using "eval"?

 

[BillyRayPreachersSon]

Er...

eval(page_request.responseText);

Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[d0nny]

Just thought I would share with you the solution I managed to find...

http://pipwerks.com/lab/swfobject/load-onclick/2.0/index.html

Very good solution and works a treat!

 

[1DMF]

I'm confused, how's the final solution got anything to do with AJAX?

Have a star Dan!

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!"

Google Rank Extractor -> PERL v1.5 beta (FusionCharts)

 

[d0nny]

Well, it hasn't really, I just found another way to do it.

I was looking to load a different SWF into my DIV container when I clicked on a thumbnail, but

eval(page_request.responseText);

didn't cut it for me(!), so I found that I could simply load the SWF with a different XML file through JS, which worked a treat.

 

[1DMF]

hmm, if you weren't wanting to run something server side and then process ther returned data, AJAX certainly wasn't the tool for the job.

Glad you found a solution.

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!"

Google Rank Extractor -> PERL v1.5 beta (FusionCharts)