AngularJS: How to open native video player on mobiles - angularjs

I am using vjs-video AngularJS plugin for rendering videos in my app. On desktop it shows them in ngDialog (by binding dialog window to ng-click of gallery element)
It's working ok, but on the mobiles I want to show native fullscreen player right after user clicked (tapped) gallery item. I know how to detect mobile and desktop in Angular app, but what to do next? Right now user have to tap on gallery item and then dialog is showing, after that user should make second tap on video.js player in dialog and then video start to play in native player, but I want to open native player right after first click.

Have you tried the JavaScript "requestFullscreen" api?
var elem = document.getElementById("myvideo");
if (elem.requestFullscreen) {
elem.requestFullscreen();
}
Here's a link to the mozilla docs on this api.
And here's a link to screenfull.js, a library that's supposed to make this even easier.

Related

VideoJS not opens the native safari player ( when user clicked on Fullscreen Button)

what i want is :
in Safari,
keep the Customized Controlbar UI untill user not Clicked on fullscreen,
if user clicked on fullscreen
open the native safari player.
the problem is:
i keep the UI in safari but i don't know how to opens the native safari player after user clicked on fullscreen
tools that i use:
videojs - videojs plugins - ReactJS.
in the Demos of Videojs this Feature is work as well but i don't know why in my project is not working !
is it possible the bug were from my css file ?
i did lots of searches in github issues all of the answers was about that the Safari is not Support the fullscreen API but what i want is to findout why the existing feature in Videojs is Not working in my Project !

Adding navigation control to my google map

Im running react (in the web browser not native) with the react-google-maps component. I want to enable the navigation button (see the red marker) so the map can be opened in my native app. Any suggestions? See the 2 pictures
It doesnt seems like the google maps api has any controls out of the box. A workaround for me is to implement the directionsbutton and https://developers.google.com/maps/documentation/urls/guide from google. When the link opens it will open in the native app if its installed on anroid or ios

Opening contact list on button press

. I am building a mobile application in react native .I need to see the contact list on my phone after clicking a button in the header in a screen , Can anyone suggest me some solutions

when click on button or icon i want to open uber mobile application in my mobile using angular js in ionic

I Want to use Uber Ride Requests via click on icon or button in my mobile application which is in ionic-angularJS so if user want he can book his Ride using from my mobile application.
That can be done with a cordova plugin, called StartApp (https://github.com/lampaa/com.lampa.startapp).
You will need to know the schema for both Android and iOS of the app that you want to open.
This link might be useful:
http://www.gajotres.net/how-to-launch-external-application-with-ionic-framework/

ReactJS project on Android WebView, Image not showing

I am currently experimenting on a hybrid app using ReactJS for my front-end loaded inside an Android WebView. On one of the pages, I have a list that loads an external/hosted image. Tapping on these images routes to another page that shows its description (using react-router. history=hashHistory).
Testing on the browser(chrome), the images appear once loaded. On the other hand, testing on the actual device, the images does not appear. Only when I tap the list item and press back (hashHistory.goBack) that it appears.
I know this is not the best use for ReactJS, but this is better than what we are currently using. Also, our current setup prevents us from pursuing the React Native way. Any ideas?
EDIT:
here's a screen cap:
You need to change your websettings in your code.
WebSettings settings = webView.getSettings();
settings.setDomStorageEnabled(true);

Resources