PhoneGap MediaCapture Plugins not working - ios

I am having issues with my phoneGap build, I am trying to build a recording app, I have all the plugin and codes in place, when I use the phoneGap iOS emulator and load the app, it allows me to record. When I go to build.phonegap and use their tool to build the apk package and then I installed the app on my iPhone and click the button to launch the recorder nothing happens, the recording interface does not launch as it did with the emulator. Any help would be greatl
*****Index.html
<!DOCTYPE html>
<html>
<head>
<title>M title</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="custom.js"></script>
<script type="text/javascript" charset="utf-8">
// Called when capture operation is finished
//
function captureSuccess(mediaFiles) {
var i, len;
for (i = 0, len = mediaFiles.length; i < len; i += 1) {
uploadFile(mediaFiles[i]);
}
}
// Called if something bad happens.
//
function captureError(error) {
var msg = 'An error occurred during capture: ' + error.code;
navigator.notification.alert(msg, null, 'Uh oh!');
}
// A button will call this function
//
function captureAudio() {
// Launch device audio recording application,
// allowing user to capture up to 2 audio clips
navigator.device.capture.captureAudio(captureSuccess, captureError, {limit: 2});
}
// Upload files to server
function uploadFile(mediaFile) {
var ft = new FileTransfer(),
path = mediaFile.fullPath,
name = mediaFile.name;
ft.upload(path,
"http://my.domain.com/upload.php",
function(result) {
console.log('Upload success: ' + result.responseCode);
console.log(result.bytesSent + ' bytes sent');
},
function(error) {
console.log('Error uploading file ' + path + ': ' + error.code);
},
{ fileName: name });
}
</script>
</head>
<body onload="getTitle();">
<ul id="nav">
<li>← Back</li>
<li></li>
</ul>
<button onclick="captureAudio();">Capture Audio</button> <br>
</body>
</html>
*****Config.xml
<widget xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0" id="com.phonegap.iriejam" version="1.0.0">
<name>irieJam</name>
<description>Hello World sample application that responds to the deviceready event.</description>
<author href="http://phonegap.com" email="support#phonegap.com">PhoneGap Team</author>
<content src="index.html"/>
<preference name="permissions" value="none"/>
<preference name="orientation" value="default"/>
<preference name="target-device" value="universal"/>
<preference name="fullscreen" value="true"/>
<preference name="webviewbounce" value="true"/>
<preference name="prerendered-icon" value="true"/>
<preference name="stay-in-webview" value="false"/>
<preference name="ios-statusbarstyle" value="black-opaque"/>
<preference name="detect-data-types" value="true"/>
<preference name="exit-on-suspend" value="false"/>
<preference name="show-splash-screen-spinner" value="true"/>
<preference name="auto-hide-splash-screen" value="true"/>
<preference name="disable-cursor" value="false"/>
<preference name="android-minSdkVersion" value="7"/>
<preference name="android-installLocation" value="auto"/>
<gap:plugin name="org.apache.cordova.battery-status"/>
<gap:plugin name="org.apache.cordova.camera"/>
<gap:plugin name="org.apache.cordova.media-capture"/>
<gap:plugin name="org.apache.cordova.console"/>
<gap:plugin name="org.apache.cordova.contacts"/>
<gap:plugin name="org.apache.cordova.device"/>
<gap:plugin name="org.apache.cordova.device-motion"/>
<gap:plugin name="org.apache.cordova.device-orientation"/>
<gap:plugin name="org.apache.cordova.dialogs"/>
<gap:plugin name="org.apache.cordova.file"/>
<gap:plugin name="org.apache.cordova.file-transfer"/>
<gap:plugin name="org.apache.cordova.geolocation"/>
<gap:plugin name="org.apache.cordova.globalization"/>
<gap:plugin name="org.apache.cordova.inappbrowser"/>
<gap:plugin name="org.apache.cordova.media"/>
<gap:plugin name="org.apache.cordova.network-information"/>
<gap:plugin name="org.apache.cordova.splashscreen"/>
<gap:plugin name="org.apache.cordova.vibration"/>
<gap:plugin name="org.apache.cordova.inappbrowser" />
<icon src="icon.png"/>
<icon src="www/res/icon/android/icon-36-ldpi.png" gap:platform="android" gap:qualifier="ldpi"/>
<icon src="www/res/icon/android/icon-48-mdpi.png" gap:platform="android" gap:qualifier="mdpi"/>
<icon src="www/res/icon/android/icon-72-hdpi.png" gap:platform="android" gap:qualifier="hdpi"/>
<icon src="www/res/icon/android/icon-96-xhdpi.png" gap:platform="android" gap:qualifier="xhdpi"/>
<icon src="www/res/icon/blackberry/icon-80.png" gap:platform="blackberry"/>
<icon src="www/res/icon/blackberry/icon-80.png" gap:platform="blackberry" gap:state="hover"/>
<icon src="www/res/icon/ios/icon-57.png" gap:platform="ios" width="57" height="57"/>
<icon src="www/res/icon/ios/icon-72.png" gap:platform="ios" width="72" height="72"/>
<icon src="www/res/icon/ios/icon-57-2x.png" gap:platform="ios" width="114" height="114"/>
<icon src="www/res/icon/ios/icon-72-2x.png" gap:platform="ios" width="144" height="144"/>
<icon src="www/res/icon/webos/icon-64.png" gap:platform="webos"/>
<icon src="www/res/icon/windows-phone/icon-48.png" gap:platform="winphone"/>
<icon src="www/res/icon/windows-phone/icon-173-tile.png" gap:platform="winphone" gap:role="background"/>
<gap:splash src="www/res/screen/android/screen-ldpi-portrait.png" gap:platform="android" gap:qualifier="port-ldpi"/>
<gap:splash src="www/res/screen/android/screen-mdpi-portrait.png" gap:platform="android" gap:qualifier="port-mdpi"/>
<gap:splash src="www/res/screen/android/screen-hdpi-portrait.png" gap:platform="android" gap:qualifier="port-hdpi"/>
<gap:splash src="www/res/screen/android/screen-xhdpi-portrait.png" gap:platform="android" gap:qualifier="port-xhdpi"/>
<gap:splash src="www/res/screen/blackberry/screen-225.png" gap:platform="blackberry"/>
<gap:splash src="www/res/screen/ios/screen-iphone-portrait.png" gap:platform="ios" width="320" height="480"/>
<gap:splash src="www/res/screen/ios/screen-iphone-portrait-2x.png" gap:platform="ios" width="640" height="960"/>
<gap:splash src="www/res/screen/ios/screen-iphone-portrait-568h-2x.png" gap:platform="ios" width="640" height="1136"/>
<gap:splash src="www/res/screen/ios/screen-ipad-portrait.png" gap:platform="ios" width="768" height="1024"/>
<gap:splash src="www/res/screen/ios/screen-ipad-landscape.png" gap:platform="ios" width="1024" height="768"/>
<gap:splash src="www/res/screen/windows-phone/screen-portrait.jpg" gap:platform="winphone"/>
<access origin="*"/>
<plugin name="cordova-plugin-whitelist" version="1"/>
<allow-intent href="http://*/*"/>
<allow-intent href="https://*/*"/>
<allow-intent href="tel:*"/>
<allow-intent href="sms:*"/>
<allow-intent href="mailto:*"/>
<allow-intent href="geo:*"/>
<platform name="android">
<allow-intent href="market:*"/>
</platform>
<platform name="ios">
<allow-intent href="itms:*"/>
<allow-intent href="itms-apps:*"/>
</platform>
</widget>

