Cordova Angularjs ask for GPS - angularjs

I program an app where I need GPS.
If the GPS is off, how can I ask the user to turn on GPS, like google maps? After a while of googleing I found nothing compareable...
My other question is, why I get "Use location? - 2", when the GPS is off? I thought, if the GPS is off, $window.navigator.geolocation is false?
controller.js
if ($window.navigator && $window.navigator.geolocation) {
function success(pos) {
$rootScope.position = { x: pos.coords.latitude, y: pos.coords.longitude };
}
function fail(error) {
alert("Use location? - 2");
}
$window.navigator.geolocation.getCurrentPosition(success, fail, { maximumAge: 500000, enableHighAccuracy: true, timeout: 6000 });
} else {
alert("Use location? - 1");
}

There are many plugins that promess to help you get if your gps is enable. Then you can ask the user to change Location Settings. One of them is the Diagnostics Plugin https://www.npmjs.com/package/cordova.plugins.diagnostic . I am using it. (al least to call the Location Settings).

The cordova-plugin-request-location-accuracy cordova plugin does trigger the native dialog window to ask the user to enable GPS from the app without having to navigate to the phone's settings and then back to you app.
https://github.com/dpa99c/cordova-plugin-request-location-accuracy
Only down side is that it only works on Android. It's not possible to turn on GPS from your app on iOS devices with this plugin. BUT, as mentioned in the plugin's documentation, you can use the cordova.plugins.diagnosticplugin to navigate to the phone's settings and manually turn on the GPS as a fallback for iOS devices.
I have done a lot of research on that and at the moment, this is the best solution I have found so far. I know the the Google Maps app on iOS does it, so it should be possible from a Cordova plugin, but I guess no one has done it yet.

Related

access googledrive or icloud from app using codenameone

I want to manually allow user to save the the data from app directly to google drive or iCloud. Suppose, I have an image and when user clicks save button he need to get option to save to icloud or google drive anyone of these in the iOS device. How can i achieve this in codenameone are there any plugin, api or library avaliable? As goggle provided google-api-services for android application. How I achieve this in iOS.
Thanks for your help.
Doing this with an image should be easy. Just use the share feature in Codename One:
// will return false on the simulator but work in iOS/Android
if(Display.getInstance().isNativeShareSupported()) {
Display.getInstance().share("", fileSystemPathToImage, imageMimeType);
}
Suggestions of where to save should be based on the things available in your device e.g. Facebook, iCloud, Drive, Dropbox etc.

Late broadcast from Network Information plugin Cordova/Ionic

Hi I had a lot of testing rounds on this but not able to get exact solution so posting for help.
I am having my app in Ionic not Ionic2
Using plugin for network is "Network Information" cordova-plugin-network-information 1.3.0 "Network Information" Link
Scenario:
When user minimizes app and goes to background and turn off the network source like WiFi, Mobile Data and comes back to app home page the plugin. methods returns true for network in first place and after some time getting Broadcast saying now network is offline
Expected behaviour:
Should receive Broadcast on turning network source like WiFi, Mobile Data On or Off, so I can handle in app.
My source code for Broadcast who responded to network events in $ionicPlatform.ready in app.js is mentioned below:
//listen for Online event
$rootScope.$on('$cordovaNetwork:online', function (event, networkState)
{
console.log("BR got inside online -- App " + networkState);
$rootScope.isonlineState = true;
console.log("BR got inside online getNetwork-- App " + $cordovaNetwork.getNetwork());
console.log("BR got inside online isOnline-- App " + $cordovaNetwork.isOnline());
})
// listen for Offline event
$rootScope.$on('$cordovaNetwork:offline', function (event, networkState)
{
console.log("BR got inside offline -- App " + networkState);
$rootScope.isonlineState = false;
console.log("BR got inside offline getNetwork-- App " + $cordovaNetwork.getNetwork());
console.log("BR got inside offline isOnline-- App " + $cordovaNetwork.isOnline());
})
I debugged this scenario so many times but still not able to get right behaviour only on iPhone.
Please share your experiences on this so would help me to solve the issue.
Thanks in advance.
Finally after couple of days of struggle I figured out that there is no way in this plugin to notify you other than it's BrodcastReceivers, thats fine but When in off network your app comes from background to Foreground and you call APIs then you see your app's page is trying to call APIs(because plugin methods returning isOnline to true) but they should not as there is no network and after few seconds you receive Broadcast saying You are offline now.
Solution
So the best way is to call the update to your pages from Background to Foreground is from BroadcastReceiver.. call another your Local BrodacstReceiver to update the page based on network events.
I posted question on Ionic forum as well but I didn't receive anything constructive.
Hope this helps to other facing same issue and needs solutions on that... :)

Touch Events not working with Google Maps in Angular

