C2 w/ Facebook Login and Intel XDK

0 favourites
  • 13 posts
From the Asset Store
A cool way for kids to write and practice English Alphabets
  • I am having a really difficult time getting the Facebook login feature to work once I import into Intel XDK.

    I know I have seen others saying they have it working so I must be missing something. Hopefully someone will be kind enough to point out what I need to do differently.

    My goal is ultimately to have the player be able to sign in with their FB account and I will personalize the game with their name, scores, etc.

    I have tested with Cranberry's FB 2.x and PB plugins and ended up running into the same issues.

    Here is what I tested:

    • In C2, build titleLayout w/ titleEvents
    • Add a sprite for the button as btnSprite
    • Add the C2 Facebook Object
    • Enter my Facebook Developer App ID and Secret
    • In the titleEvents add Event for Touch on btnSprite with Facebook Log In action Browser in PC, Android and iOS
    • In C2, Export HTML5
    • In Filezilla, upload exported files to server
    • In browser, test live page
    • Login successful Android App Emulate
    • In C2, export Cordova specific to Android
    • In Intel XDK, import Android files exported in C2 to create a new project as a Hybrid app
    • Check the box for Facebook Connect then enter applicable App ID and App Name
    • I have also tested without checking the Facebook Connect with the same results
    • Go to Emulate
    • Click the btnSprite
    • Nothing happens

    I have essentially done the same thing using Intel XDK Test and Build for Android and iOS, various versions and hardware devices. All have resulted in the btnSprite doing nothing.

    The one thing I have been unsure of is the App Name. I assume this is the "Display Name" in the FB Developer account under Settings. I have the main app and the test app. I expect as long as the "Display Name" and the App Id are from the same app it should be fine.

    I also found that I didn't have the toggle for "Do you want to make this app...general public?" under "Status & Review" set to "Yes" so I fixed that. It appears to apply to the whole app including any test apps within it.

    This has been making me nuts.

    I am considering trying to use the HTML_iFrame plugin to pass the FB information and sign in back and forth but am really hoping to get the proper Log In to work.

    Any help would be greatly appreciated.

  • Adding some detail as I continue to troubleshoot.

    I have created a clean capx just to test the FB stuff and hopefully to figure out what I am doing wrong. There will be one for the default C2 FB plugin and then one each for the cranberry v2 and PB plugin tests.

    Files available:

    C2 FB capx - http://gruvisoft.com/games/fbtest/fbtest_c2.capx

    Index.html - http://gruvisoft.com/games/fbtest/export%20-%20c2/web/index.html

    C2 FB Android apk - http://gruvisoft.com/games/fbtest/export%20-%20c2/cordova%20-%20android/installers/fbTestC2.android.20150331175728.apk

    C2 FB Crosswalk ARM apk - http://gruvisoft.com/games/fbtest/export%20-%20c2/cordova%20-%20android/installers/fbTestC2.crosswalk.arm.20150331175153.apk

    Cranberry v2.x capx - http://gruvisoft.com/games/fbtest/fbtest_cbry_v2.x.capx

    Cranberry v2.x Android apk - http://gruvisoft.com/games/fbtest/export%20-%20cbry%20-%20v2/cordova%20-%20android/installers/fbTestCbryV2.android.20150331230058.apk

    Cranberry v2.x Crosswalk ARM apk - http://gruvisoft.com/games/fbtest/export%20-%20cbry%20-%20v2/cordova%20-%20android/installers/fbTestCbryV2.crosswalk.arm.20150331225844.apk

    I am also writing a comprehensive, step-by-step, process to further determine what I am missing.

    Some assumptions that I am making are:

    App ID = Facebook App ID

    Secret = Facebook App Secret

    Facebook app name (requested in Intel XDK) = Google Play Package Name from Facebook Dev (ie com.gmgllctest.gruvisoft)

    App NAME (requested in Cranberry v2 plugin) = Google Play Package Name from Facebook Dev (ie com.gmgllctest.gruvisoft)

  • Processes that I am using as a guide are:

    Follow FB Dev app creation here: http://shatter-box.com/knowledgebase/facebook-functions-for-cordova-crosswalk-phongegap/

    Intel XDK "Import an existing HTML5 project" section from here: http://shatter-box.com/knowledgebase/how-to-build-with-crosswalk/

    Here is the process that I have been going through:

    1. Follow FB Dev app creation here: http://shatter-box.com/knowledgebase/fa ... phongegap/

    2. Add email into the apps "Settings\Contact Email"

    3. Make app publicly available in "Status & Review" using the toggle button

    4. Add a Platform to add website, required for web testing

    5. Open C2 and create Empty Project

    6. Add "Facebook" object to Layout 1

    7. Add "Button" object to Layout 1

    8. Add "Text" object to Layout 1 as "helloText"

    9. Click the "Facebook" object and update properties with App ID and Secret

    -- a. App ID = Facebook App ID

    -- b. Secret = Facebook App Secret

    10. Update Event sheet 1 as follows

    -- a. Add event - Button - On clicked - Facebook - Log in (request None, None)

    -- b. Add event - Facebook - Is user logged in - helloText - Set text to "hello "&Facebook.FirstName

    11. Web test via Chrome on Windows 8

    -- a. Export project "HTML5 website"

    -- b. Select location, leave defaults and make sure "Minify…" is unchecked, click Next

    -- c. Select "Normal style" and click Export

    -- d. Upload to webserver via Filezilla and test

    12. Web test successful

    13. C2 Android test via installable package from Intel XDK

    -- a. Export project "Cordova"

    -- b. Select location, leave defaults and make sure "Minify…" is unchecked, click Next

    -- c. Supported devices: "Universal"

    -- d. Check "Hide status bar"

    -- e. Export audio files for "Android…", uncheck "iOS…"

    -- f. Leave Minimum defaults and click Export

    -- g. Open Intel XDK and follow the "Import an existing HTML5 project" section from here: http://shatter-box.com/knowledgebase/ho ... crosswalk/

    -- -- i. App ID = Facebook App ID

    -- -- ii. App Name = anything I want

    -- -- iii. Remaining left to defaults

    -- h. In Intel XDK click the Emulate tab

    -- i. Test doesn’t do anything

    -- j. Click the Develop tab and select intel.config.additions.xml

    -- -- i. Instructions here: http://shatter-box.com/knowledgebase/ph ... ion-2-0-x/

    -- k. Test still doesn’t do anything

    -- l. Updating xml file again based on this: http://shatter-box.com/knowledgebase/troubleshooting/

    -- m. Test still doesn’t do anything

    -- n. In Intel XDK click the Test tab

    -- o. Sync, Push, etc file to server

    -- p. On device to into "App Preview" and load build

    -- q. Test button

    -- r. Nothing happens

    -- s. In Intel XDK click the Build tab

    -- t. Create builds for Crosswalk and Android

    -- u. Load builds to device and launch to test

    -- v. Crosswalk ARM test, nothing happens on button click

    -- w. Android test, nothing happens on button click

    14. Cranberry v2.x Android test via installable package from Intel XDK

    -- a. Add the plugin into the C2 folder

    -- b. Add the "Phonegap Facebook" object into Layout 1

    -- c. Click "PhonegapFacebook" object to edit properties

    -- -- i. Facebook App ID = Facebook App ID

    -- -- ii. App NAME = Google Play Package Name from Facebook Dev

    -- d. Update Event sheet 1 as follows

    -- -- i. Add event - Button - On clicked - PhonegapFacebook - Log in (request "email,FirstName")

    -- -- ii. Add event - PhonegapFacebook - Is user logged in - helloText - Set text to "hello "&PhonegapFacebook.FirstName

    -- e. Export project "Cordova"

    -- f. Select location, leave defaults and make sure "Minify…" is unchecked, click Next

    -- g. Supported devices: "Universal"

    -- h. Check "Hide status bar"

    -- i. Export audio files for "Android…", uncheck "iOS…"

    -- j. Leave Minimum defaults and click Export

    -- k. Open Intel XDK and follow the "Import an existing HTML5 project" section from here: http://shatter-box.com/knowledgebase/ho ... crosswalk/

    -- -- i. In the Included Plugins section check the box for "Facebook Connect"

    -- -- -- 1) Facebook App ID = Facebook App ID

    -- -- -- 2) Facebook app name = Google Play Package Name from Facebook Dev

    -- -- ii. App ID = Facebook App ID

    -- -- iii. App Name = anything I want

    -- -- iv. Remaining left to defaults

    -- l. In Intel XDK click the Emulate tab

    -- m. Test seems to work but I get the same result as if I were testing from C2 before uploading to a webserver

    -- n. In Intel XDK click the Test tab

    -- o. Sync, Push, etc file to server

    -- p. On device to into "App Preview" and load build

    -- q. Test button

    -- r. Nothing happens

    -- s. In Intel XDK click the Build tab

    -- t. Create builds for Crosswalk and Android

    -- u. Load builds to device and launch to test

    -- v. Crosswalk ARM test, nothing happens on button click

    -- w. Android test, nothing happens on button click

  • I am now trying out the Pode HTML iFrame plugin. I send the frame to a page that I created with the FB login form and the frame works for signing in.

    Any recommendations on passing the user information, such as FirstName, back to the C2 Layout?

    Below is the latest capx using the pode plugin

    C2 file using frame : http://gruvisoft.com/games/shared/fbtest_frame.capx

    Pode HTML Plugin: https://www.scirra.com/forum/plugins-pode-html-pack_t69356

    I am hoping to be able to keep the Facebook user account connection in the game but might have to abandon the idea for v1 if I cant figure it out.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Ok. I completed another build of the test last night using the tutorial here: https://www.scirra.com/tutorials/1319/how-to-use-phonegap-facebook-plugin-for-android-cranberrys-plugin

    Thought maybe there was a step I was missing. Still nothing happens after I export to android using Cordova then Intel XDK for Crosswalk and Android.

    I keep seeing references to an example capx but I cant find it anywhere. I thought it was supposed to be included in the plugin download.

    Latest test capx is here: http://gruvisoft.com/games/fbtest/fbtest_frame_game.capx

    It is a bit of a mess with all the tests I have done. The latest is on the default loading Layout with the "Log In" and "Log Out" buttons. Those are supposed to use the PhonegapFacebook plugin.

  • Found another test to run through here: https://plus.google.com/102658703990850475314/posts/FHsiUrvZXWT

    Still no dice

  • Hi Gmgllc,

    This is something i asked about before but like you got no reply. Hopefully you can figure it out as i had no luck when i tried it and it is something i would love to have in my game also. Best of luck.

  • Thanks for the confirmation that I am not the only one having this trouble.

    I have given up on the Facebook login for v1 of my game. Hopefully I can get it figured out for v2.

    I hate giving up but I have spent way more time than I should have on trying to get this working.

    Please keep me posted if you get it figured out. I will do the same for you.

  • I'm facing the same problem. If some one can get us on the right direction would be wonderful!!!

  • yep, im waiting for a solution too..

  • gmgllc

    cranberrygame

    I managed to get this working with Cranberrys plugin. I had to actually export the .apk and run it on my phone for it to work. Login works, posting to wall works and friend leader-board works. ( though you can only see friends scores that are "Test users" on your FB dev account until you submit it for review )

    BIG thank you to Cranberry for making this so easy and possible.

  • METR1C

    Can you provide any example capx for this. I am also trying to make it possible for my game . Trying to achieve facebook profile picture and other facebook features like that in Candy crush Saga for android .

    Thank you in advance

  • Having the same problem, tried a lot of things making android build using PhoneGap but still having the same problem.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)