I was experiencing that issue because when you upload the www zipped folder to build.phonegap, you must include the config.xml in order for phonegap to generate the apps with the appropriate plugin libraries.

Related

Accessing Cordova plugin from iOS build

I'm adding in-app-purchase functionality for a Framework7/Phonegap app.
Goal: Access the store object referenced in the docs for this plugin:
https://github.com/j3k0/cordova-plugin-purchase/blob/master/doc/api.md
What's currently happening: When I run the xcode build on my local device, I get the following error: Uncaught reference error: store is undefined
What I've tried: I built this test app with success. So, I'm quite sure that my protocol for setting up the store is correct. (It's a great tutorial btw, especially if you're working in swift).
https://www.raywenderlich.com/154737/app-purchases-auto-renewable-subscriptions-tutorial
What I expect to happen: When I build the project from Xcode and deploy on my device for debugging, I would like to open the remote debugging console through safari to isolate the plugin to see that it works.
Here is the relevant code from my project. I believe as soon as I can get access to the store object, I will be fine. I have read several SO questions, and no explanation is presented as to why this configuration doesn't work.
config.xml:
<?xml version='1.0' encoding='utf-8'?>
<widget id="*bundle id*" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0">
<name>*appname*</name>
<description>
Hello World sample application that responds to the deviceready event.
</description>
<author email="support#phonegap.com" href="http://phonegap.com">
PhoneGap Team
</author>
<content src="index.html" />
<preference name="DisallowOverscroll" value="true" />
<preference name="android-minSdkVersion" value="14" />
<platform name="android">
<icon density="ldpi" src="www/res/icon/android/drawable-ldpi-icon.png" />
<icon density="mdpi" src="www/res/icon/android/drawable-mdpi-icon.png" />
<icon density="hdpi" src="www/res/icon/android/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="www/res/icon/android/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="www/res/icon/android/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="www/res/icon/android/drawable-xxxhdpi-icon.png" />
<splash density="land-ldpi" src="www/res/screen/android/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="www/res/screen/android/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="www/res/screen/android/drawable-land-hdpi-screen.png" />
<splash density="land-xhdpi" src="www/res/screen/android/drawable-land-xhdpi-screen.png" />
<splash density="land-xxhdpi" src="www/res/screen/android/drawable-land-xxhdpi-screen.png" />
<splash density="land-xxxhdpi" src="www/res/screen/android/drawable-land-xxxhdpi-screen.png" />
<splash density="port-ldpi" src="www/res/screen/android/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="www/res/screen/android/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="www/res/screen/android/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="www/res/screen/android/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="www/res/screen/android/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="www/res/screen/android/drawable-port-xxxhdpi-screen.png" />
</platform>
<platform name="ios">
<splash height="480" src="www/res/screen/ios/Default~iphone.png" width="320" />
<splash height="960" src="www/res/screen/ios/Default#2x~iphone.png" width="640" />
<splash height="1024" src="www/res/screen/ios/Default-Portrait~ipad.png" width="768" />
<splash height="2048" src="www/res/screen/ios/Default-Portrait#2x~ipad.png" width="1536" />
<splash height="768" src="www/res/screen/ios/Default-Landscape~ipad.png" width="1024" />
<splash height="1536" src="www/res/screen/ios/Default-Landscape#2x~ipad.png" width="2048" />
<splash height="1136" src="www/res/screen/ios/Default-568h#2x~iphone.png" width="640" />
<splash height="1334" src="www/res/screen/ios/Default-667h.png" width="750" />
<splash height="2208" src="www/res/screen/ios/Default-736h.png" width="1242" />
<splash height="1242" src="www/res/screen/ios/Default-Landscape-736h.png" width="2208" />
<icon height="57" platform="ios" src="www/res/icon/ios/icon.png" width="57" />
<icon height="114" platform="ios" src="www/res/icon/ios/icon#2x.png" width="114" />
<icon height="40" platform="ios" src="www/res/icon/ios/icon-40.png" width="40" />
<icon height="80" platform="ios" src="www/res/icon/ios/icon-40#2x.png" width="80" />
<icon height="50" platform="ios" src="www/res/icon/ios/icon-50.png" width="50" />
<icon height="100" platform="ios" src="www/res/icon/ios/icon-50#2x.png" width="100" />
<icon height="60" platform="ios" src="www/res/icon/ios/icon-60.png" width="60" />
<icon height="120" platform="ios" src="www/res/icon/ios/icon-60#2x.png" width="120" />
<icon height="180" platform="ios" src="www/res/icon/ios/icon-60#3x.png" width="180" />
<icon height="72" platform="ios" src="www/res/icon/ios/icon-72.png" width="72" />
<icon height="144" platform="ios" src="www/res/icon/ios/icon-72#2x.png" width="144" />
<icon height="76" platform="ios" src="www/res/icon/ios/icon-76.png" width="76" />
<icon height="152" platform="ios" src="www/res/icon/ios/icon-76#2x.png" width="152" />
<icon height="29" platform="ios" src="www/res/icon/ios/icon-small.png" width="29" />
<icon height="58" platform="ios" src="www/res/icon/ios/icon-small#2x.png" width="58" />
<icon height="87" platform="ios" src="www/res/icon/ios/icon-small#3x.png" width="87" />
<splash height="1136" platform="ios" src="www/res/screen/ios/Default-568h#2x~iphone.png" width="640" />
<splash height="1334" platform="ios" src="www/res/screen/ios/Default-667h.png" width="750" />
<splash height="2208" platform="ios" src="www/res/screen/ios/Default-736h.png" width="1242" />
<splash height="1242" platform="ios" src="www/res/screen/ios/Default-Landscape-736h.png" width="2208" />
<splash height="1536" platform="ios" src="www/res/screen/ios/Default-Landscape#2x~ipad.png" width="2048" />
<splash height="768" platform="ios" src="www/res/screen/ios/Default-Landscape~ipad.png" width="1024" />
<splash height="2048" platform="ios" src="www/res/screen/ios/Default-Portrait#2x~ipad.png" width="1536" />
<splash height="1024" platform="ios" src="www/res/screen/ios/Default-Portrait~ipad.png" width="768" />
<splash height="960" platform="ios" src="www/res/screen/ios/Default#2x~iphone.png" width="640" />
<splash height="480" platform="ios" src="www/res/screen/ios/Default~iphone.png" width="320" />
</platform>
<platform name="wp8">
<icon height="99" platform="wp8" src="www/res/icon/wp8/ApplicationIcon.png" width="99" />
<icon height="159" platform="wp8" src="www/res/icon/wp8/Background.png" width="159" />
<splash height="1280" platform="wp8" src="www/res/screen/wp8/screen-portrait.jpg" width="768" />
</platform>
<platform name="windows">
<splash src="res/screen/windows/splashscreen.png" target="SplashScreen" />
<splash src="res/screen/windows/splashscreenphone.png" target="SplashScreenPhone" />
<icon height="150" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-100.png" width="150" />
<icon height="30" platform="windows" src="www/res/icon/windows/Square30x30Logo.scale-100.png" width="30" />
<icon height="50" platform="windows" src="www/res/icon/windows/StoreLogo.scale-100.png" width="50" />
<splash height="300" platform="windows" src="www/res/screen/windows/SplashScreen.scale-100.png" width="620" />
<icon height="120" platform="windows" src="www/res/icon/windows/StoreLogo.scale-240.png" width="120" />
<icon height="44" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-100.png" width="44" />
<icon height="106" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-240.png" width="106" />
<icon height="70" platform="windows" src="www/res/icon/windows/Square70x70Logo.scale-100.png" width="70" />
<icon height="71" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-100.png" width="71" />
<icon height="170" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-240.png" width="170" />
<icon height="360" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-240.png" width="360" />
<icon height="310" platform="windows" src="www/res/icon/windows/Square310x310Logo.scale-100.png" width="310" />
<icon height="150" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-100.png" width="310" />
<icon height="360" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-240.png" width="744" />
<splash height="1920" platform="windows" src="www/res/screen/windows/SplashScreenPhone.scale-240.png" width="1152" />
</platform>
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<preference name="SplashScreenDelay" value="10000" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<preference name="SplashScreenDelay" value="10000" />
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
<plugin name="cordova-plugin-battery-status" spec="~1.2.4" />
<plugin name="cordova-plugin-camera" spec="~2.4.1" />
<plugin name="cordova-plugin-media-capture" spec="~1.4.3" />
<plugin name="cordova-plugin-device" spec="~1.1.6" />
<plugin name="cordova-plugin-dialogs" spec="~1.3.3" />
<plugin name="cordova-plugin-file" spec="~4.3.3" />
<plugin name="cordova-plugin-geolocation" spec="~2.4.3" />
<plugin name="cordova-plugin-globalization" spec="~1.0.7" />
<plugin name="cordova-plugin-inappbrowser" spec="~1.7.1" />
<plugin name="cordova-plugin-network-information" spec="~1.3.3" />
<plugin name="cordova-plugin-vibration" spec="~2.1.5" />
<plugin name="cordova-plugin-splashscreen" spec="https://github.com/apache/cordova-plugin-splashscreen.git" />
<gap:plugin name="cc.fovea.cordova.purchase" source="npm" />
<engine name="ios" spec="^4.5.4" />
</widget>
app.js:
document.addEventListener('deviceready', initializeStore, false);
function initializeStore() {
// Let's set a pretty high verbosity level, so that we see a lot of stuff
// in the console (reassuring us that something is happening).
store.verbosity = store.INFO;
// We register a dummy product. It's ok, it shouldn't
// prevent the store "ready" event from firing.
store.register({
id: "*myproductid*",
alias: "100 coins",
type: store.CONSUMABLE
});
// When every goes as expected, it's time to celebrate!
// The "ready" event should be welcomed with music and fireworks,
// go ask your boss about it! (just in case)
store.ready(function () {
console.log("\\o/ STORE READY \\o/");
});
// After we've done our setup, we tell the store to do
// it's first refresh. Nothing will happen if we do not call store.refresh()
store.refresh();
}
var $$ = Dom7;
function somethingelse() {
console.log('another test');
}
// Theme
var theme = 'auto';
if (document.location.search.indexOf('theme=') >= 0) {
theme = document.location.search.split('theme=')[1].split('&')[0];
}
var app = new Framework7({
id: '*mybundleid*',
root: '#app',
theme: theme,
photoBrowser: {
type: 'standalone',
theme: 'light',
navbar: true,
swiper: {
initialSlide: 0,
spaceBetween: 20,
speed: 300,
loop: false,
preloadImages: true,
navigation: {
nextEl: '.photo-browser-next',
prevEl: '.photo-browser-prev',
},
zoom: {
enabled: true,
maxRatio: 3,
minRatio: 1,
},
lazy: {
enabled: true,
},
},
},
data: function () {
return {
user: {
firstName: 'John',
lastName: 'Doe',
},
};
},
methods: {
helloWorld: function () {
app.dialog.alert('Hello World!');
}
},
routes: routes,
vi: {
placementId: 'pltd4o7ibb9rc653x14',
},
});
var toastBottomError = app.toast.create({
text: 'There was an error-please check your connection and try again',
closeTimeout: 2000,
cssClass: 'toastError'
});
var toastBottomSuccess = app.toast.create({
text: 'Success!',
closeTimeout: 2000,
cssClass: 'toastSuccess'
});
var items = [];
for (var i = 1; i <= 10000; i++) {
items.push({
title: 'Item ' + i,
subtitle: 'Subtitle ' + i
});
}
var dynamicPopup = app.popup.create({
content: `<div class="popup">
<div class="navbar">
<div class="navbar-inner sliding">
<div class="left">
<a href="#" class="link popup-close">
<i class="icon icon-back"></i>
<span class="ios-only">Back</span>
</a><!--link back-->
</div><!--left-->
<div class="title">Preview</div>
</div><!--navbar-inner sliding-->
</div><!--navbar-->
<div class="block">
<p>Popup created dynamically.</p>
<p>Close me</p>
<img id='preview-image' src=''/>
</div>
</div>`,
on: {
open: function(popup){
console.log('Popup open');
console.log(popup);
},
opened: function(popup) {
console.log('Popup opened');
console.log(popup);
},
}
});
var sheet = app.sheet.create({
content: `
<div id='forced-sign-up-sheet-modal' class="sheet-modal">
<!-- Sheet Modal Toolbar, optional -->
<div class="toolbar">
<div class="toolbar-inner">
<div class="left"></div>
<div class="right">
Done
</div>
</div>
</div>
<!-- Sheet Modal Inner -->
<div class="sheet-modal-inner">
<!-- Sheet Modal content -->
<div class="block">
<p>Integer mollis nulla id nibh elementum finibus...</p>
<button id='clickMe' class='button button-fill color-red'>Click me</button>
</div>
</div>
</div>`,
on: {
open:function(){
console.log('open running...');
},
opened: function(){
console.log(app);
console.log('sup cuh');
app.dialog.confirm('text','title');
}
}
});
Uncaught reference error: store is undefined means one thing only: The plugin is NOT installed properly.
A few things to check here:
Have you installed the plugin using cordova plugin add
cc.fovea.cordova.purchase?
Did the plugin install without warnings or errors?
Have you run cordova build ios after adding the plugin and this worked without errors?
Have you closed Xcode before using the previous cordova commands?
Sadly, the answer was to simply update the plugins that came with the template. There were NO error messages that pointed to this being the cause for the deviceready event not firing. Eventually I safari-ed through enough SO articles to find this answer. For a newbie like me, I would be expecting some sort of flag that the outdated plugins were causing the issue.

