Video.js for Vimeo - html5-video

I use video.js for vimeo. Played on the desktop in a custom player with my styles, it's good, but on the tablets and mobiles played in a default browse player. Why? I want custom player in mobile too. Can you help me?

In a recent version video.js was updated to use the custom skin on touch devices, so you might try updating your version. But this will still only make a difference on tablets that don't go to fullscreen video. On iOS devices and most(?) android devices, whenever the video goes to fullscreen it uses the native controls, and there's nothing we can do in the browser to change that. Hopefully in the future the devices will adopt the requestFullscreen browser API so we can use custom controls in that context.

Related

WebRTC picture capturing doesn't work on smartphones

I'm trying to get an image capture from the front or back camera of my smartphone using the WebRTC. I used one of WebRTC samples for that. This code works perfectly in browsers on the computer, but on the smartphone with different operating systems (iOS, Android) I get a black screen in the tag <video autoplay></video>. I tried various browsers, in none of them the image capture function worked properly, everywhere a black screen was displayed. What should I do to capture the picture?
I have a http connection, all my smartphones and cameras work fine, so the problem is definitely in WebRTC (or in its use).
For Safari, try adding playsinline to the video element. See this thread for background information.
If that doesn't help you might want to check the mediastream as well as the video elements readyState property.

Restrict Fast Forward iPhone video.js

I'm having a hard time trying to figure out how to restrict fast forwarding for videos playing in an iPhone. Does anyone have any advice?
Unfortunately you can't. iOS doesn't allow customisation of controls in full screen playback, and playback is always full screen on iPhone.

HTML5 Video - Auto select correct resolution

I'm working on a page that has a list of houses for sale. Each listing has a short video with the option of watching in the page or full screen.
I'm struggling a little with having the videos on the page at one resolution and the fullscreen at a higher resolution - this is needed especially for devices that automatically go fullscreen when the play icon is pressed.
I've had good results with video.js (http://www.videojs.com/) for the page resolution but it doesn't appear to support resolution change on fullscreen. I found this thread with comments about the HTML spec and changing resolution mid-stream: https://github.com/videojs/video.js/pull/233.
I'm told the embedded Youtube player selects the correct resolution automatically but the branded player makes this a non-starter.
Also I've found that in IE10 without Flash that the embedded Vimeo player doesn't function and in Chrome without Flash the Vimeo and Youtube players fail as well... so much for HTML5!
So anyone have a solution for showing video at the correct resolution (low/high) for the state of the player (contained/fullscreen)?
Your question answered a query of mine. It looks like auto switching resolution is still not implemented in videoJS other than for YouTube videos. There is a demo at videoJS Resolution Switcher and you can see in the console that changing window resolution to full screen has no effect.
I've been using the JWPlayer for several years with no problems at all. It reliably supports auto switching has many features and very good support.

Vimeo videos not playing on iPad UIWebView

Ok so I've looked around at the majority of other problems people are getting with vimeo and I don't think they've hit upon the same issue I've been getting.
When I open up a vimeo video on the Safari app on both my iPhone and iPad, they both work fine no problems.
Now I have created an iPhone app which has a UIWebView and loads a vimeo player video and that works fine too.
The issue is if I now install the same app on my iPad, the vimeo player refuses to load the video, it just hangs and the spinner keeps on spinning but the video won't load.
However, now what I did after that was create a basic app which loads a vimeo player URL in a UIWebView as a native iPad app, not an iPhone app which is resized or "2x" to fit an iPad. Surprisingly, this worked fine.
So now I'm confused... why is it that the iPad will not play the vimeo video if it's not running an app designed for the iPad? Is there some special magic going on behind the scenes which might break this?
I'm at a loss here, any help would be appreciated
Implement the delegate method : shouldStartLoadWithRequest then in that method just detect that whether the requested URL is of type VIDEO if it is then please follow the code given in below link which worked for me :
Playing a video file from server in an Iphone app
This will be good in playing any video.
The problem is likely with the user agent which is different from Safari's one on Apple devices: UIWebView sends some invalid string causing Vimeo (and sometimes YouTube) to break.
Luckly, you are allowed to override app's user agent using the following (C#, let me know if not clean enough):
NSDictionary dictionary = NSDictionary.FromObjectAndKey(new NSString("Mozilla/5.0 (" + (UIDevice.CurrentDevice.Model.Contains("iPad") ? "iPad" : "iPhone" ) + "; CPU OS 6_0 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10A403 Safari/8536.25"), new NSString("UserAgent"));
NSUserDefaults.StandardUserDefaults.RegisterDefaults(dictionary);
This makes the videos play just fine.

Mimic versatile behaviour of Apple's UIWebView with Sencha Touch

Given a URL to a...
PDF, Apple's UIWebView component will display the PDF in the PDF
reader.
video, Apple's UIWebView component will display the video in
the video player.
music file, Apple's UIWebView component will play
the music in the video player.
What is the best way to mimic this functionality in Sencha Touch?
Many thanks
EDIT: Also, how do you display a website in a panel? I've tried using an embed and an iframe, but these aren't scrollable on the device.
I don't understand, this should work just like that? Are you thinking of rendering pdf/video/music inside Sencha Application?
If yes, check out Sencha examples for audio/video. For pdf you will need some new code. I would suggest using pdf.js inside Sencha panel, haven't tried it though.
This was answered in sencha touch :: how to create a panel for website-preview inside iFrame.
Anyway, if you want to get the same effect as a UIWebView in senchatouch, I recommend using PhoneGap as long as your intention is that your webapp is used only on mobile devices. PhoneGap Plugins available to use the native WebViews each mobile OS. The plugin, both for IOS to ChildrenBrowser called Android. Sorry about the other systems can not help more.
Without a lot of hacky code, you can't.