I need to know how it's possible to force playing a video in fullscreen mode?
Fullscreen is in most of the cases a function by ActionScript and is triggerd with a user action, like mouse click or double click.
The other way is to force playing a video in the mobile devices native player, like youtube does. I have no clue how this approach is realized.
Hope to understand this thing a bit more clearer with your support.
chris
you can tell the Flash stage to go to fullscreen view with this command:
stage.displayState = "fullScreen";
It will work in standalone mode only.
To make it work in the browsers you have to pass the "allowFullScreen" parameter with a "true" value to Flash.
To go fullscreen in mobile devices I believe you have to use the
FSCommand("fullscreen", "true"); method call.
If you are using SWFObject the you can add the allowFullScreen param easily.
SWFObject -2:
<script type="text/javascript">
var so = new SWFObject("movie.swf", "mymovie", "400", "400", "8", "#336699");
so.addParam("wmode", "opaque");
so.addParam("allowScriptAccess", "sameDomain");
so.addParam("allowFullScreen", "true");
so.write("flashcontent");
</script>
SWFObject 2+:
<script type="text/javascript">
var wl = new Object();
wl.flashvars = {};
wl.params = {
allowScriptAccess: "sameDomain",
allowFullScreen: "true",
wmode: "opaque"
};
wl.attributes = {};
swfobject.embedSWF("movie.swf", "flashcontent", "400", "400", "8", "swf/expressInstall.swf", wl.flashvars, wl.params, wl.attributes);
</script>
I hope it helps, good luck
Rob
Related
I had everything working fine until about two weeks ago. I haven't changed any code.
function loadYtVideo(video, advert, advert_link, splash, splash_link){
var params = { allowScriptAccess: "always", wmode: "transparent" };
var atts = { id: "eda-player", wmode: "transparent" };
var swfobject;
adv.orig = video;
swfobject.embedSWF("https://www.youtube.com/v/"+adv.orig+"?rel=0&enablejsapi=1&playerapiid=ytplayer","ytapiplayer", "719", "404", "8", null, null, params, atts);
}
function onYouTubePlayerReady(playerId) {
//It's fired
edaplayer = document.getElementById('eda-player');
edaplayer.addEventListener("onStateChange", "playerState");
}
function playerState(state) {
//it's not fired
console.log(state);
}
<div class="adv-video">
<div id="ytapiplayer">
<script>
$(document).ready(function(){
loadYtVideo($.getUrlVar('ytVideo'), 'eM2ja9LE0YE', 'http://wilmax.ru/', '', '');
});
</script>
</div>
</div>
I found posts with similar problem, but solutions in those posts are not working in this case.
Any help would be greatly appreciated.
I would suggest you move to YouTube IFrame Player API:
The IFrame player API lets you embed a YouTube video player on your website and control the player using JavaScript. Unlike the Flash and JavaScript player APIs, which both involve embedding a Flash object on your web page, the IFrame API posts content to an <iframe> tag on your page. This approach provides more flexibility than the previously available APIs since it allows YouTube to serve an HTML5 player rather than a Flash player for mobile devices that do not support Flash.
Flash API and JS API has already been deprecated. I'm not sure if it still work with the current API that is why I suggest you to use Iframe API
Here are some sources that may help you:
JS Fiddle Demo
embedding Flash
Related SO question
Hope this helps!
I'm using the HTML5 Background Video script (https://github.com/Victa/HTML5-Background-Video), and I'd like to be able to add some volume/play controls. I tried integrating solutions I found for other HTML5 video players, to no avail.
Minimally, I'd like a mute/volume control. Play/pause/stop would be optionally cool.
Here's the script calling the video:
var videobackground = new $.backgroundVideo($('#bgVideo'), {
"align" : "centerXY",
"path" : "video/",
"width": 1280,
"height": 720,
"filename" : "cows",
"types" : ["mp4", "webm"]
});
The site where I'm using the video is a Bootstrap template, and is located here: http://harbourcitydevelopment.com/beef/samples/sample-04/
Thanks for any ideas!
In the file 'jquery.backgroundvideo.min.js', I just added muted="true" and controls="true", and it did the trick. Thanks to Atutouato for the suggestion with .play(), .pause(), which put me on the right track!
Is it possible to detect whether youtube captions are on or off in an embedded player?
There is currently no way to suppress the captions if users choses to display them. I would like to show a customized message if the captions are on.
In the documentation there is no mention of this as far as I can say.
I have not found this anywhere in their api docs, but with your youtube player object you should be able to do:
player.getOptions("captions") || player.getOptions("cc") //detects if captions were ever loaded at one point.
You can also turn it on via js by:
player.loadModule("captions"); //Works for html5 ignored by AS3
player.loadModule("cc"); //Works for AS3 ignored by html5
to turn it off:
player.unloadModule("captions"); //Works for html5 ignored by AS3
player.unloadModule("cc"); //Works for AS3 ignored by html5
to change which language if the module is loaded:
player.setOption("captions", "track", {"languageCode": "es"}); //Works for html5 ignored by AS3
player.setOption("cc", "track", {"languageCode": "es"}); //Works for AS3 ignored by html5
Easy as pie, you can ;)
<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<script src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<div id="ytapiplayer">
You need Flash player 8+ and JavaScript enabled to view this video.
</div>
<script type="text/javascript">
var params = { allowScriptAccess: "always" };
var atts = { id: "myytplayer" };
swfobject.embedSWF("http://www.youtube.com/v/QRS8MkLhQmM?enablejsapi=1&playerapiid=ytplayer&version=3",
"ytapiplayer", "640", "480", "8", null, null, params, atts);
var stateChange = function(a) {
if (ytplayer.getOptions().indexOf("cc") !== -1) {
alert("closed captions are on");
} else {
alert("closed captions are off");
}
}
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("myytplayer");
ytplayer.addEventListener("onStateChange","stateChange");
}
</script></body>
</html>
BTW: Google rocks ;)
this should do the trick - please don't use it in production mode - it was just a quick sum-up. You need to listen to the state you want, I'm just alerting at any event ;)
I want to have a flash banner start playing once it becomes visible below the fold.
When the visitor scrolls down and it is viewable in the browser it starts playing.
Is this possible? I'd prefer if the solution was outside of flash but just want it to work. Currently the banner does not replay itself so it is playing to the end before it becomes visible. If it could load or start playing once its viewable that would solve the problem.
I know lazyloader can load images after you scroll down and facebook comments load once you scroll down but could you do the same thing with anything? in particular a flash banner.
Update: I've now the has priority paramter and can't get it to work:
<script type="text/javascript" src="/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
var params = {};
params.loop = "true";
params.hasPriority = "false";
var attributes = {};
attributes.id = "flash";
swfobject.embedSWF("flash.swf", "myAlternativeContent", "1000", "300", "10.1.0", false, flashvars, params, attributes);
</script>
<div id="myAlternativeContent">
<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>
</div>
Use param "hasPriority" when embeding. Here is help for this parameter: http://help.adobe.com/en_US/as3/mobile/WS4bebcd66a74275c36cfb8137124318eebc6-8000.html
Another approach is by using JavaScript. There is jQuery plugin for that that draws objects when they appear in viewport: jQuery Bullseye
I want to use JavaScript to control an embedded Windows Media Player, as well as access any properties that the player exposes. I've found a few hacky examples online, but nothing concrete.
I really need access to play, pause, stop, seek, fullscreen, etc. I'd also like to have access to any events the player happens to broadcast.
Help would be wonderful (I already have a Flash equiv, just so you know), thanks!
The API requires ActiveX connectivity native to Internet Explorer, or can use a plugin for Firefox.
Here's a sample page that might get you started.
<html>
<head>
<title>so-wmp</title>
<script>
onload=function() {
player = document.getElementById("wmp");
player.URL = "test.mp3";
};
function add(text) {
document.body
.appendChild(document.createElement("div"))
.appendChild(document.createTextNode(text));
};
function handler(type) {
var a = arguments;
add(type +" = "+ PlayStates[a[1]]);
};
// http://msdn.microsoft.com/en-us/library/bb249361(VS.85).aspx
var PlayStates = {
0: "Undefined", // Windows Media Player is in an undefined state.
1: "Stopped", // Playback of the current media item is stopped.
2: "Paused", // Playback of the current media item is paused. When a media item is paused, resuming playback begins from the same location.
3: "Playing", // The current media item is playing.
4: "ScanForward", // The current media item is fast forwarding.
5: "ScanReverse", // The current media item is fast rewinding.
6: "Buffering", // The current media item is getting additional data from the server.
7: "Waiting", // Connection is established, but the server is not sending data. Waiting for session to begin.
8: "MediaEnded", // Media item has completed playback.
9: "Transitioning", // Preparing new media item.
10: "Ready", // Ready to begin playing.
11: "Reconnecting" // Reconnecting to stream.
};
</script>
<script for="wmp" event="PlayStateChange(newState)">
// http://msdn.microsoft.com/en-us/library/bb249362(VS.85).aspx
handler.call(this, "playstatechange", newState);
</script>
</head>
<body>
<div id="page">
<object id="wmp"
classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6"
type="application/x-oleobject">
</object>
</div>
</body>
</html>
There is an API in Microsoft's developer center, but it will only work if you embed windows media player using active-x.
To "learn" more about the API, check out MSDN: http://msdn.microsoft.com/en-us/library/dd564034(VS.85).aspx
Windows media player is exposed as an activex control that any scripting language running in the windows script host should be able to access. You should be able to use jscript to control it. Jscript is microsofts implimentation of java script. For information on what objects and methods are availble using jscript for windows media player se this link.
There is no open JavaScript library as far as I know for crossbrowser clientside handling of a WMP player.
However, this link should make it quite easy for you to start your own little library. The code might need some updating and testing in modern browser versions but you have the basics there.
The library your searching for would be a great idea for a Google Code project, I guess that while everyone today is using Adobe Flash with sIFR / swfobject or Microsoft Silverligt with sistr etc, there are not much interest to write clientside script controlling for WMP.
Should use next WMP object (works in Chrome, FF, Safari)
objPlayer = document.getElementById("wmp");
objPlayer.controls.stop();
objPlayer.URL = this.url;
objPlayer.controls.play();
<EMBED id="wmp" TYPE="application/x-mplayer2" name="MediaPlayer" width="0" height="0" ShowControls="0" ShowStatusBar="0" ShowDisplay="0" autostart="0"></EMBED>