I am developing an iPad app that embeds YouTube videos in HTML5 format into a UIWebView. The problem is that I want to pause the video when a user brings up modal dialog windows, rather than clear or stop the video as many have suggested. This is critical to a good user experience. Does anyone know any JavaScript or API that I can run to simply pause the video when an action that presents a modal dialog will occur?
The method I use to embed is described here.
http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html
This blog explains hot to build a video in HTML 5.
http://blog.steveheffernan.com/2010/04/how-to-build-an-html5-video-player/
Then interact with the video player via the method [myWebView stringByEvaluatignJavaScriptFromString:#"playVideo()"].
I didn't tested but it seems straightforward.
Are you sure we can play embedded YouTube videos in mobile Safari?
Good luck!
Have you tried going through official docs?
https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/ControllingMediaWithJavaScript/ControllingMediaWithJavaScript.html
Related
I am currently working on a google chrome extension that features a content script for altering youtube pages. I have done some work with altering the DOM already and all of that works, however, I have been looking for solutions to have the youtube video pause when the page loads.
I initially thought perhaps I could simulate a keystroke as the spacebar pauses youtube videos. I also tried using javascript to pause the video but I don't think it works with Youtube's custom video player.
Don't feel obligated to write any code for this but if someone could point me in the right direction I would be very grateful.
On the main page of a video, the HTML5 video element playing the video has a specific class, so you can target that; and as an HTML5 video element, it has the play() and pause() methods already.
document.querySelectorAll('.html5-main-video').forEach(vid => vid.pause());
That will pause all HTML5 main videos on the page. Helpfully enough, that's the same class used by the little autoplaying video on some channel pages, so it should work for those as well :)
(Don't worry about Flash videos; YouTube hasn't supported those for years now.)
I am creating all in one music app using multiple APIs. I want to stream only audio of youtube song. As i searched a lot but could not find actual solution. many of them says it will be against Youtube TOS. If it is so than how "StreamUs" chrome extension is working. I am not creating something this but i want to stream a song audio only as it is in above extension.
Thanks in advance.
author of Streamus here. Just dropping in to give a definitive answer.
Chrome extensions can utilize both an invisible, permanent background page as well as a visible, temporary foreground page. When the foreground page loses focus - it is destroyed and all content is unloaded from memory.
Streamus hosts the YouTube video player on the background page which gives the illusion that the video is not loaded. It pipes all commands from the foreground UI to the background page.
However, it's worth noting that this is a violation of YouTube's Terms of Service. I've been working with YouTube to figure out a good solution to the problem and am almost there with a clever way to present video in the foreground without losing the audio. :)
Unfortunately it does pull the video as well for bandwidth, but good question.
as quoted by the author in
https://www.reddit.com/r/streamus/comments/1w64wj/question/ .
I've built a microsite, that play random songs with Spotify. On desktop-browsers, there is no problem - I play the preview_urls - perfect! But on iPhone (iOS), the preview_url has no response - my player isn't play the preview. Looks like Safari couldn't load the song.
I've built the player with howler.js.
http://glui.me/?i=q229w7c61iyb02c/2014-06-30_at_17.23.png/
Anyone same problem with Spotify and iOS/Safari? Anyone an idea whats going wrong here?
Thank you!
Audio is locked on iOS until a sound is played within a user interaction (like a 'touchstart' event). v1.1.22 of howler.js has implemented a new feature that will try to automatically unlock the audio, but depending on your UI setup it may be a good idea to show an overlay of some sort that requires the user to touch the screen before they can use the app, thus unlocking the audio.
The howler.js docs have been updated explaining this: https://github.com/goldfire/howler.js#ios-playback
I've taken a look at the YouTube API and it seems quite clear (for security reasons) that the player (embedded or not) does not allow YouTube video to automatically initiate full screen once loaded.
I wondered if there was a way to do this using Javascript to act as if the user had pressed the full screen button?
Any ideas shared would be greatly appreciated.
I'm afraid you can't use the YouTube player API to initiate fullscreen programatically.
This is because the underlying issues with fullscreen in flash and html5 video would make such an api method seriously error-prone.
Official response to back me up:
https://groups.google.com/forum/#!msg/youtube-api-gdata/Tyv3vTw0RQk/449KahYVNFYJ
I'm currently creating an iPhone web application for piano chords, and I wanted to add an option that would let the user press a Play button and play the selected chord. However, I'm not sure how to do this, or if it's even possible.
Basically, is there any way to programmatically (through Javascript) play a sound file (wav, mp3,...) in the background? (i.e. not leaving the page)
Thanks for any help!
(Keep in mind that I'm developing a web app, so I'm using HTML, CSS & JS, not the native SDK)
short answer: no
from the docs:
Safari on iPhone plays audio and video
in webpages in fullscreen playback
mode only.
yes you can.
http://www.schillmania.com/projects/soundmanager2/
see it in action at soundcloud.com
With HTML5 audio, iPhone can play without fullscreen.
IOS requires sound be played with the press of a control button. If you are looking to autoplay a sound at some event on an HTML page, forget it.