Start a new topic

Cordova not loading Architect World properly

Cordova not loading Architect World properly


Hello everyone!

I've just started using this SDK with cordova for Android (used as native android before) and i'm finding quite stressfull to get my architect world properly.

My guess is that the tracker is not working properly, but even at that I'm unsure where.

the app variable to push the plugin is identical to the example provided in the Startup guide.

The World variable I'm using is then identical to the "multiple targets" tutorial provided.

Surely the Javascript in some way is wrong, as there must be some difference between linking the two examples together. But where?

Can anyone please help me?

All the code is presented below (Logcat at the Bottom):

index.js (var app):

var app = {

// Url/Path to the augmented reality experience you would like to load
arExperienceUrl: "../index.html",
// The features your augmented reality experience requires, only define the ones you really need
requiredFeatures: ,
// Represents the device capability of launching augmented reality experiences with specific features
isDeviceSupported: false,
// Additional startup settings, for now the only setting available is camera_position (back|front)
startupConfiguration:
{
"camera_position": "back"
},
// Application Constructor
initialize: function() {
this.bindEvents();
},
// Bind Event Listeners
//
// Bind any events that are required on startup. Common events are:
// 'load', 'deviceready', 'offline', and 'online'.
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
onDeviceReady: function() {
app.wikitudePlugin = cordova.require("com.wikitude.phonegap.WikitudePlugin.WikitudePlugin");
app.wikitudePlugin.isDeviceSupported(app.onDeviceSupported, app.onDeviceNotSupported, app.requiredFeatures);
},
// Callback if the device supports all required features
onDeviceSupported: function() {
app.wikitudePlugin.setOnUrlInvokeCallback(app.onURLInvoked);

app.wikitudePlugin.loadARchitectWorld(
app.onARExperienceLoadedSuccessful,
app.onARExperienceLoadError,
app.arExperienceUrl,
app.requiredFeatures,
app.startupConfiguration
);
},
// Callback if the device does not support all required features
onDeviceNotSupported: function(errorMessage) {
alert(errorMessage);
},
// Callback if your AR experience loaded successful
onARExperienceLoadedSuccessful: function(loadedURL) {
/* Respond to successful augmented reality experience loading if you need to */
},
// Callback if your AR experience did not load successful
onARExperienceLoadError: function(errorMessage) {
alert('Loading AR web view failed: ' + errorMessage);
}

};

app.initialize();

 

multipletargets.js (var world):

var World = {
loaded: false,

init: function initFn() {
this.createOverlays();
},

createOverlays: function createOverlaysFn() {
/*
First an AR.ClientTracker needs to be created in order to start the recognition engine. It is initialized with a URL specific to the target collection. Optional parameters are passed as object in the last argument. In this case a callback function for the onLoaded trigger is set. Once the tracker is fully loaded the function worldLoaded() is called.

Important: If you replace the tracker file with your own, make sure to change the target name accordingly.
Use a specific target name to respond only to a certain target or use a wildcard to respond to any or a certain group of targets.

Adding multiple targets to a target collection is straightforward. Simply follow our Target Management Tool documentation. Each target in the target collection is identified by its target name. By using this target name, it is possible to create an AR.Trackable2DObject for every target in the target collection.
*/
this.tracker = new AR.ClientTracker("assets/tracker.wtc", {
onLoaded: this.worldLoaded
});

/*
The next step is to create the augmentation. In this example an image resource is created and passed to the AR.ImageDrawable. A drawable is a visual component that can be connected to an IR target (AR.Trackable2DObject) or a geolocated object (AR.GeoObject). The AR.ImageDrawable is initialized by the image and its size. Optional parameters allow for position it relative to the recognized target.
*/

// Create overlay for page one
var imgOne = new AR.ImageResource("assets/imageOne.png");
var overlayOne = new AR.ImageDrawable(imgOne, 1, {
offsetX: -0.15,
offsetY: 0
});

/*
This combines everything by creating an AR.Trackable2DObject with the previously created tracker, the name of the image target as defined in the target collection and the drawable that should augment the recognized image.
Note that this time a specific target name is used to create a specific augmentation for that exact target.
*/
var pageOne = new AR.Trackable2DObject(this.tracker, "L", {
drawables: {
cam: overlayOne
}
});

/*
Similar to the first part, the image resource and the AR.ImageDrawable for the second overlay are created.
*/
var imgTwo = new AR.ImageResource("assets/imageTwo.png");
var overlayTwo = new AR.ImageDrawable(imgTwo, 0.5, {
offsetX: 0.12,
offsetY: -0.01
});

/*
The AR.Trackable2DObject for the second page uses the same tracker but with a different target name and the second overlay.
*/
var pageTwo = new AR.Trackable2DObject(this.tracker, "V", {
drawables: {
cam: overlayTwo
}
});
},

worldLoaded: function worldLoadedFn() {
var cssDivInstructions = " style='display: table-cell;vertical-align: middle; text-align: right; width: 50%; padding-right: 15px;'";
var cssDivSurfer = " style='display: table-cell;vertical-align: middle; text-align: left; padding-right: 15px; width: 38px'";
var cssDivBiker = " style='display: table-cell;vertical-align: middle; text-align: left; padding-right: 15px;'";
document.getElementById('loadingMessage').innerHTML =
"<div" + cssDivInstructions + ">Scan Target &#35;1 (surfer) or &#35;2 (biker):</div>" +
"<div" + cssDivSurfer + "><img src='assets/surfer.png'></img></div>" +
"<div" + cssDivBiker + "><img src='assets/bike.png'></img></div>";

// Remove Scan target message after 10 sec.
setTimeout(function() {
var e = document.getElementById('loadingMessage');
e.parentElement.removeChild(e);
}, 10000);
}
};

