I am working with ios phonegap application. I created a new project with phonegap2.4.0.
It was success.But my issue is childbrowser is not coming and shows following error in console:
OPENING URL:INVALID
I have done all the steps needed to include a childbrowser in the project and it is working fine in an old phonegap project.
How can i fix the problem??
function onBodyLoad() {
document.addEventListener("deviceready", onDeviceReady,false);
}
function onDeviceReady() {
cb = ChildBrowser.install();
}
function helo() {
alert("hiiii");
cordova.exec(null,null,"ChildBrowser","showWebPage",['google.com']);
}
function onDeviceReady() {
if(window.plugins.childBrowser == null)
{
ChildBrowser.install();
}
}
Or You can use InAppBrowser instead of childbrwoser.
For close browser use ref.close();
var ref = window.open("google.com", 'random_string', 'location=no');
ref.addEventListener('loadstart', function(event) {
console.log(event.type + ' - ' + event.url);
} );
ref.addEventListener('loadstop', function(event) {
console.log(event.type + ' - ' + event.url);
} );
ref.addEventListener('exit', function(event) {
//alert(event.type);
} );
function onBodyLoad()
{
document.addEventListener("deviceready", onDeviceReady,false);
}
function onDeviceReady()
{
cb = ChildBrowser.install();
}
function helo()
{
alert("hiiii");
cordova.exec(null,null,"ChildBrowser","showWebPage",['http://google.com']);
}
Related
I am working in an project with both platforms like android and ios, i have to implement banner ads in my project. I have tried various plugin to implement the banner ads.
I have tried the below link for android and ios, it working well with android but after adding this plugin my app shows error,
https://www.codeproject.com/Articles/1005149/Adding-AdMob-to-Ionic-Framework-Application-Step-B
plugin name - cordova-plugin-admob
After adding the plugin, i have use the command 'ionic build ios', which returns - Error code 65 for command: xcodebuild with args: -xcconfig,
Don't know the exact reason of this issue.
Atlast I have findout the solution to load Ads in ionic app,
Please add the plugin
cordova plugin add cordova-plugin-admobpro
Add the below code in your html page,
//Script tag to load jquery1.9.js-
<script type="text/javascript" src="jquery-1.9.js"></script>
<script>
var admobid = {};
if( /(android)/i.test(navigator.userAgent) ) {
admobid = { // for Android
banner: 'ca-app-pub-6869992474017983/9375997553',
interstitial: 'ca-app-pub-6869992474017983/1657046752'
};} else if(/(ipod|iphone|ipad)/i.test(navigator.userAgent)) {
admobid = { // for iOS
banner: 'ca-app-pub-6869992474017983/4806197152',
interstitial: 'ca-app-pub-6869992474017983/7563979554'
};} else {
admobid = { // for Windows Phone
banner: 'ca-app-pub-6869992474017983/8878394753',
interstitial: 'ca-app-pub-6869992474017983/1355127956'
};}function createSelectedBanner(){
//alert("banner");
if(AdMob) AdMob.createBanner({
adId: admobid.banner,
overlap: $('#overlap').is(':checked'),
offsetTopBar: $('#offsetTopBar').is(':checked'),
adSize: 'BANNER',
position: AdMob.AD_POSITION.BOTTOM_CENTER,
});}function showBannerAtPosition(){
if(AdMob) AdMob.showBanner( $('#adPosition').val() );}function onDeviceReady() {
if (! AdMob) {
//alert( 'admob plugin not ready' );
return;
}
initAd();
// display a banner at startup
createSelectedBanner();}function initAd(){//alert("init");
AdMob.getAdSettings(function(info){
console.log('adId: ' + info.adId + '\n' + 'adTrackingEnabled: ' + info.adTrackingEnabled);}, function(){
console.log('failed to get user ad settings');
});
AdMob.setOptions({
adSize: 'BANNER',
position: AdMob.AD_POSITION.BOTTOM_CENTER,
isTesting: true, // set to true, to receiving test ad for testing purpose
bgColor: 'black', // color name, or '#RRGGBB'
// autoShow: true // auto show interstitial ad when loaded, set to false if prepare/show
// offsetTopBar: false, // avoid overlapped by status bar, for iOS7+
});
// new events, with variable to differentiate: adNetwork, adType, adEvent
$(document).on('onAdFailLoad', function(e){
// when jquery used, it will hijack the event, so we have to get data from original event
if(typeof e.originalEvent !== 'undefined') e = e.originalEvent;
var data = e.detail || e.data || e;
//alert('error: ' + data.error +', reason: ' + data.reason +', adNetwork:' + data.adNetwork +', adType:' + data.adType +', adEvent:' + data.adEvent); // adType: 'banner', 'interstitial', etc.
});
$(document).on('onAdLoaded', function(e){
});
$(document).on('onAdPresent', function(e){
});
$(document).on('onAdLeaveApp', function(e){
});
$(document).on('onAdDismiss', function(e){
});
$('#btn_create').click(createSelectedBanner);
$('#btn_remove').click(function(){
AdMob.removeBanner();
});
$('#btn_show').click(showBannerAtPosition);
$('#btn_hide').click(function(){
AdMob.hideBanner();
});
// test interstitial ad
$('#btn_prepare').click(function(){
AdMob.prepareInterstitial({
adId:admobid.interstitial,
autoShow: $('#autoshow').is(':checked'),
});
});
$('#btn_showfull').click(function(){
AdMob.showInterstitial();
});
// test case for #256, https://github.com/floatinghotpot/cordova-admob-pro/issues/256
$(document).on('backbutton', function(){
if(window.confirm('Are you sure to quit?')) navigator.app.exitApp();
});$(document).ready(function()
{
//alert("start");
// on mobile device, we must wait the 'deviceready' event fired by cordova
if(/(ipad|iphone|ipod|android|windows phone)/i.test(navigator.userAgent)) {
document.addEventListener('deviceready', onDeviceReady, false);
} else {
onDeviceReady();
}
});
</script>
I am new to PhoneGap programming.My question is
how to store downloaded PDF file internally with in the application for iOS.
Here is what I have:
function downloadFile() {
alert('start');
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFileSystemSuccess, fail);
window.resolveLocalFileSystemURI("http://www.w3.org/2011/web-apps-ws/papers/Nitobi.pdf", onResolveSuccess, fail);
}
function onFileSystemSuccess(fileSystem) {
alert(fileSystem.name);
console.log(fileSystem.name);
}
function onResolveSuccess(fileEntry) {
alert('success');
console.log(fileEntry.name);
}
function fail(evt) {
console.log(evt.target.error.code);
}
And also I added plugin as
cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-file-transfer.git
But it is not working.Do we need any plugin for this LocalSystem?Please help me.
ok this is the entire code to download a file to documents directory for ios
document.addEventListener('deviceready',onDeviceReady, false);
function onDeviceReady()
{
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0,onFileSystemSuccess, fail);
}
function fail() {
console.log("failed to get filesystem");
}
function onFileSystemSuccess(fileSystem) {
var fileTransfer = new FileTransfer();
var uri = encodeURI("http://www.w3.org/2011/web-apps-ws/papers/Nitobi.pdf");
fileTransfer.download(
uri,
fileSystem.root.fullPath+"/MyPdf.pdf",
function(entry) {
console.log("download complete: " + entry.fullPath);
},
function(error) {
console.log("download error source " + error.source);
console.log("download error target " + error.target);
console.log("upload error code" + error.code);
}
);
}
this will download the Nitobi.pdf file to documents directory as MyPdf.pdf
For reference.
*******EDIT*********
For phonegap version 3.4 the fileSystem.root.fullPath+"/MyPdf.pdf", needs to be replaced with cdvfile://localhost/persistent/MyPdf.pdf
Courtesy of Phonegap 3.4 FileTransfer error (iOS)
Here is my code at the minute:
Using phonegap 2.9
<head>
</head>
<body>
<script charset="utf-8" src="js/cordova.js"></script>
<script>
document.addEventListener("deviceready", onDeviceReady, false);
document.addEventListener("online", onOnline, false);
document.addEventListener("offline", onOffline, false);
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
console.log("Device Ready");
}
// Handle the online event
//
function onOnline() {
document.location = 'http://app.dadad.com';
}
function onOffline() {
console.log("Offline");
}
</script>
</body>
However right now I just get a white screen whether i'm connected or not. Eventually what I would like is to display some html when the user is not connected.
So in conclusion:
Would like to fix the function as it is not working
Would like to show html when not connected.
The Online/Offline events do not fire onload. They are there for when you are in app (complete load) and then lose or gain connection. I have gotten around this by doing an initial connection check on load, like this:
function checkConnetcion() {
var networkState = navigator.connection.type;
var states = {};
states[Connection.UNKNOWN] = false;
states[Connection.ETHERNET] = true;
states[Connection.WIFI] = true;
states[Connection.CELL_2G] = true;
states[Connection.CELL_3G] = true;
states[Connection.CELL_4G] = true;
states[Connection.CELL] = true;
states[Connection.NONE] = false;
var connectionStatus = states[networkState];
if(connectionStatus) {
//Do something if connected
}
else{
//Do something if not connected
}
}
Then add this your onready function:
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
console.log("Device Ready");
checkConnetcion();
}
You can make use of Jquery ajax and send a dummy request before sending actual request. If you get and Error Code as '0' it means there is no internet connectivity.
$.ajax({
url: 'TestUrl',
type: 'GET',
success: function (data) {
// Go ahead with you request
},
error: function (x, y, z) {
if (x.status == 0) {
alert("Please connect to the internet");
}
else{
alert("Other Error Occured")
}
}
});
Secondly you can also make you of HTML 5 navigator
var condition = navigator.onLine ? "ONLINE" : "OFFLINE";
But it will show ONLINE when WIFI doesn't provide Internet connection.
Cordova connection object will also show WIFI if there is no internet connection
i am developing a phonegap project in mac os with xcode. in xcode if i create a cordova based application it automatically creates cordova-1.6.0.js. i am using fileupload plugin for sending svg file to my server. in fileupload.js i have written alert fileuplaoder function as following,
var FileUploader = function() {
alert("gi");
}
this alert is working, but when i give the aler under upload function,
FileUploader.prototype.upload = function(server, file, params, fileKey, fileName, mimeType, success, fail, progress) {
alert("upload");
this._doUpload('upload', server, file, params, fileKey, fileName, mimeType, success, fail, progress);
};
this alert is not working. my call for this plugin in html page is,
window.plugins.fileUploader.upload('http:192.168.1.54:8080/downloadFiles', '/Users/User/Library/Application Support/iPhone Simulator/5.0/Applications/408DBBC7-67F7-4E8B-B41C-663CDC0377B5/Documents/image5_1.jpg.txt.svg', {foo: 'bar'}, 'myPhoto', 'image5_1.jpg.txt.svg', 'image/svg',
function(result) {
console.log('Done: ' + result);
},
function(result) {
console.log("Error: " + result);
},
function(loaded, total) {
var percent = 100 / total * loaded;
console.log('Uploaded ' + percent);
}
);
in fileupload.js there is cordova.addConstructor method. but in my generated cordova.1.6.0.js file there is no such method. i dont know whats happening. pl help me to work this plugin.
i found the solution. there is a upload and download options in the cordova file api itself. its working fine. the code is,
document.addEventListener("deviceready", onDeviceReady, false);
// Cordova is ready
//
function onDeviceReady() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
}
function gotFS(fileSystem) {
fileSystem.root.getFile("image5_2.jpg.svg", {create: true, exclusive: false}, gotFileEntry, fail);
}
function gotFileEntry(fileEntry) {
var localpath=fileEntry.fullPath;
uploadPhoto(localpath);
//fileEntry.createWriter(gotFileWriter, fail);
}
function uploadPhoto(imageURI) {
alert(imageURI);
var options = new FileUploadOptions();
options.fileKey="file";
options.fileName="image5_2.jpg.svg";
options.mimeType="image/svg+xml";
var params = new Object();
params.value1 = "test";
params.value2 = "param";
options.params = params;
var ft = new FileTransfer();
ft.upload(imageURI, "http://192.168.1.54:8080/POC/fileUploader", win, fail, options);
}
function win(r) {
console.log("Code = " + r.responseCode);
console.log("Response = " + r.response);
console.log("Sent = " + r.bytesSent);
}
function fail(error) {
alert("An error has occurred: Code = " + error.code);
console.log("upload error source " + error.source);
console.log("upload error target " + error.target);
}
pl use this.
Basically I am using ChildBrowser on iOS, it works almost perfectly. The problem is the onLocationChange, onClose and onOpenExternal don't work and for the life of me I can't figure out why.
Any help would be much appreciated
<script type="text/javascript" charset="utf-8">
var cb;
function onBodyLoad()
{
document.addEventListener("deviceready",onDeviceReady,false);
}
/* PhoneGap has been initialized and is ready to roll */
function onDeviceReady()
{
console.log("Device Ready");
cb = ChildBrowser.install();
}
function openChildBrowser(url)
{
console.log("New Url"+url);
try {
cb.showWebPage(url);
cb.onLocationChange = function(loc){ root.locChanged(loc); };
cb.onClose = function(){root.onCloseBrowser()};
cb.onOpenExternal = function(){root.onOpenExternal();};
}
catch (err)
{
alert(err);
}
}
function onCloseBrowser()
{
console.log("closed");
alert("In index.html child browser closed");
}
function locChanged(loc)
{
console.log("new loc:"+loc);
childBrowser.close();
alert("In index.html new loc = " + loc);
}
function onOpenExternal()
{
console.log("new loc:");
alert("In index.html onOpenExternal");
}
</script>
I have tried window.plugins.childBrowser.onLocationChange ect.
take out the root.onlocationChange, no need to have that.
Encapsulate the locChanged, onCloseBrowser, onOpenExternal into a main function to make correct calls because childbrowser when it´s opened doesn't have the scope of locChanged
for example:
var facebook = function() {
locChanged = funciton() {
//your code here
}
return {
"init": init,
"locChanged": locChanged,
"onCloseBrowser": onCloseBrowser,
"onOpenExternal": onOpenExternal
}
}();