I am using Google Maps javascript API within an angular application. When using the app in Google Chrome on a regular desktop machine with a mouse, various navigation features (pan/zoom) work in the google maps part of the application just fine. However, when I try to use touch gestures on a windows 8.1 screen, the maps do not recognize any of the pan or zoom gestures. If I pinch to zoom, nothing happens. If I double tap on the screen like a mouse, then maps will zoom in. If I drag with a finger, the browser window handles the touch events instead of the maps div, so left and right navigates page history and up and down dragging scrolls the whole page instead of panning the maps.
As another experiment, I tried using google maps http://maps.google.com itself inside of Chrome, and it worked fine. So that means that it can be done somehow....
So, is it a viewport meta tag type of thing? Or does it have to do with sizing the map element? Or is it an angular thing and we need to do something with ngTouch somehow to allow the app to respond to touch events?
Update: the touch events do work on the same page on an iPad. I'm not sure what that says, but it's encouraging that at least it works on mobile safari. It seems that we need to communicate something to Angular to tell it to accept the touch events.
UPDATE
This issue was handled in the bug
https://issuetracker.google.com/issues/35824421
and was solved in version 3.27 of Google Maps JavaScript API in December 2016.
Putting the following code before the google maps api script tag helps me. But, unfortunately, it continues to disable mouse events. Please, can we a find a solution for Google Maps API with both touch and mouse support?
This solution in place of setting the application boot flags of '--user-agent chrome' or '--user-agent safari'
<script>
navigator = navigator || {};
navigator.msMaxTouchPoints = navigator.msMaxTouchPoints || 2;
//navigator.maxTouchPoints = navigator.maxTouchPoints || 2;
//window.ontouchstart = window.ontouchstart || function() {console.log('this is touchstart!');};
</script>
Note that only the first two lines are used, the other two are commented out and were not required.
My inspiration for this solution is from: https://hacks.mozilla.org/2013/04/detecting-touch-its-the-why-not-the-how/ so thank you to Patrick and Robert.
This is in fact a Google Map bug #6425
The fun fact is that Google Map API is not serving the same content based on the User Agent. So, for some use case, the workaround is to spoof the User Agent, ether by :
Chrome Dev tool > Emulation > Model
a user agent spoofing extension
--user-agent chrome flag
Any android or iOS device will work, changing the default desktop google map app to a mobile like app. Drag and pinch will work again on this mobile like app.
After some testing, the minimal UA that switches to the mobile like app is "Chrome" or "AppleWebKit/537", but it sounds hazardous to use it, as it may very well change in the future.
For my purpose, chrome based kioks, this will do the trick until the bug is fixed.
I used the above solution and modified for it to work with a mouse as well
<script>
function MapTouch() {
return true == ("ontouchstart" in window || window.DocumentTouch && document instanceof DocumentTouch);
}
if (MapTouch() === true) {
navigator = navigator || {};
navigator.msMaxTouchPoints = navigator.msMaxTouchPoints || 2;
}
</script>
I had the same problem.
JJ Stiff's solution enabled the touch events.
Apparently if you also want the mouse to work, you have to add the following line:
navigator.msPointerEnabled = true;

Local image for marker icon on Cordova/Phonegap Google Maps Plugin

Is it possible to use an image locally store on the device as the marker icon? I can use a URL and it works, but when I try to use a local image it won't load. How should I reference the image? This is a multiplatform application so I can't use device specific paths like Android file:///android:asset/
map.addMarker({
'position': new plugin.google.maps.LatLng(13.7579507,100.5643353),
'title': 'Fortune Town',
'icon': '../templates/icon2.png'
}, function(marker) {
marker.showInfoWindow();
});
I am using Ionic Framework (which uses AngularJS) and Apache Cordova with the Google Maps plugin from https://github.com/wf9a5m75/phonegap-googlemaps-plugin/
It doesn't make too much sense but this is what worked:
'icon': 'www/templates/icon2.png'
Use a storage plugin, like Cordova Storage, and pull it from there, or a local database. http://docs.phonegap.com/en/1.2.0/phonegap_storage_storage.md.html
Capturing and storing a picture taken with the Camera into a local database / PhoneGap / Cordova / iOS

How to remove location services request from PhoneGap iOS 6 app?

I am using PhoneGap 2.8 to create an iOS 6 app. I am building it in XCode, not using PhoneGap Build. My app does not require location services, but uses the camera. Every time it returns from the camera.getPicture() call, it shows a dialog to allow my app to use location services. If I say no, or location services are disabled, the photo does not get passed back to my app.
This happens even if I deny the camera app location services in the privacy settings. I have also edited my config.xml and removed all references to CDVLocation. There are no references to navigator.geolocation in my javascript code.
Why is it asking for location services? Is there somewhere else in my XCode project I need to remove this permission, or exclude a phonegap module? Does iOS 6 display this prompt to any app that uses the camera, even if the user has already blocked the camera from using location services?
Thanks for any assistance.
It seems that Phonegap automatically add EXIF data to Jpeg image taken with the camera which in turns triggers the location services alert.
There are two ways to prevent that from happening:
1 - Specify PNG for the format of the captured picture (by default phonegap uses JPEG which contains EXIF data)
encodingType=navigator.camera.EncodingType;
function capturePhotoEdit() {
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { encodingType: encodingType.PNG, destinationType: destinationType.DATA_URL });
}
2 - If you want to use JPEG instead of PNG images, you will have to comment out these lines in CordovaLib/Classes/CDVCamera.m between lines 312 and 322. This is the code that adds the EXIF data to the picture.
NSDictionary *controllerMetadata = [info objectForKey:#"UIImagePickerControllerMediaMetadata"];
if (controllerMetadata) {
self.data = data;
self.metadata = [[NSMutableDictionary alloc] init];
NSMutableDictionary *EXIFDictionary = [[controllerMetadata objectForKey:(NSString *)kCGImagePropertyExifDictionary]mutableCopy];
if (EXIFDictionary) [self.metadata setObject:EXIFDictionary forKey:(NSString *)kCGImagePropertyExifDictionary];
[[self locationManager] startUpdatingLocation];
return;
}

Resources