Actionscript Javascript Communication | ExternalInterface call and addCallback Tutorial

Good Question, half of this works in IE…
You can communicate from flash to javascript just fine. But getting from the javascript to the flash is giving me trouble. I get the “Object doesn’t support this property of method” error.

Any insight would be helpful!

hav a flv fullscreen player,inside a html page,

in that html page one button is there,

that button should be invisible until

user click & watch half of the flv movie,

after watching that half of the movie,
that html button should be automatically active,

any idea how to do this type of thing

using javascript in flash

plz mAIL ME AT neeraj8585@gmail.com

hii Evan Mullins

thanks for ur reply,

i am able to trace the flv cue points,but getiing confusion in calling that function,can u help me to calling that function, just tell how do i call that function from flash to hide that html button in start & when it will reach to that particular point that html button will automatically shown, it will be very helpful for me.

////////////////////////////////////////////////
import flash.external.*;

// for calling javascript external class

// plaese writr that function here that all

/**
Requires:
– FLVPlayback component on the Stage with an instance name of my_FLVPlybk
– TextArea component on the Stage with an instance name of my_ta
*/

import mx.video.*;
my_FLVPlybk.contentPath = “http://www.helpexamples.com/flash/video/water.flv”;
my_ta.visible = false;
// create cue point object
var cuePt:Object = new Object();//create cue point object
cuePt.time = 1.444;
cuePt.name = “elapsed_time”;
cuePt.type = “actionscript”;
my_FLVPlybk.addASCuePoint(cuePt);//add AS cue point
// add 2nd AS cue point using time and name parameters
my_FLVPlybk.addASCuePoint(5.3, “elapsed_time2″);
var listenerObject:Object = new Object();
listenerObject.cuePoint = function(eventObject:Object):Void {
my_ta.text = “Cue at: ” + eventObject.info.time + ” occurred” ;
my_ta.visible = true;
};
my_FLVPlybk.addEventListener(“cuePoint”, listenerObject);
///////////// script end ///////////////////////

regards,
Neeraj

hi

The sample is nice and I changed the code to work in IE also ……the code

change the html code as follows………..

in javascript change like this

if (navigator.appName.indexOf(“Microsoft”) != -1)
{
document.getElementById(‘IEflash’).sendTextFromHtml(document.getElementById(‘htmlText’).value);
} else
{ document.getElementById(‘flash’).sendTextFromHtml(document.getElementById(‘htmlText’).value);
}
document.getElementById(“htmlText”).value = “”;

I hope this may help for some one………

With ExternalInterface.call, the first argument is the name of the js function you want to call in your HTML document, and the rest are arguments you want to pass in to it. You can send many, just separate them with a comma.
so: ExternalInterface.call(“recieveTextFromFlash”, _root.theText.text);
becomes: ExternalInterface.call(“recieveTextFromFlash”, _root.theText2.text, _root.theText.text, _root.theText3.text);
Check the documentation of ExternalInterface.call from Adobe
call (ExternalInterface.call method)
public static call(methodName:String, [parameter1:Object]) : Object
Parameters

methodName:String – The name of the function to call in the container. If the function accepts parameters, they must appear following the methodName parameter.

parameter1:Object [optional] – Any parameters to be passed to the function. You can specify zero or more parameters, separating them by commas. The parameters can be of any ActionScript data type. When the call is to a JavaScript function, the ActionScript types are automatically marshalled into JavaScript types. When the call is to some other ActiveX container, the parameters are encoded in the request message.
Returns

Object – The response received from the container. If the call failed (for example if there is no such function in the container, or the interface was not available, or a recursion occurred, or there was a security issue) null is returned.

I’ve got the html/javascript submitting multiple inputs but it’s the actionscript side that I am completely clueless about.

thanks,this help me a lot

Hi saga …

Can you explain where the IEFlash object is coming from on your fix for IE …

is the object embedded in a different way to flash ???

Thanks …

Can anybody help me. I need to Get value from flash to js by calling js method.

Thanks for the comments everyone, I took a minute recently and worked with this IE issue. I tried saga’s suggestion, but it didn’t seem complete. Then I decided to update my embed codes, and I used my favorite embed option swfobject2! Doing this alone fixed the IE bug! Now we have actionscript javascript communication in any browser, IE included.
NEW live example with swfobject2 works in IE! ActionscriptJavascriptCommunication2.html

