Start a new topic

Wikitude plugin with Phonegap Build

Hello,

I'm trying to make simple example working in my app's environment but can't make it work.


I can't find examples of an entire buildable project, that would help a lot.


I'm using Phonegap Build for cloud builds for iOS and Android.


Into my html file I've added :

 <script src="https://www.wikitude.com/libs/architect.js"></script>

 <script type="text/javascript" src="libs/ade.js"></script>


(created libs.ade.js from https://github.com/Wikitude/wikitude-sdk-samples/blob/master/ade.js)


Into config.xml I've added :

    <plugin name="com.wikitude.phonegap.WikitudePlugin" spec="https://github.com/Wikitude/wikitude-cordova-plugin" />

    <platform name="android">

        <preference name="android-minSdkVersion" value="15" />

    </platform>


I've created source based on 

https://github.com/Wikitude/wikitude-sdk-samples/blob/master/01_ImageRecognition_1_ImageOnTarget/js/imageontarget.js


I couldn't find a way to enter trial licence because the plugin being loaded by Phonegap Cloud Build...


I'm getting errors 

AR is not defined...


What am I doing wrong?


Thanks


Hello Tem,

Please refer to the documentation section here.

Thanks
Eva

 

I know this is three years ago, but the documentation section Eva is refering to does not explicitly describe how to use the wikitudePlugin in combination with build.phonegap.com.


I've setup an application that's working fine using the Phonegap App, and it does build in build.phonegap.com, but the plugin is not included. (Error:  file:///android_asset/www/cordova.js: Line 59 : Uncaught module com.wikitude.phonegap.wikitudeplugin.WikitudePlugin not found).


I could definitely use a step-by-step approach on how to succesfully build a Wikitude-app using build.phonegap.com

Well, it took me some sleep and a lot of trial and error, but I've found a way:


Building a Wikitude-app using build.phonegap.com

 

Building this app using build.phonegap.com did work for me, taking the next steps into account: (It took me quite some trial and error, so if someone has found a better solution, let me know!)

  • You need to place your source code in a Github repository. (No need to include the directories node_modules, platforms and plugins in this repository)
  • By default, Phonegap is using npm to add plugins. Since this will result in a plugin without your Wikitude Key, you need to create another (private) repo in Github from the 'com.wikitude.phonegap.wikitudeplugin' folder in the plugin directory.
  • Basically this is the same code as is available on npm, but this one includes your Wikitude Key. (And that's why you need a private repo for this).
  • In build.phonegap.com, add this repository to your private plugins: 'Plugins', 'Submit Private Plugins' and use your repo's url.
  • --- There's a max. size of 50 MB for plugins. I've deleted the folder src/ios to stay under this limit. (Currently I'm only testing Android. I suppose iOS won't work now anymore...)
  • You need to edit config.xml:
  • --- Add a line: <preference name="phonegap-version" value="cli-8.0.0"> because you need the phonegap version 8.0.0 or up 
  • --- Change the line <preference name="android-minSdkVersion" value="14"> to a value of 21 or up, since the Wikitude plugin requires SDK-version 21 or up
  • --- Add a line <plugin name="com.wikitude.phonegap.wikitudeplugin" spec="~8.10.1" source="pgb"> to include your plugin (including your WIkitude Key) from Phonegap Build (your private plugin)
  • Now push your code to your apps repo, use this repo for a new app on Phonegap Build and build the app!

Notes 

  • You need a paid Phonegap-subscription to be able to add a private plugin.
  • Be aware that some versions of the Wikitude API are using com.wikitude.phonegap.WikitudePlugin and that npm is using com.wikitude.phonegap.wikitudeplugin (without uppercase). This may lead to unexpected errors.
  • This worked for me, resulting in a functioning Android app. Because I had to remove the src/ios in the plugin in my private repo, this probably won't work for iOS. 
  • Be aware that some Wikitude examples are using cordova.file.dataDirectory in the loadARchitectWorld function. For Android to find the correct files, you may need to replace this with cordova.file.applicationDirectory

 

Feature request

Hi Jasper,


Thank you for your effort in providing this extensive step-by-step guide for building with build.phonegap.com and helping others, who might need it!

We also have a task internally to investigate open points and the feature request.


Thx again!


Nicola

Login or Signup to post a comment