Merge pull request #21094 from donmccurdy/deps-update-basis

BasisTextureLoader: Update Basis library.

examples/webgl_loader_texture_basis.html

@@ -18,6 +18,7 @@
 			import * as THREE from '../build/three.module.js';
 
 			import { BasisTextureLoader } from './jsm/loaders/BasisTextureLoader.js';
+			import { OrbitControls } from './jsm/controls/OrbitControls.js';
 
 			let camera, scene, renderer;
 			let mesh;
@@ -25,7 +26,7 @@
 			const clock = new THREE.Clock();
 
 			init();
-			animate();
+			render();
 
 			function init() {
 
@@ -35,13 +36,17 @@
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				document.body.appendChild( renderer.domElement );
 
-				camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 2000 );
-				camera.position.z = 500;
-
 				scene = new THREE.Scene();
 
-				const geometry = new THREE.BoxGeometry( 200, 200, 200 );
-				const material = new THREE.MeshBasicMaterial();
+				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 0.1, 100 );
+				camera.position.set( 0, 0, 1 );
+				camera.lookAt( scene.position );
+
+				const controls = new OrbitControls( camera, renderer.domElement );
+				controls.addEventListener( 'change', render );
+
+				const geometry = flipY( new THREE.PlaneBufferGeometry() );
+				const material = new THREE.MeshBasicMaterial( { side: THREE.DoubleSide } );
 
 				mesh = new THREE.Mesh( geometry, material );
 
@@ -50,12 +55,14 @@
 				const loader = new BasisTextureLoader();
 				loader.setTranscoderPath( 'js/libs/basis/' );
 				loader.detectSupport( renderer );
-				loader.load( 'textures/compressed/PavingStones.basis', function ( texture ) {
+				loader.load( 'textures/compressed/canestra_di_frutta_caravaggio.basis', function ( texture ) {
 
 					texture.encoding = THREE.sRGBEncoding;
 					material.map = texture;
 					material.needsUpdate = true;
 
+					render();
+
 				}, undefined, function ( error ) {
 
 					console.error( error );
@@ -73,18 +80,28 @@
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
+				render();
+
+			}
+
+			function render() {
+
+				renderer.render( scene, camera );
+
 			}
 
-			function animate() {
+			/** Correct UVs to be compatible with `flipY=false` textures. */
+			function flipY( geometry ) {
 
-				requestAnimationFrame( animate );
+				const uv = geometry.attributes.uv;
 
-				const delta = clock.getDelta() * 0.5;
+				for ( let i = 0; i < uv.count; i ++ ) {
 
-				mesh.rotation.x += delta;
-				mesh.rotation.y += delta;
+					uv.setY( i, 1 - uv.getY( i ) );
 
-				renderer.render( scene, camera );
+				}
+
+				return geometry;
 
 			}