jquerymobile href links not visibiel with phonegap on android and iOS - android

I am building a phonegap based mobileweb application which is built almost completely with jquerymobile.
In couple of pages, there are links to external sites and the client wants to show a popup asking if the user is willing to leave the app and go to the external site. Client also asked that the application shall exit if the user chooses to follow the link.
Here is my JS:
if (typeof CORP == "undefined" || !CORP) {
var CORP = {};
}
(function() {
CORP.mk = {
var mobile = false;
init: function() {
$("[data-role='page']").on("pagebeforeshow", CORP.mk.setHandlers);
},
onDeviceReady: function () {
CORP.mk.mobile = true;
document.addEventListener("pause", CORP.mk.onPause, false);
},
onPause: function () { // Exit the app if it goes to background
navigator.app.exitApp();
},
setHandlers: function () {
if ( CORP.mk.mobile ) {
$("a[rel='external']").click(function (e) {
e.preventDefault();
CORP.mk.externalLink = $(this).attr("href");
alert(CORP.mk.externalLink);
navigator.notification.confirm("You are about to close this mobile app and open your web browser.",
CORP.mk.popupConfirm,
"Close This App?");
});
}
}
};
})():
$(document).bind("pageinit", CORP.mk.init);
document.addEventListener("deviceready", CORP.mk.onDeviceReady, false);
Here is my markup:
<a rel='external' data-ajax='false' href='http://www.google.com'>googly</a>
Problem: I tested this code ignoring CORP.mk.mobile on chrome desktop browser and it works fine. However $(this).attr("href"); always returns '#' for the href in Android or IOS and I cannot launch external application with phonegap. I want to be able to get the actual link and launch external app. I tried many combinations and couldn't find a solution. Appreciate any insights.

Finally found the issue. This is happening due to e.preventDefault(); which is replacing the link. I am surprised that this doesn't happen in desktop browsers..
So, instead of
e.preventDefault();
CORP.mk.externalLink = $(this).attr("href");
I need to do
CORP.mk.externalLink = $(this).attr("href");
e.preventDefault();

Related

Nativescript-vue save cookies on Android

I'm creating a simple webview app using nativescript-vue where there is nothing else in the app except the webview that loads a website fullscreen.
On iOS it works great, I can log in to the website turn the app off and on and I'm still logged in.
On Android, the cookies are not saved and you have to log in again every time you turn the app off.
Any way I can enable cookies in the webview for Android?
I couldn't make it work with cookies, so I had to switch and use localstorage as a backup for saving tokens instead of cookies.
Here is how my final version looks:
<template>
<Page>
<WebView #loadStarted="onLoadStarted"
#loaded="onWebViewLoaded"
src="https://yoururl.com/"
/>
</Page>
</template>
<script>
import { isAndroid } from "tns-core-modules/platform"
export default {
methods: {
onLoadStarted (webargs) {
if (isAndroid) {
const webView = webargs.object;
webView.android.getSettings().setDomStorageEnabled(true) // This will enable local storage
}
},
onWebViewLoaded(webargs) { // I use this only to disable the default zoom buttons
if (isAndroid) {
const webView = webargs.object;
webView.android.getSettings().setDisplayZoomControls(false)
webView.android.getSettings().setBuiltInZoomControls(false)
}
},
}
};
</script>
Apparently, you should be able to enable cookies doing this (at least for newer SDK users):
webView.on(WebView.loadStartedEvent, (args) => {
webView.android.getSettings().setAcceptThirdPartyCookies(webView, true)
});
But that didn't work as expected as it seemed like sometimes it would save cookies and sometimes it won't or sometimes it would remove cookies (when you log out) and sometimes not.
I hope this info helps someone as it sure seems there is little to none info about this especially if you aren't much familiar with pure Java Android development.
This code should work
const webView = webargs.object;
if (android.os.Build.VERSION.SDK_INT >= 21) {
android.webkit.CookieManager.getInstance().setAcceptThirdPartyCookies(webView.android, true);
}

How to implement WAIT for screen elements load in ionic 2 hybrid mobile application using protractor

How to implement wait for screen elements load in ionic 2 hybrid mobile application using protractor.
As I am testing the IONIC Mobile application and not able to use wait without browser.sleep(), Because browser instance is not working in application.
Please help me to resolve this issue.
It's been a while, but I've had some success testing Ionic with Protractor with the following helper method:
waitForIonic: function () {
//Register a promise with protractor, so the browser waits for it
var deferred = protractor.promise.defer();
let clickBlock = element(by.css('.click-block-active'));
//if there's a click block, wait for it to be gone, otherwise just wait 1 sec
if (clickBlock.isPresent()) {
var untilClickBlockIsGone = ExpectedConditions.not(ExpectedConditions.visibilityOf(clickBlock));
browser.wait(untilClickBlockIsGone, 20000).then(() => {
browser.driver.sleep(1000);
//We've fulfilled the promise, so
deferred.fulfill();
});
}
else {
browser.driver.sleep(1000);
//We've fulfilled the promise, so
deferred.fulfill();
}
//Return the promise (which hasn't been fulfilled yet)
return deferred.promise;
}
Then use it like so:
//Wait for ionic animiations, Click logout
module.exports.waitForIonic().then(() => {
logoutButton.click();
});