World.init();


 

index.html (identical to the basic cordova standard index.html):

<!DOCTYPE html>

<html>
<head>

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
<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>
<script type="text/javascript" src="cordova.js"></script>
<script src="architect://architect.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script src="js/multipletargets.js"></script>
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
</div>
</body>
</html>


 

Logcat:

07-05 00:20:07.652 579-602/com.joaopratas.archaeologist W/ResourceType: Failure getting entry for 0x010805c8 (t=7 e=1480) (error -75)

07-05 00:20:07.652 579-602/com.joaopratas.archaeologist W/ResourceType: Failure getting entry for 0x01080a64 (t=7 e=2660) (error -75)

07-05 00:20:07.652 579-602/com.joaopratas.archaeologist W/ResourceType: Failure getting entry for 0x010803e0 (t=7 e=992) (error -75)

07-05 00:20:07.652 579-602/com.joaopratas.archaeologist W/ResourceType: Failure getting entry for 0x010803ab (t=7 e=939) (error -75)

07-05 00:20:07.772 579-579/com.joaopratas.archaeologist D/ViewRootImpl: #1 mView = android.widget.LinearLayout{d63cb6a V.E...... ......I. 0,0-0,0 #10203a7 android:id/toast_layout_root}

07-05 00:20:07.802 579-579/com.joaopratas.archaeologist W/cr_AwContents: WebView.destroy() called while WebView is still attached to window.

07-05 00:20:07.842 579-579/com.joaopratas.archaeologist W/ResourcesManager: getTopLevelResources: /data/data/com.joaopratas.archaeologist/files/instant-run/left/resources.ap_ / 1.0 running in com.joaopratas.archaeologist rsrc of package null

07-05 00:20:07.892 579-579/com.joaopratas.archaeologist D/cr_Ime: Constructor

07-05 00:20:07.902 579-579/com.joaopratas.archaeologist W/cr_AwContents: onDetachedFromWindow called when already detached. Ignoring

07-05 00:20:07.902 579-579/com.joaopratas.archaeologist D/cr_Ime: isActive: false

07-05 00:20:07.912 579-579/com.joaopratas.archaeologist D/SystemWebViewEngine: CordovaWebView is running on device made by: samsung

07-05 00:20:07.932 579-579/com.joaopratas.archaeologist I/cr_Ime: ImeThread is not enabled.

07-05 00:20:07.932 579-579/com.joaopratas.archaeologist D/SecWifiDisplayUtil: Metadata value : none

07-05 00:20:07.942 579-579/com.joaopratas.archaeologist D/ViewRootImpl: #1 mView = com.android.internal.policy.PhoneWindow$DecorView{f4716e6 I.E...... R.....ID 0,0-0,0}

07-05 00:20:07.952 579-579/com.joaopratas.archaeologist D/ViewRootImpl: #3 mView = null

07-05 00:20:08.052 579-579/com.joaopratas.archaeologist D/cr_Ime: isActive: false

07-05 00:20:08.052 579-579/com.joaopratas.archaeologist E/ViewRootImpl: sendUserActionEvent() mView == null

07-05 00:20:08.062 579-579/com.joaopratas.archaeologist W/DisplayListCanvas: DisplayListCanvas is started on unbinded RenderNode (without mOwningView)

07-05 00:20:08.092 579-579/com.joaopratas.archaeologist W/DisplayListCanvas: DisplayListCanvas is started on unbinded RenderNode (without mOwningView)

07-05 00:20:08.132 579-579/com.joaopratas.archaeologist D/ViewRootImpl: MSG_RESIZED_REPORT: ci=Rect(0, 0 - 0, 0) vi=Rect(0, 0 - 0, 0) or=1

07-05 00:20:08.132 579-579/com.joaopratas.archaeologist D/ViewRootImpl: MSG_RESIZED_REPORT: ci=Rect(0, 72 - 0, 0) vi=Rect(0, 72 - 0, 0) or=1

07-05 00:20:08.172 579-579/com.joaopratas.archaeologist W/cr_BindingManager: Cannot call determinedVisibility() - never saw a connection for the pid: 579

