Start a new topic

Code Problem - total beginner

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: functionvideoPlaying()

                                                     {

                                                     playButton.enabled = false;

                                                     videos.video.enabled = true;

                                                     },

                                                     onFinishedPlaying: functionvideoFinished()

                                                     {

                                                     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: functiononEnterFieldOfVisionFn()

                                                       {

                                                       if (videos.video.playing)

                                                       {

                                                       videos.video.resume();

                                                       }

                                                       },

                                                       onExitFieldOfVision: functiononExitFieldOfVisionFn()

                                                       {

                                                       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 &#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();
Login or Signup to post a comment