Skip to content

Commit

Permalink
Examples: Convert loaders to ES6 Part I. (#21612)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Mugen87
Mugen87 authored Apr 8, 2021
1 parent 5f84432 commit d1a5133
Show file tree
Hide file tree
Showing 40 changed files with 8,209 additions and 8,221 deletions.
592 changes: 297 additions & 295 deletions examples/js/loaders/3MFLoader.js
View file

Large diffs are not rendered by default.

160 changes: 81 additions & 79 deletions examples/js/loaders/AMFLoader.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* More information about the AMF format: http://amf.wikispaces.com
*
* Usage:
* var loader = new AMFLoader();
* const loader = new AMFLoader();
* loader.load('/path/to/project.amf', function(objecttree) {
* scene.add(objecttree);
* });
Expand All @@ -18,18 +18,18 @@
*
*/

var AMFLoader = function ( manager ) {
class AMFLoader extends THREE.Loader {

THREE.Loader.call( this, manager );
constructor( manager ) {

};
super( manager );

AMFLoader.prototype = Object.assign( Object.create( THREE.Loader.prototype ), {
constructor: AMFLoader,
load: function ( url, onLoad, onProgress, onError ) {
}

load( url, onLoad, onProgress, onError ) {

var scope = this;
var loader = new THREE.FileLoader( scope.manager );
const scope = this;
const loader = new THREE.FileLoader( scope.manager );
loader.setPath( scope.path );
loader.setResponseType( 'arraybuffer' );
loader.setRequestHeader( scope.requestHeader );
Expand Down Expand Up @@ -58,18 +58,19 @@

}, onProgress, onError );

},
parse: function ( data ) {
}

parse( data ) {

function loadDocument( data ) {

var view = new DataView( data );
var magic = String.fromCharCode( view.getUint8( 0 ), view.getUint8( 1 ) );
let view = new DataView( data );
const magic = String.fromCharCode( view.getUint8( 0 ), view.getUint8( 1 ) );

if ( magic === 'PK' ) {

var zip = null;
var file = null;
let zip = null;
let file = null;
console.log( 'THREE.AMFLoader: Loading Zip' );

try {
Expand All @@ -87,7 +88,7 @@

}

for ( var file in zip ) {
for ( file in zip ) {

if ( file.toLowerCase().substr( - 4 ) === '.amf' ) {

Expand All @@ -102,8 +103,8 @@

}

var fileText = THREE.LoaderUtils.decodeText( view );
var xmlData = new DOMParser().parseFromString( fileText, 'application/xml' );
const fileText = THREE.LoaderUtils.decodeText( view );
const xmlData = new DOMParser().parseFromString( fileText, 'application/xml' );

if ( xmlData.documentElement.nodeName.toLowerCase() !== 'amf' ) {

Expand All @@ -118,16 +119,16 @@

function loadDocumentScale( node ) {

var scale = 1.0;
var unit = 'millimeter';
let scale = 1.0;
let unit = 'millimeter';

if ( node.documentElement.attributes.unit !== undefined ) {

unit = node.documentElement.attributes.unit.value.toLowerCase();

}

var scaleUnits = {
const scaleUnits = {
millimeter: 1.0,
inch: 25.4,
feet: 304.8,
Expand All @@ -148,19 +149,19 @@

function loadMaterials( node ) {

var matName = 'AMF Material';
var matId = node.attributes.id.textContent;
var color = {
let matName = 'AMF Material';
const matId = node.attributes.id.textContent;
let color = {
r: 1.0,
g: 1.0,
b: 1.0,
a: 1.0
};
var loadedMaterial = null;
let loadedMaterial = null;

for ( var i = 0; i < node.childNodes.length; i ++ ) {
for ( let i = 0; i < node.childNodes.length; i ++ ) {

var matChildEl = node.childNodes[ i ];
const matChildEl = node.childNodes[ i ];

if ( matChildEl.nodeName === 'metadata' && matChildEl.attributes.type !== undefined ) {

Expand Down Expand Up @@ -200,16 +201,16 @@

function loadColor( node ) {

var color = {
const color = {
r: 1.0,
g: 1.0,
b: 1.0,
a: 1.0
};

for ( var i = 0; i < node.childNodes.length; i ++ ) {
for ( let i = 0; i < node.childNodes.length; i ++ ) {

var matColor = node.childNodes[ i ];
const matColor = node.childNodes[ i ];

if ( matColor.nodeName === 'r' ) {

Expand Down Expand Up @@ -237,12 +238,12 @@

function loadMeshVolume( node ) {

var volume = {
const volume = {
name: '',
triangles: [],
materialid: null
};
var currVolumeNode = node.firstElementChild;
let currVolumeNode = node.firstElementChild;

if ( node.attributes.materialid !== undefined ) {

Expand All @@ -266,9 +267,9 @@

} else if ( currVolumeNode.nodeName === 'triangle' ) {

var v1 = currVolumeNode.getElementsByTagName( 'v1' )[ 0 ].textContent;
var v2 = currVolumeNode.getElementsByTagName( 'v2' )[ 0 ].textContent;
var v3 = currVolumeNode.getElementsByTagName( 'v3' )[ 0 ].textContent;
const v1 = currVolumeNode.getElementsByTagName( 'v1' )[ 0 ].textContent;
const v2 = currVolumeNode.getElementsByTagName( 'v2' )[ 0 ].textContent;
const v3 = currVolumeNode.getElementsByTagName( 'v3' )[ 0 ].textContent;
volume.triangles.push( v1, v2, v3 );

}
Expand All @@ -283,30 +284,30 @@

function loadMeshVertices( node ) {

var vertArray = [];
var normalArray = [];
var currVerticesNode = node.firstElementChild;
const vertArray = [];
const normalArray = [];
let currVerticesNode = node.firstElementChild;

while ( currVerticesNode ) {

if ( currVerticesNode.nodeName === 'vertex' ) {

var vNode = currVerticesNode.firstElementChild;
let vNode = currVerticesNode.firstElementChild;

while ( vNode ) {

if ( vNode.nodeName === 'coordinates' ) {

var x = vNode.getElementsByTagName( 'x' )[ 0 ].textContent;
var y = vNode.getElementsByTagName( 'y' )[ 0 ].textContent;
var z = vNode.getElementsByTagName( 'z' )[ 0 ].textContent;
const x = vNode.getElementsByTagName( 'x' )[ 0 ].textContent;
const y = vNode.getElementsByTagName( 'y' )[ 0 ].textContent;
const z = vNode.getElementsByTagName( 'z' )[ 0 ].textContent;
vertArray.push( x, y, z );

} else if ( vNode.nodeName === 'normal' ) {

var nx = vNode.getElementsByTagName( 'nx' )[ 0 ].textContent;
var ny = vNode.getElementsByTagName( 'ny' )[ 0 ].textContent;
var nz = vNode.getElementsByTagName( 'nz' )[ 0 ].textContent;
const nx = vNode.getElementsByTagName( 'nx' )[ 0 ].textContent;
const ny = vNode.getElementsByTagName( 'ny' )[ 0 ].textContent;
const nz = vNode.getElementsByTagName( 'nz' )[ 0 ].textContent;
normalArray.push( nx, ny, nz );

}
Expand All @@ -330,13 +331,13 @@

function loadObject( node ) {

var objId = node.attributes.id.textContent;
var loadedObject = {
const objId = node.attributes.id.textContent;
const loadedObject = {
name: 'amfobject',
meshes: []
};
var currColor = null;
var currObjNode = node.firstElementChild;
let currColor = null;
let currObjNode = node.firstElementChild;

while ( currObjNode ) {

Expand All @@ -358,8 +359,8 @@

} else if ( currObjNode.nodeName === 'mesh' ) {

var currMeshNode = currObjNode.firstElementChild;
var mesh = {
let currMeshNode = currObjNode.firstElementChild;
const mesh = {
vertices: [],
normals: [],
volumes: [],
Expand All @@ -370,7 +371,7 @@

if ( currMeshNode.nodeName === 'vertices' ) {

var loadedVertices = loadMeshVertices( currMeshNode );
const loadedVertices = loadMeshVertices( currMeshNode );
mesh.normals = mesh.normals.concat( loadedVertices.normals );
mesh.vertices = mesh.vertices.concat( loadedVertices.vertices );

Expand Down Expand Up @@ -399,18 +400,18 @@

}

var xmlData = loadDocument( data );
var amfName = '';
var amfAuthor = '';
var amfScale = loadDocumentScale( xmlData );
var amfMaterials = {};
var amfObjects = {};
var childNodes = xmlData.documentElement.childNodes;
var i, j;
const xmlData = loadDocument( data );
let amfName = '';
let amfAuthor = '';
const amfScale = loadDocumentScale( xmlData );
const amfMaterials = {};
const amfObjects = {};
const childNodes = xmlData.documentElement.childNodes;
let i, j;

for ( i = 0; i < childNodes.length; i ++ ) {

var child = childNodes[ i ];
const child = childNodes[ i ];

if ( child.nodeName === 'metadata' ) {

Expand All @@ -430,40 +431,40 @@

} else if ( child.nodeName === 'material' ) {

var loadedMaterial = loadMaterials( child );
const loadedMaterial = loadMaterials( child );
amfMaterials[ loadedMaterial.id ] = loadedMaterial.material;

} else if ( child.nodeName === 'object' ) {

var loadedObject = loadObject( child );
const loadedObject = loadObject( child );
amfObjects[ loadedObject.id ] = loadedObject.obj;

}

}

var sceneObject = new THREE.Group();
var defaultMaterial = new THREE.MeshPhongMaterial( {
const sceneObject = new THREE.Group();
const defaultMaterial = new THREE.MeshPhongMaterial( {
color: 0xaaaaff,
flatShading: true
} );
sceneObject.name = amfName;
sceneObject.userData.author = amfAuthor;
sceneObject.userData.loader = 'AMF';

for ( var id in amfObjects ) {
for ( const id in amfObjects ) {

var part = amfObjects[ id ];
var meshes = part.meshes;
var newObject = new THREE.Group();
const part = amfObjects[ id ];
const meshes = part.meshes;
const newObject = new THREE.Group();
newObject.name = part.name || '';

for ( i = 0; i < meshes.length; i ++ ) {

var objDefaultMaterial = defaultMaterial;
var mesh = meshes[ i ];
var vertices = new THREE.Float32BufferAttribute( mesh.vertices, 3 );
var normals = null;
let objDefaultMaterial = defaultMaterial;
const mesh = meshes[ i ];
const vertices = new THREE.Float32BufferAttribute( mesh.vertices, 3 );
let normals = null;

if ( mesh.normals.length ) {

Expand All @@ -473,7 +474,7 @@

if ( mesh.color ) {

var color = mesh.color;
const color = mesh.color;
objDefaultMaterial = defaultMaterial.clone();
objDefaultMaterial.color = new THREE.Color( color.r, color.g, color.b );

Expand All @@ -486,13 +487,13 @@

}

var volumes = mesh.volumes;
const volumes = mesh.volumes;

for ( j = 0; j < volumes.length; j ++ ) {

var volume = volumes[ j ];
var newGeometry = new THREE.BufferGeometry();
var material = objDefaultMaterial;
const volume = volumes[ j ];
const newGeometry = new THREE.BufferGeometry();
let material = objDefaultMaterial;
newGeometry.setIndex( volume.triangles );
newGeometry.setAttribute( 'position', vertices.clone() );

Expand Down Expand Up @@ -522,7 +523,8 @@
return sceneObject;

}
} );

}

THREE.AMFLoader = AMFLoader;

Expand Down
Loading

0 comments on commit d1a5133

Please sign in to comment.