Develop Reference

Ionic capacitor Motion plugin - listeners not triggering

I have an ionic capacitor android app and I would like to record orientation and acceleration of the device, but after adding event listeners, they are not triggering.
Code:
import { Motion } from '#capacitor/motion';
export default class MotionService {
async startRecording() {
try {
await DeviceMotionEvent.requestPermission();
} catch (e) {
console.error(e);
}
Motion.addListener('accel', event => {
console.log('Device motion event:', event);
});
}}
package.json:
"dependencies": {
"#capacitor/android": "^3.1.1",
"#capacitor/app": "^1.0.2",
"#capacitor/core": "3.1.1",
"#capacitor/filesystem": "^1.0.2",
"#capacitor/haptics": "^1.0.2",
"#capacitor/keyboard": "^1.0.2",
"#capacitor/motion": "^1.0.2",
"#capacitor/status-bar": "^1.0.2",
"#ionic/vue": "^5.4.0",
"#ionic/vue-router": "^5.4.0",
"chart.js": "^3.4.1",
"core-js": "^3.6.5",
"vue": "^3.0.0-0",
"vue-router": "^4.0.0-0"
},
I am trying to test it by running: "ionic capacitor run android -l --host=MY_IP", emulator device is Pixel 3 API 30, then open chrome://inspect/#devices -> inspect to see console.logs and trying to change values in the option window of emulator:
But I don't see any logs.
I would appreciate some help :)

Silly question but ... Do you call startRecording function?
I checked this feature and It works fine on the #ionic/angular project. I don't think that there is some difference for #ionic/vue.
Moreover, I checked the documentation for #capacitor/motion. There are some points which need to keep in mind:
This plugin is currently implemented using Web APIs. Most browsers
require permission before using this API. To request permission,
prompt the user for permission on any user-initiated action (such as a
button click):
As I understand this plugin not using the native part. And seems requestPermission call is not needed (at least for Android).
Next point. DeviceMotionEvent is an experimental feature in the browser. So, It can be changing in some way in the future.
Anyway, you can also try cordova plugins if problems continue: Device Motion and Device Orientation

Actually on Android you don't need to request permissions, just add listeners works
import { Motion } from '#capacitor/motion';
export default class MotionService {
async startRecording() {
Motion.addListener('accel', event => {
console.log('Device motion event:', event);
});
}}

Open YouTube application from capacitor's app

I'm making application using ionic with capacitor.
I want to open YouTube app from my app.
If I get it right I should be able to do it using App Plugin that comes with capacitor: https://capacitorjs.com/docs/apis/app
Here is my code:
App.canOpenUrl({url: 'http://www.youtube.com/watch?v=' + this.dane.id})
.then(resp => {
console.log('Can open url: ', resp);
App.openUrl({url: 'http://www.youtube.com/watch?v=' + this.dane.id});
})
.catch(err => {
console.log('Err', err);
});
It says that I can open that url but YouTube app is not opening (as well as browser).

In capacitor 3 you can to do this, try this example it's works for me
First install
npm install #capacitor/app-launcher
npx cap sync
Then
import {AppLauncher} from '#capacitor/app-launcher';
const {value} = await AppLauncher.canOpenUrl({url: 'com.google.android.youtube'});
if (value) {
await AppLauncher.openUrl({url: 'https://www.youtube.com/watch?v=videoId'});
}

Ionic 4 Deeplinking - launch website if app is not installed

I am working on Ionic 4 app and I am using deeplink to open app when clicked on a external link.
I am using plugin:
cordova plugin add ionic-plugin-deeplinks --variable URL_SCHEME=deeplinktest --variable DEEPLINK_SCHEME=https --variable DEEPLINK_HOST=example.com --variable ANDROID_PATH_PREFIX=/
npm install #ionic-native/deeplinks
and code for opening app is:
openAppFromLink() {
this.deeplinks.routeWithNavController(this.navCtrl, {
'/pageName/:id': {}
}).subscribe(match => {
if (localStorage.getItem('loggedInUser')) {
let navigationExtras: NavigationExtras = {
state: {
id: match.$args.id,
isDeeplink: true
}
};
console.log('Successfully matched route' + JSON.stringify(match));
this.router.navigateByUrl(this.router.routerState.snapshot.url + '/pageName', navigationExtras);
} else {
console.log('opening in system browser');
window.open('https://example.com', '_system');
}
}, nomatch => {
console.error('Got a deeplink that didn\'t match' + JSON.stringify(nomatch));
});
}
I want to open a website or a playstore if user don't have app install on his device.
<h1><a href='deeplinktest://example.com/page/?id=3491'>Open App <a></h1>
on click of above link I am able to open app but when I don't have app installed nothing happens on android device. Can this managed with the same link I mentioned?

