HTML5+CSS on Canvas 3D WebGL (TM) Library
 

onload Library Method

Short Description: Handler called after loading

Signature: x.onload ()
Class: taccglOBJFile Class
 

This is an event handler that is called when the OBJ file and possibly an associated MTL file has been downloaded. When called either this.ready is "ready" or "error" and the 3D Model can be used or taccglOBJFile.error is set.

There is the general problem that OBJ files are downloaded separately from the internet page and so may not yet be available when an animation is started. Also downloading may take a while, especially in case of big 3D models.

The first thing that needs to be decided is when to start downloading the OBJ files. You can do so immediately after the page has been loaded (e.g. in a script at the end of the page or in the pages onload event handler) or you can start the download only after the user clicked on a button (e.g. to start the animation). The first option might download OBJ files that later on are not needed and the second option requires the user to wait longer.

The second problem one needs to deal with occurs when an animation should be played but the required OBJ file is not yet downloaded. The easiest solution is to use async=false) in OBJFile. Second solution is to show an alternative simpler animation as replacement, see taccglOBJFile.ready. Third solution is to wait until the file has been downloaded. This is what the examples below do:

The program code for starting the animation is actually moved into the onload event handler. The first step in starting the animation means actually loading the OBJFile and setting up the onload event handler. When the OBJFile is loaded, the onload handler is started and performs the actual animation. The second example below, is a bit more advanced and checks if the OBJFile had been loaded and ready before and in this case reuses the old 3d model.

Note that you can properly use other methods like taccglOBJFile.scene or taccglOBJFile.objs only if ready returns "ready". Although it is possible that the onload handler is called when loading is finished with an error it is not strictly required to check taccglOBJFile.ready, because taccglOBJFile.objs and taccglOBJFile.scene return empty transitions if ready did not return "ready".

Examples

The second example above uses the third parameter of taccglOBJFile.read to pass the onload handler which is equvalent to setting it directly as in the first example.

             function myAnim () {
                taccgldocfile.mtl.ambientAdjust(0.4);
                var a=taccgl.a("Layout",taccgldocfile.objs("Torus"))
                    .modFit(). rotateMiddle(0.7,0.7,0).dur(3).start();
                taccgl.start();
              }
              taccgldocfile=taccgl.objFile();
              taccgldocfile.onload=myAnim;
              taccgldocfile.read('/objtest/taccgldoc.obj',true);
     
RUN
            function myAnim () {  
                taccgldocfile.mtl.ambientAdjust(0.4);
                var a=taccgl.a("Layout",taccgldocfile.scene())
                    .modFit(). rotateMiddle(0.7,0,0.7).dur(3).start();
                taccgl.start();
            }
            if (!window.taccgldocfile) {
                taccgldocfile=taccgl.objFile();
                taccgldocfile.read('/objtest/taccgldoc.obj',true,myAnim);
            } else 
                if (taccgldocfile.ready()=="ready") myAnim();
      
RUN

WebGL™ is a trademark of the Khronos Group Inc.

Next Page:taccglOBJFile.mtl - Associated MTL File Object
Previous Page: taccglOBJFile.error - Return error message