Advanced javascript in VRML

Introduction

This tutorial page assumes a good understanding of vrmlscript in particular directOutput and array access methods.

Dynamically adding objects to a world from external files

This example uses a Script node to add an object to the world from external files.

# When the box is clicked on the 'Generate' Script
# adds the content in an external php file to the world

DEF Scene Group {
 children [
  DEF Sensor TouchSensor {}
  Shape {
   appearance Appearance {
    material Material {
     diffuseColor .1 .44 .22
     shininess .1
     specularColor .15 .15 .02
     ambientIntensity 0
     emissiveColor .04 .18 .09
    }
   }
   geometry Box {
    size 1 1 1
   }
  }
 ]
}

# The new Object will be a child of this Group Node
DEF AddedObject Group {
 children [
 ]
}
DEF Generate Script {
 eventIn SFTime touchTime
 field SFNode addedObject USE AddedObject
 field MFString fetchURL "http://www.example.com/index.php?object="
 directOutput TRUE
 url "javascript:
  function touchTime (val,ts) {
   // add the object to the scene
   fetchURL[0]+='sphere';
   Browser.createVrmlFromURL(fetchURL, addedObject, 'addChildren');
  }
 "
}
# ROUTE touchTime to Script
ROUTE Sensor.touchTime TO Generate.touchTime

Using VRML to send data to a database

This example uses a Script node to send information to a server which can then be added to a database.

# When the box is clicked on the 'Generate' Script
# adds the content in an external php file to the world

DEF Scene Group {
 children [
  DEF Sensor TouchSensor {}
  Shape {
   appearance Appearance {
    material Material {
     diffuseColor .1 .44 .22
     shininess .1
     specularColor .15 .15 .02
     ambientIntensity 0
     emissiveColor .04 .18 .09
    }
   }
   geometry Box {
    size 1 1 1
   }
  }
 ]
}

# The new Object will be a child of this Group Node
DEF AddedObject Group {
 children [
 ]
}
DEF Generate Script {
 eventIn SFTime touchTime
 field SFNode addedObject USE AddedObject
 field MFString fetchURL "http://www.example.com/index.php?object="
 directOutput TRUE
 url "javascript:
  function touchTime (val,ts) {
   // add the object to the scene
   fetchURL[0]+='sphere';
   Browser.createVrmlFromURL(fetchURL, addedObject, 'addChildren');
  }
 "
}
# ROUTE touchTime to Script
ROUTE Sensor.touchTime TO Generate.touchTime

Examples

The 2nd example in completed form Using VRML to send data to a database

Notes

The Line : fetchURL[0]+='sphere'; sets the parameter for 'object' to sphere. That is in PHP the $object variable will contain 'sphere'.

You will need to refer to a dedicated website on PHP and databases to create the server side of the system. Discussions on this matter are beyond the coverage of this website.