Wikitude

 Hi

I have created a collection and a target by New Generation Studio,
I added a Video and a Text on the target.
When I try it with Wikitude app (by my developer account) it detects image and plays Video and shows the text.
But when I use my own app, it detects image (because onRecognition hits, and usage in license page is increased) but it doesn't play video neither shows the text.

Am I missing something?

My code is

var World = {
	tracker: null,

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

	createTracker: function createTrackerFn() {
		World.tracker = new AR.CloudTracker("*****mytrailid****", "58e52e7f06c812bf31eec5aa", {
			onLoaded: this.trackerLoaded,
			onError: this.trackerError
		});
	},

	trackerError: function trackerErrorFn(errorMessage) {
		alert(errorMessage);
	},

	createOverlays: function createOverlaysFn() {
	},
	
	onRecognition: function onRecognitionFn(recognized, response) {
		if (recognized) {
			alert(JSON.stringify(response));
		} else {
			document.getElementById('errorMessage').innerHTML = "<div class='errorMessage'>Recognition failed, please try again!</div>";

			setTimeout(function() {
				var e = document.getElementById('errorMessage');
				e.removeChild(e.firstChild);
			}, 3000);
		}		
	},

	onRecognitionError: function onRecognitionError(errorCode, errorMessage) {
		alert("error code: " + errorCode + " error message: " + JSON.stringify(errorMessage));
	},

	scan: function scanFn() {
		World.tracker.recognize(this.onRecognition, this.onRecognitionError); 
	},

	trackerLoaded: function trackerLoadedFn() {
		World.showUserInstructions();
	},

	showUserInstructions: function showUserInstructionsFn() {
		var cssDivLeft = " style='display: table-cell;vertical-align: middle; text-align: right; width: 20%; padding-right: 15px;'";
		var cssDivRight = " style='display: table-cell;vertical-align: middle; text-align: center;'";
		var img = "style='margin-right:5px'";

		setTimeout(function() {
			var e = document.getElementById('messageBox');
			e.parentElement.removeChild(e);
		}, 10000);			
	}
};

World.init();

Hi Eva

Thanks for clarifying it, 

In conclusion to load AR when using cloud we don't need to create world manually, we just need to export it and load it (if we host it somewhere loading it by url)

And for exporting world we need to do as this instruction https://support.wikitude.com/support/discussions/topics/5000082418

Hey Eva

Sorry confusing you.

"What confuses me in your use case is when you say that you wish to develop a dynamic app and you should not have to add images and text in Javascript."

I am saying it, because I already added my AR on targetmanager web site, so I assume I can change, add , remove ARs on target whenever I want  without changing my app source code, is it correct? (Wikitude app  doesn't know how many AR I added on my target,but it will show them without changing wikitude app source code)

I tried the sample, sample is adding static texts and button on top of every wine bottle, the code I added in my original question is what I have (which is from sample). For sample no AR is added on TargetManager web site, all of them are added in Javascript.

Assume in my collection I have 2 pictures, 

for the first one I add a button on top and add a video on TargetManager website

for the second  one I add a text on top and add a button on left on TargetManager website

Now I detect them in `onRecognition: function onRecognitionFn(recognized, response) {`

How should I dynamically add Button and Text for the first image, and add Text and Button on second image, and how to position them? If I need to do this by if/else statement then what is the reason to having designer on TargetManager and add ARs in there?

Thanks Ema

The document that you referring is for offline (device) recognition , I want to do cloud recognition and AR, As well as link that you have sent me, I have read this too, https://www.wikitude.com/external/doc/documentation/latest/android/gettingstartedcloudrecognition.html#wikitude-cloud-recognition

My aim is to develop a dynamic app (like wikitude app), so logically I shouldn't add Images and Texts and Videos in Javascript, (How the Wikitude app knows where to position labels and videos, and howmany labels or videos it should load, there is no way unless there would be a dynamic way to read each target information and add them dynamically which doesn't exists in documents, or SDK supports loading it dynamically which I couldn't find any documentation for it)

As I mentioned before my app detects the image from cloud and I get name and other metadata related to it, the only problem is it doesn't load/show AR objects on top of image

p.s I am developing for more than 15 years

Hi Eva

Thanks for reply, this is my use case,

I want to create collection and target on TargetManager.wikitude.com, adding ar on targets, then in my own app when it detects that target and shows the ar

What I have done

1. I create my collection and target

2. I added ar to the target

3. I create a new app

4. I added above codes (in my question) to app

5. Running application

Expected Result

- Detecting image and showing ar on it

Actual result

- Only detetcing image

What I have done to investigte more

1. I downloaded wikitude app

2. I entered developer login

3. Testing on same image

Result

It detects image and shows ar on it

So it it means there is no problem in creating targets, and collection and ar, and there should be something in my app

Please let me know if it is still confusing