I have been bashing my head against this for a while now and need some fresh eyes:
I am trying to use the youtube JS api to call a function when the embedded videos state changes. But for some reason the event dosnt seem to be firing and I'm not getting any error in the console.
HTML:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="630" height="350" id="bannerVideo">
<param name="movie" value="http://www.youtube.com/v/6Yfd1uGYgk8?enablejsapi=1&version=3&playerapiid=ytplayer" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/6Yfd1uGYgk8?enablejsapi=1&version=3&playerapiid=ytplayer" width="630" height="350">
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
Javascript:
function onYouTubePlayerReady(playerId) {
//alert(playerId);
ytplayer = document.getElementById("bannerVideo");
//alert(2);
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
//alert(3);
//ytplayer.addEventListener("click", function(){alert('click');});
}
function onytplayerStateChange(newState) {
alert("Player's new state: " + newState);
}
Example site:
http://dev.stewartknapman.com/ytPlayer/
The code I am using is a direct copy & paste from the youtube api site and I am using swf object to embed the code. I am using the static embedding because I will be changing some stuff out with php, but this shouldn't matter... right?
I moved all the code out into its own file just for testing and its hosted on my development server so it shouldn't be a sandbox issue.
I have also tried alerting after every line just to make sure the addEventListener function is not failing. (I have left the alerts in my example code but commented them out.)
After searching previous posts about this error I have found that they were all solved by adding the ID to the right element or parsing the callback function as a string. So I double and triple checking these things but that doesn't seem to be the issue.
Any help would be greatly appreciated.
Have you tried initializing the flash embed using the SWFObject method (as outlined on the YouTube API)?
var params = { allowScriptAccess: "always" };
var atts = { id: "myytplayer" };
swfobject.embedSWF("http://www.youtube.com/v/VIDEO_ID?enablejsapi=1&playerapiid=ytplayer&version=3",
"ytapiplayer", "425", "356", "8", null, null, params, atts);
Replace your tags with the above and configure it to your setup.
Related
I am new to AS3, and would like to trigger an as3 function from javascript.
AS3
package code {
import flash.display.MovieClip;
import flash.external.ExternalInterface;
import flash.text.TextFormat;
public class Main extends MovieClip {
public function Main() {
ExternalInterface.addCallback("changesize", this.setStyle);
}
protected function setStyle() {
var tf:TextFormat = new TextFormat();
tf.size = 15;
editabletext.setTextFormat(tf);
}
}
}
html
<html><head>
<meta charset="UTF-8">
<title>animator</title>
<style type="text/css" media="screen">
html, body { height:100%; background-color: #ffffff;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
</head>
<body>
<div id="flashContent">
<object type="application/x-shockwave-flash" data="animator.swf" width="550" height="400" id="animator" style="float: none; vertical-align:middle">
<param name="movie" value="animator.swf">
<param name="quality" value="high">
<param name="bgcolor" value="#ffffff">
<param name="play" value="true">
<param name="loop" value="true">
<param name="wmode" value="window">
<param name="scale" value="showall">
<param name="menu" value="true">
<param name="devicefont" value="false">
<param name="salign" value="">
<param name="allowScriptAccess" value="always">
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player">
</a>
</object>
</div>
<script type="text/javascript">
var animator = document.getElementById('animator');
animator.changesize();
</script>
</body></html>
animator.changesize() gives me Uncaught TypeError: animator.changesize is not a function
I have also tried changing allowscript access between sameDomain and always. neither seems to work
It's a timing issue. The callback will only get added to the DOM once the SWF has been loaded by the Flash Player and the Main constructor is executed, but you are trying to call it immediately when the DOM is parsed.
Since the DOM is always going to be parsed before the SWF is loaded (and the callback is added) you should not assume that the SWF callback is always there and ready to be called. Instead, the SWF should call into JS when it is ready.
As mentioned in the comments, first check if ExternalInterface.available is true and test on a server (could be localhost if you set one up locally).
I also notice you have an <object> but no <embed> tag. Some browsers use the object tag, while others use the embed tag. Make sure the id and name for these tags are the same.
Even better, I recommend using swfobject as it takes care of these issues and make the code a bit cleaner. Please have a look at the SWFObject External Interface article and example
After a long day of searching on the web, i didn't find any solution to my problem.
I have a problem loading an swf file in my webPage using swfObject, doesn't work in IE11 ( works fine in ie8-10, firefox and chrome)
Here's my context :
This is the initialization of the params send to IE through the swfObject
`
// For version detection
var swfVersionStr = "10.0.0";
// To use express install, set to playerProductInstall.swf
var xiSwfUrlStr = "commun/swf/playerProductInstall.swf";
//FlashVars : contains an url used for an http request that returns the crossdomain.xml file with the crossDomainPolicy...
var flashvars = {
crossdomainURL : httpOrigin + "the.url.to.crossdomain.policy.file"
};
var params = {};
params.quality = "high";
params.bgcolor = "white";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "dematMultiuploader";
attributes.name = "dematMultiuploader";
attributes.align = "middle";
swfobject.embedSWF(
"the/url/to/SWFfile.swf", "falshContentID",
"550", "280",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
`
And here's my object tag
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="550" height="280" id="dematMultiuploader">
<param name="movie" value="path/to/swf/file.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="white" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="gedemat/gecco/piece/pieceDocument.create.swf"
width="350" height="130" id="dematMultiuploader">
<param name="quality" value="high" />
<param name="bgcolor" value="white" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<!--<![endif]-->
<!--[if gte IE 6]>-->
<p>Either scripts and active content are not permitted to run or
Adobe Flash Player version 10.0.0 or greater is not installed.</p>
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer"> <img
src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"
alt="Get Adobe Flash Player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</noscript>
As you can see there's no flashVars param in the Object tag for IE, could that be the problem?
May be IE changed some parameters names for IE11 like crossDomainUrl?
I tryed already to put the flashvars param in the object tag with the crossDomain url but it didn't work.
In firefox and chrome i get this error :
NetworkError: 404 not found - http://localhost:8080/crossdomain.xml
So they try to load the file directly at the root of the server without any success but it still works because the crossdomain.xml has already been loaded before this call. Maybe IE is having trouble finding this file at that particular moment? not taking into account the ones loaded before?
Any Ideas?
Found the solution!
in the official documentation of Internet Explorer 11 I found this :
The preinstalled version of Adobe Flash isn't supported on Internet Explorer 11 running on either Windows 7 SP1 or Windows Server 2008 R2 with SP1. However, you can still download and install the separate Adobe Flash plug-in.
here's the link to it : http://technet.microsoft.com/en-us/library/dn268945.aspx
Since i'm runing on Windows 7 SP1 I reinstalled and everything worked again.
http://get.adobe.com/fr/flashplayer/otherversions/
Removing the <noscript> should help.
falshContentID is not found in the html part. Remove the entire object tag and add
the below code in html area.
<div id="falshContentID"></div>
I have a webpage with several swf movies that is created in dreamweaver and outputs several object tags like such:
<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="160" height="600">
<param name="movie" value="Banners Template/Example_160x600.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="9.0.45.0" />
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="Banners Template/Example_160x600.swf" width="160" height="600">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="9.0.45.0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<p><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
<script type="text/javascript">
swfobject.registerObject("FlashID");
</script>
I would like to do the following:
The Swf animation runs once through on page load(This is
currently happening)
Once user clicks a 'Replay Movie' button,
the swf it is associated with will replay until the movie finishes.
I have been trying to find some code that can utilize javascript or jQuery to either reload the contents of the object tag or replay the swf with no success. How can I replay a swf movie on jquery button click?
demo: http://jsfiddle.net/tive/Ff7Mq/
demo2: http://jsfiddle.net/tive/J6WQm/
capture the event and change the source of the file.
Or use your swf object to render the div again.
var initVideos = function () {
var divs = $("ul li a");
// bind your click event to the divs
divs.click(function (e) {
e.preventDefault(); // use this when you're triggering anchor tags
flashembed("videoArea", $(this).prop("href"));
divs.removeClass("active");
$(this).addClass("active");
});
};
i need help calling a javascript function from flash, i have embedded the flash using swfobject, heres my javascript to embedd it
<script type="text/javascript">
swfobject.registerObject("myFlashContent", "9.0.0", "expressInstall.swf");
</script>
Here is my HTML which is used to show the flash
<div class="flash">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="258" id="myFlashContent">
<param name="movie" value="btnDemo.swf" />
<param name="allowscriptaccess" value="always" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="btnDemo.swf" width="258">
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
And in my flash i have, which should display a popup message
getURL("javascript:alert('hello')");
However, none of this is working.
Anyone have any ideas as to why this isn't working?
You should really use ExternalInterface for doing calls to JavaScript. Using it looks like this:
import flash.external.ExternalInterface;
if(ExternalInterface.available) ExternalInterface.call('alert','hello');
Using the availability test prevents the code throwing an error when running in the IDE.
Also, in your example you are targeting FP9, so your code must be AS3? AS3 has no getURL() method.
My Site is: http://butplaygames.com
Here is the code i am putting in my footer right before the body tag:
<script type='text/javascript'>
<!--
(function(i,w,d,p,c,e,s,t){t=d.getElementsByTagName('script');if(!w[i]){w[i]={ads:[]};s=d.createElement('script');s.src='http'+(d.location.protocol=='https:'?'s://server':'://cdn')+'.cpmstar.com/cached/js/global_v100.pack.js';s.type='text/javascript';s.async='';t[0].parentNode.insertBefore(s,t[0]);}
p['poolid'] = myidherewhichiput;
c['background'] = null;
c['close'] = null;
c['type'] = 'game';
w[i].ads.push({params:p,config:c,events:e,overlay:-1,s:t[t.length-1]});})('cpmstar',window,document,{},{},{});
//-->
</script>
My game embed code for flash:
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab" width="800" height="600" id="TreasureTrash">
<param name="movie" value="MYURL" />
<embed src="MYURL" allowfullscreen="true" allowScriptAccess="always" wmode="opaque" width="800" height="600" name="TreasureTrash" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
<param name="allowfullscreen" value="true" />
<param name="wmode" value="opaque">
</embed></object>
The code works in Firefox, Chrome and Opera. But not in IE. Kindly help. I am very lost here. My site is butplaygames.
An AD is supposed to show over my flash games using the javascript code. It shows in Opera, Firefox and Chrome. But does not show in IE. IE does not even show any errors. It just makes the entire swf into a small dot and does nothing.
The script needs to read the .swf from the src atribute. In your case, in the src atribute there is no .swf there.