@Roland – to do that, if I understand your question correctly, you’d have to just expose an actionscript function to javascript with addCallback and have it return the value you need and call that from javascript like any other function. Good luck!

Object doesn’t support this property or method.

I am able to communicate from Flash to JavaScript, NO PROBLEM. However, the inverse is not true. From JavaScript to Flash, I get the above error. There is no explanation for this all code is correct. All are set, the tag is there also.

Can anyone help?

@YVR – I fixed the embed codes for IE so the javascript can now “find” the flash element on the page correctly. Nothing in the flash source changed- only the HTML. I didn’t include that in the zip file, but it is in the html page here ActionscriptJavascriptCommunication2.html, just view source. My apologies for the confusion

Hi Evan….This works perfectly as expected…but need a help on one step further down.
I just added another function in the javascript function which looks like this (hope this comments will allow me to paste JS syntax…)

function recieveTextFromFlash(Txt) {
document.getElementById(‘htmlText’).value = Txt;
DisplaySettingsPage();
}

In my Javascript page..
DisplaySettingsPage {
ajaxpage(‘products.asp’ ,’centerarea’)
}

Now when I click the Flash button it perfectly display the products.asp (which just does a select recordset from a mysql table) in the correct “centerarea” div..
Now my question is..how do I modify the code so that the resultset is not displayed in DIV but rather in a nice formated textbox in FLASH (instead of centerarea DIV) ?
-Let me know if I have confused you.
-V

@Eric – I would think so, as long as IE can still address the flash content with the getElementById(). Let us know if it does work!

@YVR – I admit, I’m confused. Not sure what you mean. You want the function coming from flash to send text back to flash? That just seems redundant…

hi
first sorry for my bad language
i am hamada frpm jordan i tried to write a combination with javascript and flash 8
but it doesn’t work only if it was published to web server
why i can’t do it at home ???
please reply

Evan,

Your most recent update to ActionscriptJavascriptCommunication2.html does not work in ie6. I’m still getting “null is null or not an object”. More obviously, the flash part of the page is not loading. Could you clarify this issue?

Dan

@Dan – Thanks for pointing that out
&
@Bob – Thanks man! I’ve added it and that fixed it! Should have looked at that earlier. Let me know if there are any other issues.

I’m trying to use externalInterface to create a mouselistener so the mouse scroll will work when on top of the flash – as well as the spacebar and arrow keys working as well – any tips?

Hi..

I am trying to do a simple thing,

ExternalInterface.call(“alert(‘Hi’)”);

This works fine if i try to run the SWF directly in the browser but doesn’t work if i try to load the player through JavaScript.

I am facing this problem in IE 8

Please help.

I am searching for a way to interact to my database from actionscript, we are devoloping a website based on java&javascript…

do you have any idea about this how can I read and write datas to a database via actionscript…

can javascript do this?

For some reason, whenever I try to open ActionscriptJavascriptCommunication.fla, an alert comes up that says “Unexpected file format.” and I cant open the file.

I have some thumbnails loaded from an xml file with each one being a button to launch to corresponding shadowbox gallery. (see the portfolio section of the website) I have a var declared in my on release function which I want to use in the ExternalInterface.Call as below.

function releaseHandler() {

var galName = this["info"].attributes.title+’Gallery’;
//trace (galName);

ExternalInterface.call(galName);
}

The trace returns the correct values but I can’t seem to use them in the ExternalInterface.call

Any hints?

Got it sorted. Just a syntax error.

Should have double brackets around the var as follows:

ExternalInterface.call((galName));

Cheers

Useful but a little out of date, none of the examples worked with IE. And you have to add the allowscriptaccess : “always” to the attributes when creating the swfobject example to work too.

Actually, your example works just fine on IE, but when I tried to implement it it didn’t work out.

To make it run on all browsers I had to add the

allowscriptaccess : “always”

as a param like this instead of attribute:

var params = {
allowScriptAccess: ‘always’
};

I wanted to modify it – send text from javascript width mousover not with button! So everything worked on Chrome, but when i tried on FF it wont!

all in span

onmouseover=”getElementById(‘flash’).sendTextFromHtml(htmlText.value); document.getElementById(‘htmlText’).value = ””>MOVE MOUSE OVER HERE

i looked everywhere what can be the problem, but no answers… Please help!

Hi,
very interesting tutorial.
But how you can pass more than 1 parameter to function ExternalInterface.call?
( same question about function called from ExternalInterface.addCallback)