IntelXDK Android build issue with "Done" button

Good day! I am developing a simple mobile app using jQuery Mobile with InAppBrowser plugin on IntelXDK. The purpose of the InAppBrowser is to let users view external web pages within the app. On IntelXDK emulator, the browser closes when I click on "Return to App" button and then it returns to the app. However, I encountered a problem on an Android build when I clicked on the "Done" button I received the message:
Webpage not available
The webpage at file:///android_asset/www/[object%20Event] might be temporarily down...
I have used the following so users can click and view external web pages:
Opening links in external device browser with Cordova/jQuery-mobile
I have modified the above to be used on my app:
$(document).on('click', '.link', function (e) {
var elem = $(this);
var url = elem.attr('href');
if (url.indexOf('http://') !== -1) {
e.preventDefault();
document.addEventListener("deviceready", onDeviceReady, false);
onDeviceReady(url);
//return false;
}
});
function onDeviceReady(url) {
var ref = window.open(url, '_blank', 'location=yes');
}
Thank you for your time and help. I really appreciate it.
The reason why it was displaying an error message because the test file was calling another onDeviceReady function. Problem solved!

Phonegap WP7 app not perform any functionality

I am working on Cordova hybrid mobile app currently am doing in android app it runs fine now when i make same app for window phone it is not perform any functionality.
for make WP8 I follow this link after that i copy my all file of www folder to new generated www in Visual Studio project.
But when i ran app it just shows its first page only and not performing any functionality.
So what steps did i miss ?
On the click of button I call following function
$('#contactBackupBtn').on('click',function(){
$('#p2').append("Going to be backup");
sm_sync.backupAllTheContacts(function(){
$('#p4').append("After Contact Backup Function Finished ");
});
});
From above function it calls the following one
backupAllTheContacts:function(callback) {
$('#p3').append("IN backupAllTheContacts");
navigator.contacts.find(["*"], function(contacts) {
$('#p3').append("IN Contact Success");
callback();
}, sm_sync.onError, {"multiple": true});
}
onError:function(error) {
$('#p1').empty();
$('#p1').append(error.code);
$('#p1').append(error.message);
}
When i execute it, it shows this message IN backupAllTheContacts and ths Going to be backup but not showing any success or error messages. what should i do to make it run.
(This is a small part of my app it is runnng perfact in Android Emulator but not n windows
I need help i am stuck here)
use console.log is not support in windows phone so use this and use localStorage like this. try to run on deviceready
document.addEventListener("deviceready", function () {
/* This is for Console.log support in WP */
if (typeof window.console == "undefined") {
window.console = {
log: function (str) {
window.external.Notify(str);
}
};
}
var key0;
/* manage localstorage this way */
if (typeof (window.localStorage) !== "undefined") {
localStorage.setItem('lastname', "Smith");
localStorage.firstname = "One";
if (localStorage.getItem('objectKey1') != null || localStorage.getItem('objectKey1') != undefined) {
key0 = window.localStorage.getItem('objectKey1');
}
}
},false);
When i build my WP8 app i ran into somewhat an issue same as this. it's because of the jQuery i used. Then i updated my jQuery to the latest and its all started working fine.
Please check the jQuery documentation and the version you are using. Or you just put up your code in here so that we can have a closer look.
"But when i ran app it just shows its first page only and not performing any functionality.
So what steps did i miss ?"
Without the code how can we say what steps did you missed ???

cordova facebookConnect - login refresh on samsung g s3

I have recently decided to test Cordava FacebookConnect (https://github.com/mgcrea/cordova-facebook-connect).
I have managed to install on an Android project which works on the Android Virtual Device. But when I plugin my Samsung GS3, The device has a fit and just keeps refreshing the application.
My code is very basic:
var app = {
initialize : function() {
this.bindEvents();
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
var facebookConnect = window.plugins.facebookConnect;
console.log('ready');
facebookConnect.login(
{
permissions : ["email", "user_about_me"],
appId : "3560694656564117"
}, function(result)
{
console.log("FacebookConnect.login:" + JSON.stringify(result));
if( result.cancelled || result.error ) {
console.log("FacebookConnect.login:failedWithError:" );
}
});
}
};
What is weird is that the console logs "ready" every second which is not inside the facebookConnect callback. It as if I have previously logged in, revisited the app, the plugin verifies my credentials, the dialog closes and then it starts again! If I comment out the facebookConnect login method it just loads as normal, the console logs "ready" only the once.
Has anyone come across this before?
Regards
Make sure you setup the native android app section in the facebook app dashboard. Especially the hash key section.
You should indicate whether the facebook callback got called or not.
You can always look in the logcat if there are fb errors that come out.

Categories

Resources