The Deep link to embed pickup and dropoff locations work on iOS, but when they are tested on Android, they do not work. On Android instead of embedding pickup and dropoff locations, the deep link simply opens the Uber app. I think there may be an issue with my Javascript, as I think the logic and actual deep link are working properly.
Any help would be extremely appreciated.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Emails</title>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.js"></script>
<script type="text/javascript">
$(function() {
// Parse the user agent to determine the device
var isiPad = navigator.userAgent.match(/iPad/i) != null,
isiPhone = !isiPad && ((navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null)),
isiOS = isiPad || isiPhone,
isAndroid = !isiOS && navigator.userAgent.match(/android/i) != null,
isMobile = isiOS || isAndroid,
isDesktop = !isMobile;
// Define all the potential redirection Urls
var deepLink = 'uber://?action=setPickup&pickup=my_location&dropoff%5Blatitude%5D=33.784685&dropoff%5Blongitude%5D=-84.4121&dropoff%5Bnickname%5D=Apartment%20of%20Paul%20Jump&dropoff%5Bformatted_address%5D=1100%20Howell%20Mill%20RD%2C%20Atlanta%2C%20GA%2030318',
appStoreUrl = 'https://itunes.apple.com/us/app/uber/id368677368',
androidIntentUrl = 'intent://uber/#Intent;package=com.ubercab;scheme=uber;end',
muberDotCom = 'http://m.uber.com';
// Handle each case with a seamless fallback to the application store on mobile devices
if (isiOS) {
window.location = deepLink;
setTimeout(function() { window.location = appStoreUrl; }, 25);
} else if (isAndroid) {
window.location = androidIntentUrl;
} else if (isDesktop) {
window.location = muberDotCom;
}
});
</script>
</head>
<body>
</body>
</html>
It's because you haven't even defined the variables you want, where are the pickup and dropoff locations in this URI:
androidIntentUrl = 'intent://uber/#Intent;package=com.ubercab;scheme=uber;end',
Just use deepLink for when isAndroid is true, like:
if (isiOS) {
window.location = deepLink;
setTimeout(function() { window.location = appStoreUrl; }, 25);
} else if (isAndroid) {
window.location = deepLink;
setTimeout(function() { window.location = 'https://play.google.com/store/apps/details?id=com.ubercab&hl=en_GB'; }, 25);
} else if (isDesktop) {
window.location = muberDotCom;
}
Related
I am facing one issue in my HTML page actually I need to implement the below-
I need to change my image on the basis of Browser change .So, when I am browsing with Chrome it should load Image1 or if I am browsing with IE then load Image2. Please find the below code which I am using but it is not working for me
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script language="javascript">
function browsercheck() {
var userAgent = window.navigator.userAgent;
return (userAgent.indexOf("MSIE ") > 0 || !!userAgent.match(/Trident.*rv\:11\./));
}
function displayImage() {
debugger;
var browser = browsercheck() ? 'IE' : 'Chrome';
if (browser == "IE") {
document.getElementById("image").setAttribute("src", "Image1.jpg");
}
else if (browser == "Chrome") {
document.getElementById("image").setAttribute("src", "Image2.jpg");
}
}
</script>
</head>
<body">
<img id="image" this.src="displayImage()" alt="can't display picture" />
</body>
It's simpler to maintain if you distribute responsibilities between CSS and JavaScript. Let each do what it's meant to.
<script>
var browser = browsercheck() ? 'ie' : 'chrome';
document.body.className += ' ' + browser; // vanilla JS
// $('body').addClass(browser); // jQuery version
</script>
<style>
.image {
background-image: url("regular.jpg");
}
.chrome .image {
background-image: url("chrome_specific.jpg");
}
.ie .image {
background-image: url("ie_specific.jpg");
}
</style>
This JSFiddle shows example of Browser Detection https://jsfiddle.net/311aLtkz/
I think script did not work for you, because you had a function, and you did not use that function on page. Edited code should work when page in opened
function browsercheck() {
var userAgent = window.navigator.userAgent;
return (userAgent.indexOf("MSIE ") > 0 || !!userAgent.match(/Trident.*rv\:11\./));
}
var browser = browsercheck() ? 'IE' : 'Chrome';
if (browser == "IE") {
document.getElementById("image").setAttribute("src", "Image1.jpg");
console.log("IE");
}
else if (browser == "Chrome") {
document.getElementById("image").setAttribute("src", "Image2.jpg");
console.log("Chrome");
}
I'm trying to add a textarea resizer plugin on my MVC project, but only for IE, since other browsers have a built-in one. In order to do that I have to check if the browser is IE.
I used the JS from this article:
How to detect IE11?
So this is what I use:
function getInternetExplorerVersion() {
var rv = -1;
if (navigator.appName == 'Microsoft Internet Explorer') {
var ua = navigator.userAgent;
var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
if (re.exec(ua) != null)
rv = parseFloat(RegExp.$1);
}
else if (navigator.appName == 'Netscape') {
var ua = navigator.userAgent;
var re = new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})");
if (re.exec(ua) != null)
rv = parseFloat(RegExp.$1);
}
return rv;
}
function checkVersion() {
var msg = "You're not using Internet Explorer.";
var rv = getInternetExplorerVersion();
if (rv > -1) {
msg = "You are using IE " + ver;
}
alert(msg);
}
I inserted it in my scripts folder and I access it through this line in Scripts section:
<script type="text/javascript" src="~/Scripts/checkIEVersion.js"></script>
Then I try to implement it on pageload:
<body onload="checkVersion()">
The problem is, nothing happens. I should get an alert, but I get no error, no nothing. When I use only the bottom of the two functions (in the Scripts section with "#(document).ready", it does load correctly.
Could you please assist me?
Thanks in advance!
Turns out I had to include this too:
$(document).ready(function () {
window.onload = function () {
checkVersion();
}
});
I am using ng auth token and rails devise token, when i am login in ios safari the window is stuck on the "redirecting" window and does not close the window.
This is the code that run to close the window:
<!DOCTYPE html>
<html>
<head>
<script>
var usingExternalWindow = function() {
var nav = navigator.userAgent.toLowerCase(),
ieLTE10 = (nav && nav.indexOf('msie') != -1),
ie11 = !!navigator.userAgent.match(/Trident.*rv\:11\./);
return !(ieLTE10 || ie11);
}
if (usingExternalWindow()) {
window.addEventListener("message", function(ev) {
if (ev.data === "requestCredentials") {
ev.source.postMessage({
<%= yield %>
}, '*');
window.close();
}
});
} else {
window.location.href = "<%= #auth_origin_url %>";
}
</script>
</head>
<body>
<pre>
Redirecting...
</pre>
</body>
</html>
In all other browsers this is working fine and here its seems like the postMessage does not send to the new tab.
I am trying to detect browser types and IE compatibility from user agent and redirect accordingly. It works only in IE but not in Firefox and Chrome. I am still looking around the solution and cannot figure out yet.
<html>
<head>
<title>Testing </title>
<script src="UserAgent.js" type="text/javascript"></script>
</head>
<body>
<div id="results">Output</div>
<script type="text/javascript">
if (UserAgent.firefox){
window.location.href("http://www.yahoo.com");
}
if (UserAgent.compatibilityMode) {
window.location.href("http://192.168.10.236/iecorrect.html");
} else {
window.location.href("http://www.apple.com");
}
</script>
</body>
</html>
UserAgent.js
if (typeof jQuery == 'undefined') {
document.write("\<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'>\<\/script>");
}
// Create new object
var UserAgent = {
init: function () {
// Get the user agent string
var ua = navigator.userAgent;
this.compatibilityMode = false;
this.firefox = ua.toLowerCase().indexOf("firefox") > -1;
this.chrome = ua.toLowerCase().indexOf("chrome") > -1
if (ua.indexOf("MSIE 7.0") > -1) {
this.compatibilityMode = true;
}
}
};
// Initialize the object
ieUserAgent.init();
Change your window.loacation.href calls to the below code:
if (UserAgent.compatibilityMode) {
window.location.href = "http://192.168.10.236/iecorrect.html";
} else {
window.location.href = "http://www.apple.com";
}
You wrote them like you would write jQuery :)
To check for IE and/or a specific version of IE you are better off using conditional statements.
http://www.quirksmode.org/css/condcom.html
I am building an with cordova.js library [version 3.4.1] and I would also like to debug it as web page directly using the web browser.
There are some issues in iOS emulator when loading dynamically the external cordova.js library [I have 2 version specific for android and iOS]
I have this piece of code in place to deal with this:
//check if mobile or local browser:
var isMobile = true;
if (document.URL.indexOf("local") > 0) {
isMobile = false;
}
var deviceReadyDeferred = $.Deferred();
var jqmReadyDeferred = $.Deferred();
function onDeviceReady () {
deviceReadyDeferred.resolve();
}
if (isMobile) {
$(document).bind('mobileinit', function () {
$.mobile.allowCrossDomainPages = true;
jqmReadyDeferred.resolve();
var useragent = navigator.userAgent;
var loadScript = function (url) {
url = url.replace(/\//, '\\/');
document.write('<script charset="utf-8" src="' + url + ' "><\/script>');
};
if (/Android/i.test(useragent)) {
$.getScript('js/lib/cordova_android.js', function (data, textStatus, jqxhr) {
document.addEventListener("deviceReady", onDeviceReady, false);
});
} else {
loadScript('js/lib/cordova_ios.js');
setTimeout(function () {
document.addEventListener("deviceReady", onDeviceReady, false);
}, 500);
}
});
} else {
jqmReadyDeferred.resolve();
onDeviceReady();
}
So when the page is requested with localhost... then the isMobile is set to false.
Is there a reason why iOS [6.1] does not load the external script like Android did [with jQuery getscript ] instead than the horrible hack ? I tried to debug and it seems that iOS is reporting status error 400 when requesting the script.
Followed the logic used in this other SO question:
Issue with dynamically loaded phonegap.js
UPDATE:
Following the suggestion of the accepted answer, I rewrote the whole function and now it is working well both in iOS / ANDROID and local browser:
var deviceReadyDeferred = $.Deferred();
var jqmReadyDeferred = $.Deferred();
(function () {
//check if mobile or local browser:
var isMobile = true;
var useragent = navigator.userAgent;
var cordova_js = 'cordova_';
if (/Android/i.test(useragent)) {
cordova_js += 'android.js'
} else if ((/iPhone/i.test(useragent)) || (/iPad/i.test(useragent))) {
cordova_js += 'ios.js'
} else {
// local browser testing
isMobile = false;
jqmReadyDeferred.resolve();
onDeviceReady();
}
if (isMobile) {
$(document).bind('mobileinit', function () {
$.mobile.allowCrossDomainPages = true;
jqmReadyDeferred.resolve();
var url = document.URL;
url = url.substring(0, url.lastIndexOf("/"));
$.getScript(url + '/js/lib/' + cordova_js, function (data, textStatus, jqxhr) {
document.addEventListener("deviceReady", onDeviceReady, false);
});
});
}
function onDeviceReady () {
deviceReadyDeferred.resolve();
}
})();
Your isMobile check is prone to break. Think of a remote URL like this:
http://www.somesite.com/local/foo/bar
And probably the "local" URL in iOS looks different. Try logging the document.URL in iOS to check, or maybe show it in an alert if console is not an option.