Is there any way to call MouseEvent function in as3 from JavaScript?
I have HTML button and swf object, I need to sent a POST request from swf by clicking on HTML button.
You can do this with the ExternalInterface api.
In your flash object, make a call like the following.
ExternalInterface.addCallback("someAPIMethod", anActionScriptMethod);
function anActionScriptMethod():void
{
// handle POST
}
Then in your JavaScript, You'll need to get the object of your embedded flash and call the "someAPIMethod" call back you have defined in your flash.
your markup may look something like...
<button id="someId" value="Click Me" onclick="onButtonClick();">Click Me</button>
Your JS may then look like...
function onButtonClick()
{
// get the flash object and call the callback method
flashObj(name).call("someAPIMethod");
}
// this probably won't work in all browsers, search the net for a better function.
function flashObj(name)
{
if (window.document[name])
{
return window.document[name];
}
return document.getElementById(name);
}
there will probably be tweaks that you need to make to this code but it should give you some direction to get started.
Related
I'm trying to modify/limit/prevent access to certain JS commands of my browser. For example commands like navigator.clipboard; However, I'm not sure how to approach this.
Is it possible to override these commands with user-defined javascript injected in the page, or do i have to edit the browser's javascript compiler and re-compile it from source for this?
I'm not really familiar with browsers and want to save time by knowing a general direction to follow. Thanks
First of all navigator.clipboard is not a function, but here is an example using the read function of navigator.clipboard:
navigator.clipboard.read = function (originalFunction) {
return function (yourParamsYouWantForThisFunction) {
// Do Stuff you wanna do before the real call. For example:
console.log(yourParamsYouWantForThisFunction);
// Call the original function
return originalFunction.call();
};
}(navigator.clipboard.read); // Pass the original function reference as a parameter
You may wonder, why there are two function statements:
The first one is there, so that we can pass the original function at runtime. If we would not do that, we would not be able to access the original navigator.clipboard.read function.
The second function is the actual function, that you will be using later, when you call navigator.clipboard.read().
I've been all over here and can't find an answer. I have a .swf sitting in an HTML page and I am trying to call a function inside of it from javascript. I can talk out from flash to the javascript but I can't get it to talk back in. I know I am targeting the object properly because I use console.log() on it and confirms what it is targeting.
I'm triggering the test from flash, calling a javascript function from inside the .swf, and having that function call the internal Flash function.
Flash Code:
//adds callback
ExternalInterface.addCallback("sendToFlash", flashTalkedTo);
//function called by the callback
public function flashTalkedTo():void{
//runs another function in javascript to log a string
ExternalInterface.call("callMe")
}
//calls javascript that tries to talk to Flash
ExternalInterface.call("catchFromFlash")
Javascript Code:
//function called by Flash that initiates
function catchFromFlash(){
talkToFlash()
}
//function that tries to talk to flash
function talkToFlash(){
document.getElementById('Noodleverse').sendToFlash()
}
//function called by Flash in the end to confirm call made
function callMe(){
console.log("Call Me")
}
Any help works, thanks!
Flash, and plugins in general, are a little bit fiddly. They don't behave quite like normal elements, and their functions don't behave quite like normal functions. For example, you can't save the element into a value and call a function from that. You also need to be careful because in some browsers the object is used and in others the embed is used.
The best way to call a function is to use swfobject (https://code.google.com/p/swfobject/) to abstract everything. Personally though, I use this (based on experience, maybe somebody can offer improvements):
HTML:
<object id="myplugin" ...>
...
<embed name="myplugin" ... />
</object>
JavaScript:
var o1=document.myplugin;
if(o1&&!!o1.myFlashFunction){
return document.myplugin.myFlashFunction(); // DO NOT USE o1 here. It will fail.
}
var o2=window.myplugin;
if(o2&&!!o2.myFlashFunction){
return window.myplugin.myFlashFunction(); // DO NOT USE o2 here
}
The first case (document) is for most new browsers. For example, Chrome will find the embed object. The second (window) is for IE and finds the object (IE, at least old IE, ignores embed). I'm not 100% sure the second is needed, because IE might also work with document, so call that voodoo code. Also window.myplugin will give an array of all matching elements in Chrome, FireFox, etc. (but we expect those to already be taken care of)
As you can tell by the title, I am having some trouble with AS3 ExternalInterface and jQuery / swfobject.
ActionScript :
if (ExternalInterface.available) {
ExternalInterface.call('init');
ExternalInterface.addCallback('testFunc', returnFunc)
}
function returnFunc():void {
ExternalInterface.call('alertFunc');
}
jQuery:
function init() {
alert('init');
$('#swf_object').testFunc();
}
function alertFunc() {
alert('finished');
}
Obviously that implies the object has the id 'swf_object'
I have also tried getting the object by the following:
document.getElementById('swf_object')
document.getElementById('swf_object')[0]
$('#swf_object')[0]
To no avail.
It's giving the first alert ('init') but then not doing the last one. I'm completely baffled and hope someone can point out my mistakes! (there's bound to be a massively obvious one somewhere)
The problem is that you're calling out to the JavaScript init() which calls the Flash testFunc() before you're made testFunc available (which happens only after the call out to init() completes).
To fix this, simply swap the two lines to this:
ExternalInterface.addCallback('testFunc', returnFunc); // Needs to be available before it's used
ExternalInterface.call('init');
As for getting the Flash object in JavaScript, you can do it directly with document.getElementById('swf_object'), but it's possible using jQuery too:
var swf = $('#swf_object').get(0); // Get the actual object without the jQuery wrapper
I am trying to use javascript to run AS3 functions. When I attempt to compile I'm getting an "Access of undefined property" error message.
I've read a few things online about this but I'm still not understanding it. I want to have the flash file always listening for javascript.
Here is my AS3 code:
ExternalInterface.addCallback("song4", PauseMusicExt);
And my Javascript & HTML:
function returnVar3(song3) { return this[song3]; }
<input type="submit" name="playButton" id="playButton" value="Submit" onClick="returnVar('song3')"/>
Edit: Here is the pauseMusic function:
function pauseMusicExt():void
{
songPosition = channel.position;
channelSilence.stop();
channel.stop();
channel2.stop();
btnPlay.mouseEnabled = true;
}
I'm not sure about the extend of your app but you've got your addCallback function parameters mixed up..
See the doc, the first parameter is the name you want to expose the function as to javascript, the second is the actual internal AS3 function you want to trigger.
So the declaration should likely be something like:
ExternalInterface.addCallback("song4", pauseMusic);
(assuming that your function in the same scope as where you call addCallback)
That statement will create a "song4" method that you can call on your flash dom object
var fl = document.getElementById('myflashobject');
fl.song4()
After there's the issue that pauseMusic want a parameter (looks like you've made it a mouse event handler). You probably want to have a clean method that doesn't require a parameter like an internal as3 event param. Rewrite pauseMusic so it doesn't require it (you might need to create another method to handle the mouse event internally - like onPause(evt:MouseEvent), which then calls pauseMusic.
Edit: I don't know if a lot of people thought about doing that, but you can also totally use external interface to call firebug's console.log function to send messages to Firebug from flash (it's really helpful for debugging ExternalInterface issues, or any other flash problems - see the ExternalInterface.call function)
Hope u want to pause the audio player.
AS code :
ExternalInterface.addCallback("sndToAS",rcvdFmJS);
function rcvdFmJS(val){
if (val == "pause"){
audioPause();
}
}
JS code :
document.getElementById("movie").sndToAS("pause");
I have an onclick function which performs several tasks. In another JavaScript function I do not have access to the context variables needed to perform these tasks. To get around this I have been simply calling the onclick function directly.
The problem I have now is that I'd like to perform a task after an Ajax action in the onclick completes. Is there any way for me to pass a function to the onclick method of a link? What would the onclick attribute look like?
e.g. something like this:
<a id="link3" href="javascript:void(0);" onclick="function(callback) { X(a); Y(b); Z(c, callback); };">click me</a>
Clicking on this would pass "undefined" as the callback, while I could also call it explicitly like this:
document.getElementById("link3").onclick(function() { alert("Completed all tasks"); } );
Is something like this possible? Basically I want to be able to pass an optional parameter to the onclick method, but if it's absent I want it to behave as if there were just procedural code in the onclick.
EDIT: Added more specifics
The use case is that the onclick calls a search function which requires session variables. When regular searches are performed there is no problem, but when I wish to refresh the search results (e.g. when a the user edits or deletes one of the returned results) I need to call the same search function that was called previously and then print out a feedback message after they are refreshed. This feedback message output is what I would like to be in the callback method. I'd also like to set the window.location.href to page down to the affected row in the event of an edit or an insert.
I have access to several variables on the server side which I print out directly to the onclick attribute when I render the page. In other JavaScript files that I am including on my page I would also like to be able to execute the same functions contained within the onclick. The only problem being that I would have to pass all these variables to those functions indirectly through several intermediate methods in the call chain.
The other option is to print these values to hidden page values and then retrieve them from within my method, but I would like to avoid this as it would be cluttering up everything just so that I could decorate my function call with some visual after-effects.
Although this may be possible somehow, I would recommend not to add arguments to the native DOM events.
I can't see a real architectural need for this, either. Can you make a full example of a use case where you need this? I'm pretty sure someone can come up with an alternative solution that doesn't make additional arguments necessary.
Wouldn't, in your example, the right place to place the alert be the success callback of the Ajax request?
This works for me:
<body onload="f = document.getElementById('link3').onclick; f(function(){alert('Completed all tasks')});">
<input id="link3" type="button" onclick="alert(typeof(arguments[0])); arguments[0]()">
</body>
The first directive returns "function", and the second one returns "Completed all tasks", as expected. In your case, the following should work:
<input id="link3" type="button" onclick="X(a); Y(b); Z(c, arguments[0]);">