in this block you have to handle the error:
nomatch => {
console.error('Got a deeplink that didn\'t match' + JSON.stringify(nomatch));
});
there is a plugin named In App Browser that opens links in in-app-browser.
install it and put your code in nomatch block:
nomatch => {
// open the link here using In App Browser
});

AdMob is not defined on Meteor app

I have a Meteor(v1.0.3.1) app and installed AdMob Cordova plugin like this:
meteor add cordova:com.google.cordova.admob#https://github.com/floatinghotpot/cordova-admob-pro/tarball/94a31660d1bb35337e3430e2608b7710ea4d882a
with the following code as the doc suggests:
if(Meteor.isCordova){
admobid = {
banner: 'ca-app-pub-xxxxxxxxxxxxxxxxxxx'
};
if(AdMob){
AdMob.createBanner( {
adId: admobid.banner,
position: AdMob.AD_POSITION.BOTTOM_CENTER,
autoShow: true
});
}
}
And started the app with meteor run android-device with my Android phone plugged in.
The following error appears in the stack trace:
Uncaught ReferenceError: AdMob is not defined
I looked for AdMob object on window and other places but couldn't find it.

I can confirm that the plugin you are using is working. But you should probably not use the tarball. Use the current version (2.7.4) instead.
Try this. This worked for me using the iOS simulator.
Remove the plugin you installed with meteor remove
Install with version number
meteor add cordova:com.google.cordova.admob#2.7.4
Run the simluator (use the Android one, if you do not have Xcode )
meteor run ios
Then the AdMob variable should be available. At least it was when I tried it.
Update
The plugin also works with Android.
`meteor run android`
Also, make sure that your code is in Meteor.startup(), to ensure that the Cordova plugin is available.
Meteor.startup(function () {
if (Meteor.isCordova) {
if (AdMob) {
AdMob.createBanner( {
adId: 'ca-app-pub-3080070244198226/2109901818',
position: AdMob.AD_POSITION.BOTTOM_CENTER,
isTesting: true,
autoShow: true,
success: function() {
console.log("Received ad");
},
error: function() {
console.log("No ad received");
}
});
} else {
console.log("No Admob");
}
} else {
console.log("No Cordova ");
}
}

I would suggest you to try with this other plugin:
meteor add cordova:com.admob.google#https://github.com/appfeel/admob-google-cordova/tarball/f3851132148aae4c600563d4124cc875c8c5f73e
Then in your code:
if(Meteor.isCordova){
if(admob){
admob.createBannerView({publisherId: "ca-app-pub-xxxxxxxxxxxxxxxxxxx"});
}
}

Meteor had a security upgrade v1.0.4. You need to add the regex for the website to your mobile config file to get the google sdk. Otherwise if you dont you will see the whitelist error in x-code's logs.
I used this to get the sdk.
App.accessRule('*://googleads.g.doubleclick.net');
reference from meteor telling you about the upgrade.
https://www.meteor.com/blog/2015/03/17/meteor-104-mongo-cordova-template-subscriptions

Phonegap build - Facebook connect plugin - Invalid android_key parameter error

I'm running example code (found below) through phonegap build to produce an android apk.
https://github.com/phonegap-build/FacebookConnect/blob/master/example/Simple/index.html
When I try to log into facebook through the app on an android device (with the facebook app installed), I get this error:
Invalid android_key parameter J4INwYsuTyQ_LJc1d3WZ2HReg7M does not match any allowed android key. Configure your app key hashes at http://developers.facebook.com/apps/'app id'
I have copy-pasted this key into the key hashes section of my app's android settings but it still throws the same error when I try to log in using the app.
How can I get this app to log into facebook successfully?
OR: What is another way to enable an android app to log into facebook using phonegap?
Here are some things I have done:
In my facebook app's settings:
Set 'Package name' to the 'widget id' found in my phonegap config.xml.
Set 'Class name' to the Package name with '.ProjectActivity' appended to it.
Enabled 'Single Sign on' and disabled 'Deep linking'.
Made the app open to the public (through the 'Status & Review' section.
In my phonegap config.xml (found in the /www directory in phonegap project):
Entered APP_ID as the ID found in my facebook app dashboard
Entered APP_NAME as the 'Namespace' found in my facebook app settings
In my phonegap build app settings:
Made a keystore (using this answer: https://stackoverflow.com/a/19315975/1696114) and used it to generate a release apk.

I think you should use facebook phonegap plugin as your authentication.
Download and install into your cordova project.
https://github.com/phonegap/phonegap-facebook-plugin
Use this command to install it.
cordova plugin add https://github.com/phonegap/phonegap-facebook-plugin.git --variable APP_ID="xxxxxxxxxxxxx" --variable APP_NAME=“xxxxxxxx”
Then setup your facebook app here:
http://developers.facebook.com/apps/
Then make sure you have this script in your project.
cdv-plugin-fb-connect.js
facebook-js-sdk.js
After that, paste this code into your main script
if ((typeof cordova == 'undefined') && (typeof Cordova == 'undefined')) alert('Cordova variable does not exist. Check that you have included cordova.js correctly');
if (typeof CDV == 'undefined') alert('CDV variable does not exist. Check that you have included cdv-plugin-fb-connect.js correctly');
if (typeof FB == 'undefined') alert('FB variable does not exist. Check that you have included the Facebook JS SDK file.');
FB.Event.subscribe('auth.login', function(response) {
//alert('auth.login event');
});
FB.Event.subscribe('auth.logout', function(response) {
//alert('auth.logout event');
});
FB.Event.subscribe('auth.sessionChange', function(response) {
//alert('auth.sessionChange event');
});
FB.Event.subscribe('auth.statusChange', function(response) {
//alert('auth.statusChange event');
});
function getSession() {
alert("session: " + JSON.stringify(FB.getSession()));
}
function getLoginStatus() {
FB.getLoginStatus(function(response) {
if (response.status == 'connected') {
alert('logged in');
} else {
alert('not logged in');
}
});
}
var friendIDs = [];
var fdata;
function logout() {
FB.logout(function(response) {
alert('logged out');
window.location.replace("#login");
});
}
function login() {
FB.login(
function(response) {
if (response.authResponse) {
alert('logged in');
FB.api('/me', function(me) {
if (me.id) {
localStorage.id = me.id;
localStorage.email = me.email;
localStorage.name = me.name;
window.location.replace("#home");
}
else {
alert('No Internet Connection. Click OK to exit app');
navigator.app.exitApp();
}
});
} else {
alert('not logged in');
}
}, {
scope: "email"
});
}
document.addEventListener('deviceready', function() {
try {
//alert('Device is ready! Make sure you set your app_id below this alert.');
FB.init({
appId: "appid",
nativeInterface: CDV.FB,
useCachedDialogs: false
});
document.getElementById('data').innerHTML = "";
} catch (e) {
alert(e);
}
}, false);
use login() to login . Enjoy!!

I successfully made an app which can log into facebook by using the phonegap-facebook-plugin and by building my cordova/phonegap project locally.
I made a new cordova project and added the android platform for this project, following the instructions here: http://docs.phonegap.com/en/3.4.0/guide_overview_index.md.html#Overview
In doing this I discovered I had made my previous project using an older cordova version (3.1) un-intentionally and that I hadn't installed the cordova command line interface. There may have been other issues with the way I made my first project.
I then added the phonegap-facebook-plugin found here: https://github.com/phonegap/phonegap-facebook-plugin using this command (from my project location):
cordova plugin add https://github.com/phonegap/phonegap-facebook-plugin.git --variable APP_ID="xxxxxxxxxxxxx" --variable APP_NAME=“xxxxxxxx”
(replacing APP_ID value with my facebook app id and APP_NAME value with my app's namespace).
I then replaced my index.html with the example index file found at the phonegap-facebook-plugin github page + /blob/master/example/Simple/index.html (replacing the app_id value with my app id).
I then ran the app straight to my android device using:
cordova run android
In this app, I'm able to use the interface provided by the example to login, post to my own or friends' walls etc. Using this new project (with updated cordova version) I may be able to use phonegap build but I haven't tried yet.
Thanks to Dato' Mohammad Nurdin for the suggestion to use this plugin.