Wikitude
How can we help you today?
Code Problem - total beginner
1 Comment
Hi everybody,
I am a total beginner (wikitude and coder). I am working on my bachelor thesis - support deaf children to learn reading.
I only want a normal image tracking in connection with a video overlay.
So I took the wikitude example and tried to change the code.
e.g. for the adjectives I have 50 different images to track and want to play 50 different videos ( in connection with the correct image).
I need also a button which should repeat the video.
I made the wtc file. - and I tried to code. ( see below)
Is this correct, or how should the code looks like ?
Thank you so much!
Markus
var World = {
loaded: false,
init: function initFn()
{
this.createOverlays();
},
createOverlays: function createOverlaysFn()
{
this.tracker = new AR.ClientTracker("assets/adjektive.wtc", {onLoaded: this.worldLoaded});
var playButtonImg = new AR.ImageResource("assets/playButton.png");
var playButton = new AR.ImageDrawable(playButtonImg, 0.3, {
enabled: false,
clicked: false,
onClick: function playButtonClicked()
{
videos.play(1);
videos.playing = true;
playButton.clicked = true;
},
offsetY: -0.3
});
var videoArray = ;
var videos = ;
for (var x = 0; x < videoArray.length; x++)
{
(function()
{
videos.video = new AR.VideoDrawable(videoArray.vid, 0.40, {
offsetY: playButton.offsetY,
onLoaded: function videoLoaded()
{
playButton.enabled = true;
},
onPlaybackStarted: function videoPlaying()
{
playButton.enabled = false;
videos.video.enabled = true;
},
onFinishedPlaying: function videoFinished()
{
playButton.enabled = true;
videos.video.playing = false;
videos.video.enabled = false;
},
onClick: function videoClicked()
{
if (playButton.clicked)
{
playButton.clicked = false;
} else if (videos.video.playing)
{
videos.video.pause();
videos.video.playing = false;
} else
{
videos.video.resume();
videos.video.playing = true;
}
}
});
videos.adj = new AR.Trackable2DObject(this.tracker, videoArray.adj, {
drawables: {
cam:
},
onEnterFieldOfVision: function onEnterFieldOfVisionFn()
{
if (videos.video.playing)
{
videos.video.resume();
}
},
onExitFieldOfVision: function onExitFieldOfVisionFn()
{
if (videos.video.playing)
{
videos.video.pause();
}
}
});
})();
}
},
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 #1 (surfer) or #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();
© 2023 Wikitude, a Qualcomm company
Markus Streibl