How can I accessing a 3rd party plugin (phonegap-facebook-plugin) in Intel XDK? - facebook

I am importing the Wizcorp phonegap-facebook-plugin using the intelxdk.config.additions.xml file with this code:
<intelxdk:plugin intelxdk:name="com.phonegap.plugins.facebookconnect" intelxdk:value="https://github.com/Wizcorp/phonegap-facebook-plugin/">
<intelxdk:param intelxdk:name="APP_ID" intelxdk:value="MyActualAppID" />
<intelxdk:param intelxdk:name="APP_NAME" intelxdk:value="fizz points" />
</intelxdk:plugin>
I've read and understand that I will not be able to test this 3rd party plugin in the emulator, or via the test or debug tabs, so I've created a test build for Android.
Based on the documentation, I believe I am supposed to reference this API via calls to the facebookConnectPlugin, such as:
facebookConnectPlugin.login(["publish_stream", "publish_actions", "offline_access"],
fbLoginSuccess,
function (error) { alert("There was an error: " + error) });
However, I know that in the built app, as in the emulator, the facebookConnectPlugin is not defined, because I get an alert based on the following block:
if (typeof facebookConnectPlugin != 'undefined'){
// do stuff
} else {
alert("FacebookConnectPlugin Not Defined");
}
I assume this is because I need to include the 3rd party library in my code in addition to including it in my project where suggested by the helpful comments, something like:
<!-- Most third-party libraries should go here. References (below) are just examples to give you the general idea... -->
<!-- <script src="lib/mc/hammer.js"></script> -->
Initially, I didn't know the path where the 3rd party library is ultimately located in the package after the build tool retrieves it. But I was told that I could change the .apk extension to .zip extract and explore the contents.
I did this, and found that the library was stored in:
www/plugins/com.phonegap.plugins.facebookconnect/www/phonegap/plugin/facebookConnectPlugin/facebookConnectPlugin.js
So I added the following to my index.html file:
<script src="plugins/com.phonegap.plugins.facebookconnect/www/phonegap/plugin/facebookConnectPlugin/facebookConnectPlugin.js"></script>
However, when built, my test to see if the FacebookConnectPlugin is defined still fails.
Thanks!
Noah
[I've essentially asked the same question on the Intel forums here: https://software.intel.com/en-us/forums/topic/536743 . No solution yet, but if I get one I will post it here.]

You need to build your app and install it on your device to test the WizCorp Facebook plugin. Please make sure you follow the instructions for configuring your app on Facebook.
note the Emulator (simulator) does not support third party plugins as you have noted. Same for using App Preview to test. You must build your app in the cloud.
thanks,
Ian

Are you accessing the facebookConnectPlugin object from inside device ready event?
document.addEventListener("intel.xdk.device.ready",function() {
// try in here
}, false);
It could be undefined if you are accessing it from outside as the plugin is not ready to be used yet.

Related

How to connect Google Analytics in a Flutter Web App?

I'm trying to use the Google API Package (Pub Dev) but with no lucky to undestand how to connect it in my Flutter Project.
Hi 🙂 you need to use this package https://pub.dev/packages/firebase_analytics
you can find a sample App using analytics following this link
Google Analytics works on mobile Apps too and provides all sorts of useful features check this link for more info 😉
You need to add dependency for analytics in android/app/build.gradle, implementation 'com.google.firebase:firebase-analytics'. If you need to log events then you might want to use the package https://pub.dev/packages/firebase_analytics. Otherwise just adding above dependency is sufficient.
If you are looking for a simple approach more than using a package, then you can follow the below solution.
Add the following app.js in web/ directory
// file: /web/app.js
function sendNavigation(location) {
// Replace UA-XXXXXXXXX-X with Google Analytics ID
gtag('config', 'UA-XXXXXXXXX-X', { page_path: location });
}
Add the script into web/index.html by adding
<head>
<!--...-->
<script src="app.js" defer></script>
</head>
Now, you can simply call
js.context.callMethod('sendNavigation', ['routePath']);
when the user navigates to the page in dart file.
You can learn more about this from a blog I wrote - link

How do I actually install and use YouTube Android Player API?

I want to make a Flutter app that can play YouTube playlists using the YouTube Android Player API, found here: https://developers.google.com/youtube/android/player
The "Getting started" instructions say:
The following documents will help you to set up your development environment and use the YouTube Android Player API:
The download page provides a link to download the API client library
and JavaDocs.
The instructions for registering your application explain how to
register your app in the Google API Console and to obtain an Android
API key, which you will need to use the API.
The setup instructions explain how to set up an API project using
either Eclipse or IntelliJ.
The sample applications overview describes the sample applications
included in the API download.
The JavaDoc reference provides detailed definitions of the API's
interfaces, classes, methods, and enums.
I've followed every step in those points and links, but I still don't know how to use the provided package in my code! I now have a sample app running on my phone, and apparently using the package... which is cute... but it is in Java, which I don't speak, so it doesn't help me make my own app! Plain English instructions would have been more helpful...
I have tried:
import 'com.google.android.youtube.player'
and even:
import '<path>/YouTubeAndroidPlayerApi.jar'
but Dart Analysis tells me the URL doesn't exists. And when I try any of the classes that are supposed to be included in the package, I get that it's not defined.
I've tried right-clicking on the YouTubeAndroidPlayerApi.jar file and choosing "Add as library", but same result.
So what I normally do is to write something in my pubspec.yaml file, like:
dependencies:
provider: ^4.3.2+3
Then I would run pub get.
Then I would write import <package name> in my code, and now the classes will be ready to use.
What is the correspondence in this case? What am I supposed to do with this package so that I can use the classes in my code? I'm using Android Studio.
Most grateful for guidance!

How should Cordova plugin for single platform be packaged?

Background
I am developing a Cordova app that must run as a service, i.e. continue in the background and restart when the device does. As far as I can tell, on iOS it is just a case of setting the UIBackgroundModes correctly but on Android requires a little more effort and the service needs to be explicitly started.
I have developed a plugin for Android based on Mark Taylor's example here.
At present I have some JS called on deviceready to start the Android code but don't need to do anything for iOS.
Question
How should I package my plugin so that it will work on all platforms with zero config. It seems clunky to write if (Device.type == 'android') statements in my main JS but I don't really want to write native null implementations.
Is there a suggested approach for this?
Figured it out using the <js-module> tag described here.
Added this to my plugin.xml:
<platform name='android'>
...
<js-module src="androidSpecificStuff.js" name="SomeModule">
<clobbers target="SomeModule" />
</js-module>
...
</platform>
Then in androidSpecificStuff.js had code like:
document.addEventListener('deviceready', function () {
// do android-specific initialisation here
})

Single Sign On not working on TV

I've created a basic application (virtually no content, just a blank page) to test the SSO functionality. It doesn't work, when I test on the TV it gives the error error_cp_001.
The config.xml contains, among other things:
<cpauthjs>Authorization8888.js</cpauthjs>
<login>y</login>
The Authorization8888.js file contains:
var Authorization8888 = {};
Authorization8888.checkAccount = function(id, pw, cb) {
cb("TRUE");
};
I have already tried with <cpauthjs>Authorization8888</cpauthjs>. I have also tried with Authorization without 8888 for the filename and vars. It always shows that error.
I also tried in the SDK simulator, same error as on the real TV. On the simulator I see these extra debug lines:
[JS ALERT]: ####################22222eval(accountCheckFunc) error
[JS ALERT]: Fail to load Account check moudule.
Error : Can't find variable: Authorization8888
I can share the zip file containing the whole application, but it's really simple to reproduce since it has nothing except this basic SSO-related code.
I found the answer, posting it in case someone else hits the same problem.
The problem was deploying via USB. Apparently, an application deployed with the USB stick has limited functionality. Deploying the application via a web server fixed a lot of issues, including this one.

How to find Itune software is installed in a client browser side?

I have a anchor tag with the url "itms://itunes.apple.com/us/app/movietickets-com-showtimes/id402114309?mt=8".If the client system doen't have the Itune software, then the browser is not opening the page.
Is there any way to know the whether the user installed Itune software or not.
Thanks in advance.
Note:
If you go to
https://itunes.apple.com/us/app/movietickets-com-showtimes/id402114309?mt=8
Here you can find or inspect "view in itune" button.There you can see
some javascript to detect that.But i dont know what there are doing!
Apple already has code to detect if iTunes is installed, you can find their code here: http://ax.itunes.apple.com/detection/itmsCheck.js
Finally i got a solution,
From the following site https://itunes.apple.com/us/app/movietickets.com-showtimes/id402114309?mt=8
You need to take two js files. (It contains some extra javascript and jquery - you can remove those if you know that it is no longer needed)
https://itunes.apple.com/htmlResources/99EF/web-storefront-base.js
https://itunes.apple.com/htmlResources/99EF/web-storefront-preview.js
And you need to add the below code to your page html,
""
Finally, Whenever you want to check the plugin, just call
if (its.detect.itunesDetected())
{
//Your code if plugin installed
}
else
{
//Your code if plugin not installed
}