07-05 00:20:08.172 579-579/com.joaopratas.archaeologist D/cr_Ime: isActive: true

07-05 00:20:08.172 579-579/com.joaopratas.archaeologist D/cr_Ime: hideSoftInputFromWindow

07-05 00:20:08.302 579-579/com.joaopratas.archaeologist D/JsMessageQueue: Set native->JS mode to OnlineEventsBridgeMode

07-05 00:20:08.342 579-579/com.joaopratas.archaeologist I/chromium: "Refused to load the script 'architect://architect.js' because it violates the following Content Security Policy directive: "default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

                                                                    ", source: file:///android_asset/www/index.html (0)

07-05 00:20:08.392 579-579/com.joaopratas.archaeologist I/chromium: "Uncaught ReferenceError: AR is not defined", source: file:///android_asset/www/js/multipletargets.js (17)

07-05 00:20:08.472 579-672/com.joaopratas.archaeologist W/PluginManager: THREAD WARNING: exec() call to WikitudePlugin.isDeviceSupported blocked the main thread for 30ms. Plugin should use CordovaInterface.getThreadPool().

07-05 00:20:08.512 579-579/com.joaopratas.archaeologist D/cr_Ime: Constructor

07-05 00:20:08.512 579-579/com.joaopratas.archaeologist W/cr_AwContents: onDetachedFromWindow called when already detached. Ignoring

07-05 00:20:08.522 579-579/com.joaopratas.archaeologist D/cr_Ime: isActive: false

07-05 00:20:08.532 579-579/com.joaopratas.archaeologist D/cr_Ime: isActive: true

07-05 00:20:08.532 579-579/com.joaopratas.archaeologist D/cr_Ime: hideSoftInputFromWindow

07-05 00:20:09.092 579-579/com.joaopratas.archaeologist W/art: Failed to open zip archive '/system/framework/com.qti.location.sdk.jar': I/O Error

07-05 00:20:09.112 579-579/com.joaopratas.archaeologist W/art: Failed to open zip archive '/system/framework/com.qti.location.sdk.jar': I/O Error

07-05 00:20:09.132 579-579/com.joaopratas.archaeologist W/art: Failed to open zip archive '/system/framework/com.qti.location.sdk.jar': I/O Error

                                                               

                                                               

                                                               Unable to open '/system/framework/com.qti.location.sdk.jar': No such file or directory

07-05 00:20:09.142 579-579/com.joaopratas.archaeologist W/art: Failed to open zip archive '/system/framework/com.qti.location.sdk.jar': I/O Error

07-05 00:20:09.162 579-579/com.joaopratas.archaeologist I/cr_Ime: ImeThread is not enabled.

07-05 00:20:09.182 579-579/com.joaopratas.archaeologist D/SensorManager: registerListener :: 0, MPU6500 Acceleration Sensor, 20000, 0,  

07-05 00:20:09.182 579-579/com.joaopratas.archaeologist I/Choreographer: Skipped 41 frames!  The application may be doing too much work on its main thread.

07-05 00:20:09.212 579-3210/com.joaopratas.archaeologist D/libEGL: eglInitialize EGLDisplay = 0x99dbf4c4

07-05 00:20:09.272 579-3210/com.joaopratas.archaeologist E/libEGL: called unimplemented OpenGL ES API

07-05 00:20:09.272 579-3210/com.joaopratas.archaeologist W/Adreno-ES20: <core_glHint:84>: GL_INVALID_ENUM

07-05 00:20:09.612 579-579/com.joaopratas.archaeologist D/NetworkStateReceiver: Network connectivity change

07-05 00:20:09.612 579-579/com.joaopratas.archaeologist W/cr_BindingManager: Cannot call determinedVisibility() - never saw a connection for the pid: 579

07-05 00:20:09.612 579-579/com.joaopratas.archaeologist D/cr_Ime: isActive: false

07-05 00:20:09.792 579-579/com.joaopratas.archaeologist D/ViewRootImpl: #3 mView = null

07-05 00:20:09.982 579-819/com.joaopratas.archaeologist E/BufferQueueProducer: dequeueBuffer: min undequeued buffer count (2) exceeded (dequeued=5 undequeued=1)

 

Upon first glance the significant part of the output you provided seem to be the following lines:

07-05 00:20:08.342 579-579/com.joaopratas.archaeologist I/chromium: "Refused to load the script 'architect://architect.js' because it violates the following Content Security Policy directive: "default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

                                                                    ", source: file:///android_asset/www/index.html (0)

 

Could you try to add the following entries to your content security policy

 

script-src 'self' 'unsafe-inline' 'unsafe-eval'

 

and try again?

 

For the sake of reference, the content security policy I have for a sample application I can run is

 


<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline';

script-src 'self' 'unsafe-inline' 'unsafe-eval'">

 

Thank you very much for your help!!
I was indeed able to fix this error, and along with some indexing errors that I had for assets resolved, it's working beautifully.

Once again, thank you very much! :)
Login or Signup to post a comment