phonegap app using handlebars.js (list view) not registering touch on iOS

i am building an app using phonegap, handlebars.js (for templating). I have a js list where i iterate though to show information of each element of the list using handlebars.js templates. there is a click event registered for each element of the list.
######### javascript code #####################
$('body').on('click', 'div.payment_tab', function(event) {
event.preventDefault();
if(self.allowclick==1) {
document.location=$(this).attr("data-target");
return false;
} else {
console.log("else for clicking the payment tab. allowclick is not 1");
return false;
}
});
$('body').on('click' , 'div.payment-checkbox', function(event) {
event.preventDefault();
$(this).toggleClass('checked');
$(this).toggleClass('unchecked');
$(this).parent().find('.invoice_amount').toggleClass('added');
$(this).parent().find('.invoice_amount').toggleClass('notadded');
var amounts = $('div.payment-amount-status .added');
var total = 0.00;
amounts.each(function(key,value) {
if($(value).text() != "") {
total += parseFloat($(value).text());
}
});
$('#amount_to_pay').text(total.toFixed(2));
});
######swipe event javascript######
$("#invoicesView").swipe( {
swipeStatus:function(event, phase, direction, distance, duration, fingers)
{
if (phase=="start")
{
app.allowclick=0;
}
if (phase=="cancel")
{
app.allowclick=1;
}
},
swipeDown:function(event, direction, distance, duration)
{
//Only Let swipe, if the Element is at the very top of the scroll
if($("#invoicesView .contentholder").scrollTop()<=40 && distance>40 )
{
app.allowclick=0;
app.get_payment_details();
}
},
swipeRight:function(event, direction, distance, duration)
{
},
swipeLeft:function(event, direction, distance, duration)
{
},
threshold:50,
cancelThreshold:50,
allowPageScroll:"vertical"
});
###### part of the main.html (handlebars.js template)############################
<script id="invoices-li-tpl" type="text/x-handlebars-template">
{{#.}}
<li>
<div class="payment-checkbox checked"></div>
<div class="payment_tab" data-target="#invoices/{{{this.payment_id}}}">
<div class='payment_info'>
<p>ORDER #:
<span class="invoice-info-order">{{this.order_num}}</span>
</p>
<p>PO:
{{#if this.customer_po}}
<span class="invoice-info-po">{{this.customer_po}}</span></p>
{{else}}
<span class="invoice-info-po">N/A</span>
{{/if}}
<p>DATE:
<span class="invoice-info-date">{{this.createdtime}}</span>
</p>
</div>
<div class='payment-amount-status {{this.paid}}'>
<p><span class ='invoice-amount-label'>TOTAL:</span>$<span class='invoice_amount added'>{{this.amount}}</span></p>
<p><span class ='invoice-status-label'>STATUS:</span><span>{{this.paid}}</span></p>
<p class='payment_id'>{{this.payment_id}}</p>
</div>
<div class='clearfix'></div>
</div>
</li>
{{/.}}
</script>
In the bundled app, the click event works fine on android but does not work on iOS (version 10,tested on iphone 6+). Even the checkbox click(div.payment-checkbox) is not registered on ios. Below is the config.xml i am using for the app. note that we have a similar list view in the app where the click event works on ios.
######## config.xml #########################
<?xml version='1.0' encoding='utf-8'?>
<widget android-versionCode="xxx" id="xxxxxxx" ios-CFBundleVersion="3.0.1" version="3.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0" >
<name>xxxxx</name>
<description>
xxxxxx
</description>
<author email="xxx#xxxxx.com" href="xxxxxx">
xxxxxxxx
</author>
<content src="index.html" />
<preference name="deployment-target" value="7.0" />
<preference name="permissions" value="none" />
<preference name="orientation" value="portrait" />
<preference name="target-device" value="handset" />
<preference name="fullscreen" value="false" />
<preference name="webviewbounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="prerendered-icon" value="true" />
<preference name="stay-in-webview" value="false" />
<preference name="ios-statusbarstyle" value="black-opaque" />
<preference name="detect-data-types" value="true" />
<preference name="exit-on-suspend" value="false" />
<preference name="show-splash-screen-spinner" value="false" />
<preference name="disable-cursor" value="false" />
<preference name="android-minSdkVersion" value="14" />
<preference name="android-installLocation" value="auto" />
<gap:plugin name="cordova-plugin-console" source="npm" />
<gap:plugin name="cordova-plugin-device" source="npm" />
<gap:plugin name="cordova-plugin-dialogs" source="npm" />
<gap:plugin name="cordova-plugin-splashscreen" source="npm" />
<gap:plugin name="cordova-plugin-inappbrowser" source="npm" />
<gap:plugin name="cordova-plugin-customurlscheme" source="npm">
<param name="URL_SCHEME" value="xxxxx" />
</gap:plugin>
<feature name="SplashScreen">
<param name="ios-package" value="CDVSplashScreen"/>
<param name="onload" value="true" />
</feature>
<feature name="SplashScreen">
<param name="android-package" value="org.apache.cordova.splashscreen.SplashScreen" />
</feature>
<feature name="InAppBrowser">
<param name="android-package" value="org.apache.cordova.inappbrowser.InAppBrowser" />
</feature>
<feature name="InAppBrowser">
<param name="ios-package" value="CDVInAppBrowser" />
</feature>
<feature name="Device">
<param name="android-package" value="org.apache.cordova.device.Device" />
</feature>
<icon src="icon.png" />
<icon src="res/icon/android/ldpi.png" gap:platform="android" gap:qualifier="ldpi" />
<icon src="res/icon/android/mdpi.png" gap:platform="android" gap:qualifier="mdpi" />
<icon src="res/icon/android/hdpi.png" gap:platform="android" gap:qualifier="hdpi" />
<icon src="res/icon/android/xhdpi.png" gap:platform="android" gap:qualifier="xhdpi" />
<icon src="res/icon/android/xxhdpi.png" gap:platform="android" gap:qualifier="xxhdpi" />
<!-- iPhone / iPod Touch -->
<icon src="res/icon/ios/icon-60.png" gap:platform="ios" width="60" height="60" />
<icon src="res/icon/ios/icon-60#2x.png" gap:platform="ios" width="120" height="120" />
<icon src="res/icon/ios/icon-60#3x.png" gap:platform="ios" width="180" height="180" />
<!-- iPad -->
<icon src="res/icon/ios/icon-76.png" gap:platform="ios" width="76" height="76" />
<icon src="res/icon/ios/icon-76#2x.png" gap:platform="ios" width="152" height="152" />
<!-- Settings Icon -->
<icon src="res/icon/ios/icon-small.png" gap:platform="ios" width="29" height="29" />
<icon src="res/icon/ios/icon-small#2x.png" gap:platform="ios" width="58" height="58" />
<!-- Spotlight Icon -->
<icon src="res/icon/ios/icon-40.png" gap:platform="ios" width="40" height="40" />
<icon src="res/icon/ios/icon-40#2x.png" gap:platform="ios" width="80" height="80" />
<!-- iPhone / iPod Touch -->
<icon src="res/icon/ios/icon.png" gap:platform="ios" width="57" height="57" />
<icon src="res/icon/ios/icon#2x.png" gap:platform="ios" width="114" height="114" />
<!-- iPad -->
<icon src="res/icon/ios/icon-72.png" gap:platform="ios" width="72" height="72" />
<icon src="res/icon/ios/icon-72#2x.png" gap:platform="ios" width="144" height="144" />
<!-- iPad Spotlight and Settings Icon -->
<icon src="res/icon/ios/icon-50.png" gap:platform="ios" width="50" height="50" />
<icon src="res/icon/ios/icon-50#2x.png" gap:platform="ios" width="100" height="100" />
<gap:splash src="splash.png" />
<gap:splash gap:platform="android" gap:qualifier="port-ldpi" src="www/res/screen/android/android_ldpi_portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-mdpi" src="www/res/screen/android/android_mdpi_portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-hdpi" src="www/res/screen/android/android_hdpi_portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-xhdpi" src="www/res/screen/android/android_xhdpi_portrait.png" />
<gap:splash gap:platform="blackberry" src="www/res/screen/blackberry/screen-225.png" />
<gap:splash src="res/screen/ios/Default.png" gap:platform="ios" width="320" height="480" />
<gap:splash src="res/screen/ios/Default#2x.png" gap:platform="ios" width="640" height="960" />
<gap:splash src="res/screen/ios/screen/ios/Default#3x.png" gap:platform="ios" width="960" height="1440" />
<!-- iPhone 5 / iPod Touch (5th Generation) -->
<gap:splash src="res/screen/ios/Default-568h#2x.png" gap:platform="ios" width="640" height="1136" />
<!-- iPad -->
<gap:splash src="res/screen/ios/Default-portrait-ipad.png" gap:platform="ios" width="768" height="1024" />
<gap:splash src="res/screen/ios/Default-landscape-ipad.png" gap:platform="ios" width="1024" height="768" />
<!-- Retina iPad -->
<gap:splash src="res/screen/ios/Default-Portrait#2x.png" gap:platform="ios" width="1536" height="2048" />
<gap:splash src="res/screen/ios/Default-Landscape#2x.png" gap:platform="ios" width="2048" height="1536" />
<gap:splash gap:platform="winphone" src="www/res/screen/windows-phone/screen-portrait.jpg" />
<platform name="ios">
<gap:plugin name="phonegap-plugin-push" spec="1.5.3" source="npm">
<params>
<param name="SENDER_ID" value="xxxxxxxx" />
</params>
</gap:plugin>
</platform>
<platform name="android">
<gap:plugin name="phonegap-plugin-push" spec="1.7.2" source="npm">
<params>
<param name="SENDER_ID" value="xxxxxxx" />
</params>
</gap:plugin>
</platform>
<gap:plugin name="cordova-plugin-whitelist" source="npm" />
<access origin="*" />
<access origin="http://*" />
<access origin="https://*" />
<plugin name="cordova-plugin-whitelist" version="1" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="5000" />
<preference name="auto-hide-splash-screen" value="true" />
<preference name="AutoHideSplashScreen" value="true" />
<access origin="*"/>
</widget>

PhoneGap Cordova YoutubeVideoPlayer Plugin An error this could be due to network issue of YouTube protocols

I create a "Play Youtube" App with PhoneGap(version 6.3.0) , Cordova (version 6.3.1) , simple load a youtube video by ID.
use Cordova YoutubeVideoPlayer plugin, using build.phonegap.com to build project, but not working with error:
An error occurred during the retrieval of the video. This could be due to network issue of YouTube protocols. Please try again later.
I test on android OS version 6.0.
Thanks in advance.
add to config.xml:
<plugin name="com.bunkerpalace.cordova.youtubevideoplayer" spec="1.0.1" source="pgb" />
Load youtube video when device ready in index.js
YoutubeVideoPlayer.openVideo('1s96mq8kfzY');
index.js
var app = {
initialize: function() {
this.bindEvents();
}, bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
}, onDeviceReady: function() {
app.receivedEvent('deviceready');
},
receivedEvent: function(id) {
var parentElement = document.getElementById(id);
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
console.log('Received Event: ' + id);
YoutubeVideoPlayer.openVideo('1s96mq8kfzY');
}
};
index.html
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<title>Hello World</title>
</head>
<body>
<div class="app">
<h1>PhoneGap</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
</html>
config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.hd.yu" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0">
<name>YTube2</name>
<description>
Hello World sample application that responds to the deviceready event.
</description>
<author email="support#phonegap.com" href="http://phonegap.com">
PhoneGap Team
</author>
<content src="index.html" />
<preference name="DisallowOverscroll" value="true" />
<preference name="android-minSdkVersion" value="14" />
<plugin name="cordova-plugin-battery-status" source="npm" spec="~1.1.1" />
<plugin name="cordova-plugin-camera" source="npm" spec="~2.1.1" />
<plugin name="cordova-plugin-media-capture" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-console" source="npm" spec="~1.0.2" />
<plugin name="cordova-plugin-contacts" source="npm" spec="~2.0.1" />
<plugin name="cordova-plugin-device" source="npm" spec="~1.1.1" />
<plugin name="cordova-plugin-device-motion" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-device-orientation" source="npm" spec="~1.0.2" />
<plugin name="cordova-plugin-dialogs" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-file" source="npm" spec="~4.1.1" />
<plugin name="cordova-plugin-file-transfer" source="npm" spec="~1.5.0" />
<plugin name="cordova-plugin-geolocation" source="npm" spec="~2.1.0" />
<plugin name="cordova-plugin-globalization" source="npm" spec="~1.0.3" />
<plugin name="cordova-plugin-inappbrowser" source="npm" spec="~1.3.0" />
<plugin name="cordova-plugin-media" source="npm" spec="~2.2.0" />
<plugin name="cordova-plugin-network-information" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-splashscreen" source="npm" spec="~3.2.1" />
<plugin name="cordova-plugin-statusbar" source="npm" spec="~2.1.2" />
<plugin name="cordova-plugin-vibration" source="npm" spec="~2.1.0" />
<plugin name="cordova-plugin-whitelist" source="npm" spec="~1.2.1" />
<plugin name="com.bunkerpalace.cordova.youtubevideoplayer" spec="1.0.1" source="pgb" />
<icon src="icon.png" />
<platform name="android">
<icon density="ldpi" src="www/res/icon/android/drawable-ldpi-icon.png" />
<icon density="mdpi" src="www/res/icon/android/drawable-mdpi-icon.png" />
<icon density="hdpi" src="www/res/icon/android/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="www/res/icon/android/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="www/res/icon/android/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="www/res/icon/android/drawable-xxxhdpi-icon.png" />
<splash density="land-ldpi" src="www/res/screen/android/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="www/res/screen/android/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="www/res/screen/android/drawable-land-hdpi-screen.png" />
<splash density="land-xhdpi" src="www/res/screen/android/drawable-land-xhdpi-screen.png" />
<splash density="land-xxhdpi" src="www/res/screen/android/drawable-land-xxhdpi-screen.png" />
<splash density="land-xxxhdpi" src="www/res/screen/android/drawable-land-xxxhdpi-screen.png" />
<splash density="port-ldpi" src="www/res/screen/android/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="www/res/screen/android/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="www/res/screen/android/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="www/res/screen/android/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="www/res/screen/android/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="www/res/screen/android/drawable-port-xxxhdpi-screen.png" />
</platform>
<platform name="ios">
<icon height="57" platform="ios" src="www/res/icon/ios/icon.png" width="57" />
<icon height="114" platform="ios" src="www/res/icon/ios/icon#2x.png" width="114" />
<icon height="40" platform="ios" src="www/res/icon/ios/icon-40.png" width="40" />
<icon height="80" platform="ios" src="www/res/icon/ios/icon-40#2x.png" width="80" />
<icon height="50" platform="ios" src="www/res/icon/ios/icon-50.png" width="50" />
<icon height="100" platform="ios" src="www/res/icon/ios/icon-50#2x.png" width="100" />
<icon height="60" platform="ios" src="www/res/icon/ios/icon-60.png" width="60" />
<icon height="120" platform="ios" src="www/res/icon/ios/icon-60#2x.png" width="120" />
<icon height="180" platform="ios" src="www/res/icon/ios/icon-60#3x.png" width="180" />
<icon height="72" platform="ios" src="www/res/icon/ios/icon-72.png" width="72" />
<icon height="144" platform="ios" src="www/res/icon/ios/icon-72#2x.png" width="144" />
<icon height="76" platform="ios" src="www/res/icon/ios/icon-76.png" width="76" />
<icon height="152" platform="ios" src="www/res/icon/ios/icon-76#2x.png" width="152" />
<icon height="29" platform="ios" src="www/res/icon/ios/icon-small.png" width="29" />
<icon height="58" platform="ios" src="www/res/icon/ios/icon-small#2x.png" width="58" />
<icon height="87" platform="ios" src="www/res/icon/ios/icon-small#3x.png" width="87" />
<splash height="1136" platform="ios" src="www/res/screen/ios/Default-568h#2x~iphone.png" width="640" />
<splash height="1334" platform="ios" src="www/res/screen/ios/Default-667h.png" width="750" />
<splash height="2208" platform="ios" src="www/res/screen/ios/Default-736h.png" width="1242" />
<splash height="1242" platform="ios" src="www/res/screen/ios/Default-Landscape-736h.png" width="2208" />
<splash height="1536" platform="ios" src="www/res/screen/ios/Default-Landscape#2x~ipad.png" width="2048" />
<splash height="768" platform="ios" src="www/res/screen/ios/Default-Landscape~ipad.png" width="1024" />
<splash height="2048" platform="ios" src="www/res/screen/ios/Default-Portrait#2x~ipad.png" width="1536" />
<splash height="1024" platform="ios" src="www/res/screen/ios/Default-Portrait~ipad.png" width="768" />
<splash height="960" platform="ios" src="www/res/screen/ios/Default#2x~iphone.png" width="640" />
<splash height="480" platform="ios" src="www/res/screen/ios/Default~iphone.png" width="320" />
</platform>
<platform name="wp8">
<icon height="99" platform="wp8" src="www/res/icon/wp8/ApplicationIcon.png" width="99" />
<icon height="159" platform="wp8" src="www/res/icon/wp8/Background.png" width="159" />
<splash height="1280" platform="wp8" src="www/res/screen/wp8/screen-portrait.jpg" width="768" />
</platform>
<platform name="windows">
<icon height="150" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-100.png" width="150" />
<icon height="30" platform="windows" src="www/res/icon/windows/Square30x30Logo.scale-100.png" width="30" />
<icon height="50" platform="windows" src="www/res/icon/windows/StoreLogo.scale-100.png" width="50" />
<splash height="300" platform="windows" src="www/res/screen/windows/SplashScreen.scale-100.png" width="620" />
<icon height="120" platform="windows" src="www/res/icon/windows/StoreLogo.scale-240.png" width="120" />
<icon height="44" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-100.png" width="44" />
<icon height="106" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-240.png" width="106" />
<icon height="70" platform="windows" src="www/res/icon/windows/Square70x70Logo.scale-100.png" width="70" />
<icon height="71" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-100.png" width="71" />
<icon height="170" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-240.png" width="170" />
<icon height="360" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-240.png" width="360" />
<icon height="310" platform="windows" src="www/res/icon/windows/Square310x310Logo.scale-100.png" width="310" />
<icon height="150" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-100.png" width="310" />
<icon height="360" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-240.png" width="744" />
<splash height="1920" platform="windows" src="www/res/screen/windows/SplashScreenPhone.scale-240.png" width="1152" />
</platform>
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
<engine name="android" spec="~5.2.2" />
</widget>

each wifi network validation except password cordova wifi

I have developed the wifi application using wifiwizard and cordova for android devices and it works fine. I can choose the network and I can put the password and I can validate it and connect into it. But the problem is my company got some extra validations like identity number, employee type, and some other details. So how am I suppose to do these stuffs or how to add these for particular networks. I have uploaded my entire wifi application which works exactly I expected. Please have a look and help me to do it still better.
index.html
<!DOCTYPE html>
<head>
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Wifi Wizard</title>
</head>
<body>
<div class = "content">
<table id = "displayNetworks" class = "table-responsive">
</table>
</div>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
app.js
var unique_array = [];
$(document).ready(function(){
if(navigator.userAgent.match(/(iPhone|iPad|iPod|Android|BlackBerry)/)){
document.addEventListener("deviceready", onDeviceReady, false);
}else{
onDeviceReady();
}
});
function onDeviceReady(){
alert("I'm into the browser for debug");
window.setTimeout(function(){
WifiWizard.setWifiEnabled(true, win_enable, fail_enable);
}, 200);
}
function win_enable(){
alert("Wifi Enabled successfully");
}
function fail_enable(e){
alert(e.message);
}
window.setTimeout(function(){ alert("I'm in here");
WifiWizard.startScan(success_scan, fail_scan);
}, 1000);
function success_scan(){ alert("Trying to connect scan function");
window.setTimeout(function(){
getScanResult();
}, 2000);
}
function fail_scan(e){
alert(e.message);
}
function getScanResult(){alert("Im here too getting the scan result");
WifiWizard.getScanResults(listHandler, fail_network);
}
function listHandler(a){
alert(JSON.stringify(a));
var network_array = [];
for(var i = 0; i < a.length; i++){
network_array.push(a[i].SSID);
}
unique_array = network_array.filter(function(elem, pos){
return network_array.indexOf(elem) == pos;
});
alert(network_array);
var content = "<table>"
for(var j = 0; j < network_array.length; j++){
content += '<tr class="dynamicTable"><td>' + network_array[j] + '</td></tr>';
}
content += "</table>"
document.getElementById('displayNetworks').innerHTML = content;
}
function fail_network(e){
alert(e.message);
}
function clickWifi(netssid){ alert("Hello Im inside click function");
var id = netssid;
alert(id);
var promptWindow = prompt("Please enter the password for the network: " + id);
alert(promptWindow);
var connectWifi = WifiWizard.formatWPAConfig(id, promptWindow);
WifiWizard.addNetwork(connectWifi, function(){
WifiWizard.connectNetwork(id, connectSuccess, connectFailed);
});
}
function connectSuccess(e){
alert("Connected Successfully");
window.open("http://www.google.com", "_self");
}
function connectFailed(e){
alert(e.message);
}
And too I'm having problem with window.open in the function connectSuccess, the window.open is not working inside my application and if I come out of my application I can reach Google.
config.xml
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.wifiexpandables353717" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>WifiExpandables</name>
<description>
An Ionic Framework and Cordova project.
</description>
<author email="you#example.com" href="http://example.com.com/">
Your Name Here
</author>
<content src="index.html"/>
<access origin="*"/>
<preference name="webviewbounce" value="false"/>
<preference name="UIWebViewBounce" value="false"/>
<preference name="DisallowOverscroll" value="true"/>
<preference name="SplashScreenDelay" value="2000"/>
<preference name="FadeSplashScreenDuration" value="2000"/>
<preference name="android-minSdkVersion" value="16"/>
<preference name="BackupWebStorage" value="none"/>
<preference name="SplashScreen" value="screen"/>
<feature name="StatusBar">
<param name="ios-package" value="CDVStatusBar" onload="true"/>
</feature>
<platform name="android">
<icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
<icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
<icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
<icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
<icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
<icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
<splash src="resources/android/splash/drawable-land-ldpi-screen.png" density="land-ldpi"/>
<splash src="resources/android/splash/drawable-land-mdpi-screen.png" density="land-mdpi"/>
<splash src="resources/android/splash/drawable-land-hdpi-screen.png" density="land-hdpi"/>
<splash src="resources/android/splash/drawable-land-xhdpi-screen.png" density="land-xhdpi"/>
<splash src="resources/android/splash/drawable-land-xxhdpi-screen.png" density="land-xxhdpi"/>
<splash src="resources/android/splash/drawable-land-xxxhdpi-screen.png" density="land-xxxhdpi"/>
<splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>
<splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi"/>
<splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi"/>
<splash src="resources/android/splash/drawable-port-xhdpi-screen.png" density="port-xhdpi"/>
<splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/>
<splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>
</platform>
</widget>
Add the following lines in config.xml. It should work fine.
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>

Execute code after function execution in angularjs

I'm making application for iOS using Phonegap with SQLite.
In deviceready(), I'm loading SQLite table from the JSON file.
CODE:
document.addEventListener("deviceready", onDeviceReady, false);
var db;
function onDeviceReady() {
try
{
window.requestFileSystem(LocalFileSystem.PERSISTENT, 2048*1024, FileIO.gotFS, FileIO.errorHandler);
db = window.sqlitePlugin.openDatabase({ name: "ValeDB", location: 1 });
db.transaction(function(tx) {
tx.executeSql('DROP TABLE IF EXISTS tbl_Location');
tx.executeSql('DROP TABLE IF EXISTS tbl_OrgUnit');
tx.executeSql('CREATE TABLE IF NOT EXISTS tbl_Location (id integer, value text)');
tx.executeSql('CREATE TABLE IF NOT EXISTS tbl_OrgUnit (id integer, value text, type text)');
LocationList.forEach(function(loc){
//console.log(loc.value);
tx.executeSql("INSERT INTO tbl_Location (id, value) VALUES (?, ?)", [loc.id, loc.value],
function(tx, res){
//console.log("Success: " + res.insertId);
},
function(e){
console.log("Error: " + e.message);
});
});
tx.executeSql("SELECT COUNT(*) AS Count FROM tbl_Location", [], function(tx, res){
if(res.rows.length > 0)
console.log("New rows added to tbl_Location:" + res.rows.item(0).Count);
});
EnglishOrgUnit.forEach(function(org){
//console.log(loc.value);
tx.executeSql("INSERT INTO tbl_OrgUnit (id, value, type) VALUES (?, ?, ?)", [org.id, org.value, "en"],
function(tx, res){
//console.log("Success: " + res.insertId);
},
function(e){
console.log("Error: " + e.message);
});
});
tx.executeSql("SELECT COUNT(*) AS Count FROM tbl_OrgUnit WHERE TYPE = 'en'", [], function(tx, res){
if(res.rows.length > 0)
console.log("New Eng. rows added to tbl_OrgUnit:" + res.rows.item(0).Count);
});
PortugueseOrgUnit.forEach(function(org){
//console.log(loc.value);
tx.executeSql("INSERT INTO tbl_OrgUnit (id, value, type) VALUES (?, ?, ?)", [org.id, org.value, "pt"],
function(tx, res){
//console.log("Success: " + res.insertId);
},
function(e){
console.log("Error: " + e.message);
});
});
tx.executeSql("SELECT COUNT(*) AS Count FROM tbl_OrgUnit WHERE TYPE = 'pt'", [], function(tx, res){
if(res.rows.length > 0)
console.log("New Port. rows added to tbl_OrgUnit:" + res.rows.item(0).Count);
});
});
}
catch(e)
{
console.log("Error:" + e.message)
}
}
Config:
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.Vale.Incident" version="1.1.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0">
<preference name="AllowInlineMediaPlayback" value="false" />
<preference name="AutoHideSplashScreen" value="true" />
<preference name="BackupWebStorage" value="cloud" />
<preference name="DisallowOverscroll" value="true" />
<preference name="EnableViewportScale" value="false" />
<preference name="FadeSplashScreen" value="true" />
<preference name="FadeSplashScreenDuration" value=".25" />
<preference name="KeyboardDisplayRequiresUserAction" value="true" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<preference name="ShowSplashScreenSpinner" value="true" />
<preference name="SuppressesIncrementalRendering" value="false" />
<preference name="TopActivityIndicator" value="gray" />
<preference name="GapBetweenPages" value="0" />
<preference name="PageLength" value="0" />
<preference name="PaginationBreakingMode" value="page" />
<preference name="PaginationMode" value="unpaginated" />
<preference name="webviewbounce" value="false" />
<feature name="LocalStorage">
<param name="ios-package" value="CDVLocalStorage" />
</feature>
<name>ReportIncident</name>
<description>
Hello World sample application that responds to the deviceready event.
</description>
<author email="support#phonegap.com" href="http://phonegap.com">
PhoneGap Team
</author>
<preference name="permissions" value="none" />
<preference name="phonegap-version" value="3.5.0" />
<preference name="orientation" value="default" />
<preference name="target-device" value="universal" />
<preference name="fullscreen" value="true" />
<preference name="webviewbounce" value="true" />
<preference name="prerendered-icon" value="true" />
<preference name="stay-in-webview" value="false" />
<preference name="ios-statusbarstyle" value="blue" />
<preference name="detect-data-types" value="true" />
<preference name="exit-on-suspend" value="false" />
<preference name="show-splash-screen-spinner" value="true" />
<preference name="auto-hide-splash-screen" value="true" />
<preference name="disable-cursor" value="false" />
<preference name="android-minSdkVersion" value="7" />
<preference name="android-installLocation" value="auto" />
<preference name="AutoHideSplashScreen" value="false" />
<gap:plugin name="org.apache.cordova.battery-status" />
<gap:plugin name="org.apache.cordova.camera" />
<gap:plugin name="org.apache.cordova.media-capture" />
<gap:plugin name="org.apache.cordova.console" />
<gap:plugin name="org.apache.cordova.contacts" />
<gap:plugin name="org.apache.cordova.device" />
<gap:plugin name="org.apache.cordova.device-motion" />
<gap:plugin name="org.apache.cordova.device-orientation" />
<gap:plugin name="org.apache.cordova.dialogs" />
<gap:plugin name="org.apache.cordova.file" />
<gap:plugin name="org.apache.cordova.file-transfer" />
<gap:plugin name="org.apache.cordova.geolocation" />
<gap:plugin name="org.apache.cordova.globalization" />
<gap:plugin name="org.apache.cordova.inappbrowser" />
<gap:plugin name="org.apache.cordova.media" />
<gap:plugin name="org.apache.cordova.network-information" />
<gap:plugin name="org.apache.cordova.splashscreen" />
<gap:plugin name="org.apache.cordova.vibration" />
<!--gap:plugin name="com.millerjames01.sqlite-plugin"-->
<!--plugin name="SQLitePlugin" value="SQLitePlugin" /-->
<icon src="icon.png" />
<icon gap:platform="android" gap:qualifier="ldpi" src="res/icon/android/icon-36-ldpi.png" />
<icon gap:platform="android" gap:qualifier="mdpi" src="res/icon/android/icon-48-mdpi.png" />
<icon gap:platform="android" gap:qualifier="hdpi" src="res/icon/android/icon-72-hdpi.png" />
<icon gap:platform="android" gap:qualifier="xhdpi" src="res/icon/android/icon-96-xhdpi.png" />
<icon gap:platform="blackberry" src="res/icon/blackberry/icon-80.png" />
<icon gap:platform="blackberry" gap:state="hover" src="res/icon/blackberry/icon-80.png" />
<icon gap:platform="ios" height="57" src="res/icon/ios/vale-57.png" width="57" />
<icon gap:platform="ios" height="72" src="res/icon/ios/vale-72.png" width="72" />
<icon gap:platform="ios" height="114" src="res/icon/ios/vale-114.png" width="114" />
<icon gap:platform="ios" height="144" src="res/icon/ios/vale-144.png" width="144" />
<icon gap:platform="webos" src="res/icon/webos/icon-64.png" />
<icon gap:platform="winphone" src="res/icon/windows-phone/icon-48.png" />
<icon gap:platform="winphone" gap:role="background" src="res/icon/windows-phone/icon-173.png" />
<gap:splash gap:platform="android" gap:qualifier="port-ldpi" src="res/screen/android/screen-ldpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-mdpi" src="res/screen/android/screen-mdpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-hdpi" src="res/screen/android/screen-hdpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-xhdpi" src="res/screen/android/screen-xhdpi-portrait.png" />
<gap:splash gap:platform="blackberry" src="res/screen/blackberry/screen-225.png" />
<gap:splash gap:platform="ios" height="480" src="res/screen/ios/splash5-320-480.png" width="320" />
<gap:splash gap:platform="ios" height="960" src="res/screen/ios/splash5-320-480.png" width="640" />
<gap:splash gap:platform="ios" height="1136" src="res/screen/ios/splash5-320-480.png" width="640" />
<gap:splash gap:platform="ios" height="1024" src="res/screen/ios/splash5-320-480.png" width="768" />
<gap:splash gap:platform="ios" height="768" src="res/screen/ios/splash5-320-480.png" width="1024" />
<gap:splash gap:platform="winphone" src="res/screen/windows-phone/screen-portrait.jpg" />
<gap:plugin name="org.apache.cordova.statusbar" version="0.1.4" />
<gap:plugin name="nl.x-services.plugins.videocaptureplus" />
<access origin="*" />
<feature name="Camera">
<param name="ios-package" value="CDVCamera" />
</feature>
<feature name="Notification">
<param name="ios-package" value="CDVNotification" />
</feature>
<preference name="CameraUsesGeolocation" value="false" />
<feature name="Vibration">
<param name="ios-package" value="CDVVibration" />
</feature>
<feature name="File">
<param name="ios-package" value="CDVFile" />
<param name="onload" value="true" />
</feature>
<feature name="Capture">
<param name="ios-package" value="CDVCapture" />
</feature>
<feature name="NetworkStatus">
<param name="ios-package" value="CDVConnection" />
</feature>
<plugin name="Notification" value="CDVNotification" />
<feature name="FileTransfer">
<param name="ios-package" value="CDVFileTransfer" />
</feature>
<feature name="File">
<param name="ios-package" value="CDVFile" />
</feature>
<feature name="InAppBrowser">
<param name="ios-package" value="CDVInAppBrowser" />
</feature>
<feature name="Globalization">
<param name="ios-package" value="CDVGlobalization" />
</feature>
<feature name="Media">
<param name="ios-package" value="CDVSound" />
</feature>
<feature name="Console">
<param name="ios-package" value="CDVLogger" />
</feature>
<feature name="VideoCapturePlus">
<param name="ios-package" value="VideoCapturePlus" />
</feature>
<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar" />
</feature>
<feature name="Device">
<param name="ios-package" value="CDVDevice" />
</feature>
<feature name="SQLitePlugin">
<param name="ios-package" value="SQLitePlugin" />
</feature>
<plugin name="SQLitePlugin" value="SQLitePlugin" />
</widget>
Problem:
Before the tables are completely loaded, the User is redirected to the Login page
Expected:
User is redirected to the Login page, only once the data is completely loaded. Till that time the Splash screen should be displayed to the user.
Any idea how to go about it
Thanks in advance
In your config.xml add this line
<preference name="AutoHideSplashScreen" value="false" />
And use this function in your js when you want to hide splashscree
navigator.splashscreen.hide();

Resources