Is it possible to raise an event when IFrame embedded YouTube reach a specific frame?
I am looking for something similar to HTML5 player timeupdate event.
I am not looking for using a setInterval to check the current position (as suggested in Youtube API event on a specified time), I would like to know if there is a native API to support such feature.
This is not possible as there is no such event within the iFrame API. Although it is not directly possible you could try something like this, if you need a video to end a specific point for example you can use load parameters to do this, like so.
loadVideoById({'videoId': 'bHQqvYy5KYo',
'startSeconds': 5,
'endSeconds': 60,
'suggestedQuality': 'large'});
After that you would hook into the onStateChange event and depends on what you want to do continue playing, ask a question about up to the timeframe etc.
However if this is designed to be used on mobile you must consider as per most mobile browsers (references says iOS, i think android does too).
"Warning: To prevent unsolicited downloads over cellular networks at the user’s expense, embedded media cannot be played automatically in Safari on iOS — the user always initiates playback."
So if a video ends or pauses you can not pragmatically restart/resume the video, the user must always do it.
Related
The Soundcloud widget works fine playing multiple tracks in succession. If I then hide that frame, play a youtube video in a youtube iframe, and then switch back to a new track in the Soundcloud widget, it loads but will not play (ignoring the autoplay setting and any widget.play() calls). I had this working on Chromecast with the developer preview SDK and the 1.0 cast receiver but now with the 2.0.0 receiver it's broken. Any ideas how to proceed?
Currently there is no supported mechanism in the SDK to play YouTube videos outside of the YouTube app. Note that in general, applications may not allow other senders launch or control their receiver side, for example Hulu+ may not like it if you wan to write your own app to launch and control that application on your Chromecast; if they decide to allow such model, they need to publish the steps (for example, they can publish their App ID and additional custom data that would link deep into their application). YouTube is no different in that respect.
ok, got this working so hopefully this is useful to others. Assuming only one is active and visible at a time, the trick is to destroy the prior widgets rather than try to reuse them. For YouTube this does not mean reloading the iframe_api but simply calling YTPlayer.destroy() and new YT.Player() next time around. For SoundCloud keep a handle of the iframe and then call iframe.parentNode.removeChild(iframe) to destroy and then create again next time.
I'm trying to learn more about YouTube's TOS. More specifically:
II. Prohibitions
8: separate, isolate, or modify the audio or video components of any YouTube audiovisual content made available through the YouTube API;
I'm working inside of a Google Chrome Extension which consists of a persistant background page and a foreground pop-up page. I would like to display audiovisual content in the foreground to users. This is fine and works, however, upon closing the foreground -- the audiovisual content ceases because the page has been destroyed.
As such, I would like to sync two YouTube players such that one in the background is unmuted with the one in the foreground being muted, but with its visual content sync'ed to that of the background. Would this violate YouTube's TOS? I'm hoping the answer is no - it seems akin to having a tab open. Sometimes the visual content can be seen (at the user's discretion) but the audio content would be uninterrupted.
Thanks
If I interpret that correctly:
"to separate or isolate" means to cut off the video or the audio part (or even different channels of it, if any) of the returned/streamed media
"to modify" means that you transform the data in some way and you display it to the user, instead of the original data (i. e. you are prohibited to make a video streaming application that displays every movie in black and white).
So, unfortunately, I think your requirement does indeeed violate the TOS.
In short:
There's no way for you to make an app that allows you to listen to a youtube song with your display off...
(I believe they want you to see the ads or they want to prove to those who pay them to put the ads that people sees the ads they put on all youtube videos).
I have built an app, designed to play each sound as the first one is finished by using 'ended' event.
In my initial version, each sound has its own audio element, resulting in something like:
function play_next_audio(){
speaker = $('audio#' + sounds[i++]).get(0);
speaker.addEventListener('ended',play_next_audio);
speaker.play();
}
This works great on all desktop browsers, including Safari, but does not go beyond the very first letter on iOS.
I have also tried a different approach - a single audio element that loads each sound in turn. There I experimented with binding the 'ended' event as well as loading first and binding 'canplaythrough' event instead. In both cases, it fails to work even on the desktop Safari - this time successfully playing the first two letters.
Here is the isolated test:
http://dev.connectfu.com:42001/app/test-sounds.html
Note that audio.load() is commented out several places - having it in or out seems to make no difference.
What am I doing wrong? How can I play series of sounds on iOS? Thank you so much for the help!
update As of 2017, the ended event doesn't fire on Safari (or Chrome) on iOS under several conditions. More information can be found here: It's almost 2017, and HTML5 audio is still broken on iOS.
I've built an HTML5 audio player (Chavah Messianic Radio) that "works" on Safari on iOS.
By "works", I mean, it plays the best it can on Apple's crippled iOS <audio> implementation. At the time of this writing, this includes iOS 5. I've tested this on iPhone 3 and up, and iPad original, iPad 2, and iPad 3.
Here are my findings:
Apple does not allow you to call .play on any audio until user interaction. For me, this means detecting iOS, then showing the music as paused until the user clicks play. Their reasoning is that this will consume data and battery; in practice, though, it just cripples web apps and stifles the evolution of the web.
If you want to play successive sounds (one after another), use a single element. When it's time to play the next sound, set existingAudio.src, then call existingAudio.load(), then call existingAudio.play(). This will allow you to play successive sounds.
Audio events don't fire if Safari is in the background.. While audio will continue playing if the user switches to a different app, the .ended event won't fire. This means it's practically impossible to build a music player app.
Hope this helps.
<rant>
In the meantime: Apple, please, please, please give us better support for HTML5 in iOS Safari. Here are your action items, Apple:
Let HTML5 audio work in the background.
Support OGG.
Support pre-loading audio.
Support concurrent audio.
Let us play audio without user interaction.
Do those things, Apple, you'll be the industry leader in mobile HTML5 audio, everyone will emulate you, you'll once again be leading the way, and web apps will work perfectly on your platforms, while being crippled on other mobile platforms. Yes, these features will use data and the battery, but native apps already do this. Stop crippling web apps and be the leader. Make HTML5 <audio> a first-class citizen on iOS.
</rant>
I don't believe the .play() method is supported for audio or video in iOS. Apple does not like the idea of videos or audio automatically playing upon visiting a page.
Here is a helpful reading about the state of HTML5 audio support across platforms: http://www.phoboslab.org/log/2011/03/the-state-of-html5-audio
I have a content management server application written in Java. A background process goes through a list of video ids and fetches the details for those video ids using Youtube API.
I would like to check if a particular video entry is available for mobile or not.
I checked syndicate allowed like
String videoEntryUrl = "http://gdata.youtube.com/feeds/api/videos/"+videoID;
VideoEntry videoEntry = service.getEntry(new URL(videoEntryUrl), VideoEntry.class);
if(!videoEntry.getXmlBlob().getBlob().contains("yt:accessControl permission='denied' action='syndicate'")){
System.out.println("The video is syndicatable");
}
Checking for syndicate still not solved the problem and the server still lets in videos that cannot play on Android phone.
What is the right way to filter only the videos that can be played on mobile?
There's no single check to see whether a video is playable "on mobile".
There are a variety of different reasons why a particular video might not be playable on a particular platform, and unfortunately the only way to be absolutely sure whether a particular video will play in a particular player is to attempt to play it.
That being said, this blog post goes into more details about the types of common playback restrictions that crop up: http://apiblog.youtube.com/2011/12/understanding-playback-restrictions.html
I want to automatically load local video and audio without clicking/swiping, etc. on a PhoneGap application on the iPad. I'm considering creating an objective-c plugin, would this be the correct way or is there another work around i.e. a plugin, javascript way etc?
Given that a phonegap app is basically a wrapped webapp, I think you may be out of luck, apple requires a user action to play media on the iPad (actually, audio, I don't know either way for video). Here's a source.
See the user controls or media playback controls section. Even though your data is local, the play action is disabled without an action