API: Three (Module) (r1)

API	Uses canvas	Graphics libraries	AB framework	Worlds using this API	Starter Worlds
Three (Module) (r1)	Yes	Three.js	No	132 Worlds	None

This API is for Three.js Worlds. It has no Ancient Brain framework.
Anything written in Three.js using three.module.js should run using this API without change.

This API has the following features:

Includes Three.js release 127.
- See Three.js documentation.
Includes the following libraries for loading 3D models:
It loads your JS using <script type="module">
This means you cannot use document.write
Includes jQuery 3.6.0.
Loads up minimal CSS that should not conflict with user CSS.
No Ancient Brain framework.
World has to do everything. It has to make its own canvas. It has to do its own camera control.
Run header on RHS. Many JS worlds use fixed small dimension canvas, which will go in top LHS. So this API puts run header on RHS.
If World uses Minds, World author must call the Mind themselves:
```
 AB.mind.getAction ( state );  
```

You can load Three.js using something like this:

  
  	import * as THREE from '/api/threemodule/libs/three.module.js';

Templates

ABWorld

This API defines a global variable called "ABWorld" with not much in it:

 

 ABWorld;                 // instance of class ABWorldClass  
 

 ABWorld.canvas;          // a variable to point to the canvas   		
 
 // When making a screenshot, Ancient Brain will search for the canvas.
 // If it cannot find the canvas, set this variable to point to it.
 
 
 ABWorld.fullwidth();     // return full width of window on desktop / screen on mobile 
 ABWorld.fullheight();    // return full height of window on desktop / screen on mobile

Custom renderer: preserveDrawingBuffer

In this API you make your own renderer.
Here is an important note to make sure your World can generate screenshots.

We need to allow runs to generate a World image screenshot from the canvas.
To allow this, the API sets the THREE.WebGLRenderer property "preserveDrawingBuffer" to true by default. The API takes care of this for you.
When you make your own renderer, you need to consider "preserveDrawingBuffer". If you create the renderer like the following, then your World cannot have a screenshot:

 
renderer = new THREE.WebGLRenderer ( { preserveDrawingBuffer: false } );

To solve this, you can make preserveDrawingBuffer always true, or make it true only on screenshot runs:

 

if ( AB.isScreenshotRun() )
	renderer = new THREE.WebGLRenderer ( { preserveDrawingBuffer : true } );
else                       
	renderer = new THREE.WebGLRenderer ( { preserveDrawingBuffer : false } );