Use async/await insead of callbacks

BlueMapCore/src/main/webroot/js/libs/TileManager.js

@@ -138,7 +138,7 @@ export default class TileManager {
 	}
 
 	tryLoadTile(x, z) {
-		if (this.closed) return;
+		if (this.closed) return false;
 
 		let tileHash = hashTile(x, z);
 
@@ -152,31 +152,32 @@ export default class TileManager {
 
 		this.tiles[tileHash] = tile;
 
-		this.tileLoader.call(this.blueMap, x, z, model => {
+		this.tileLoader.call(this.blueMap, x, z)
-			tile.isLoading = false;
+			.then(model => {
+				tile.isLoading = false;
 
-			if (tile.disposed || this.closed) {
+				if (tile.disposed || this.closed) {
-				model.geometry.dispose();
+					model.geometry.dispose();
+					tile.disposeModel();
+					delete this.tiles[tileHash];
+					return;
+				}
+
+				this.tiles[tileHash] = tile;
+				tile.setModel(model);
+
+				this.blueMap.updateFrame = true;
+
+				this.currentlyLoading--;
+				if (this.currentlyLoading < 0) this.currentlyLoading = 0;
+			}).catch(error => {
+				tile.isLoading = false;
 				tile.disposeModel();
-				delete this.tiles[tileHash];
-				return;
-			}
 
-			this.tiles[tileHash] = tile;
+				this.currentlyLoading--;
-			tile.setModel(model);
 
-			this.blueMap.updateFrame = true;
+				//console.log("Failed to load tile: ", x, z);
-
+			});
-			this.currentlyLoading--;
-			if (this.currentlyLoading < 0) this.currentlyLoading = 0;
-		}, error => {
-			tile.isLoading = false;
-			tile.disposeModel();
-
-			this.currentlyLoading--;
-
-			//console.log("Failed to load tile: ", x, z);
-		});
 
 		return true;
 	}

BlueMapCore/src/main/webroot/js/libs/bluemap.js

@@ -79,7 +79,7 @@ export default class BlueMap {
 		this.locationHash = '';
 		this.controls = new Controls(this.camera, this.element, this.hiresScene);
 
-		this.loadSettings(() => {
+		this.loadSettings().then(async () => {
 			this.lowresTileManager = new TileManager(
 				this,
 				this.settings[this.map]['lowres']['viewDistance'],
@@ -98,12 +98,11 @@ export default class BlueMap {
 				{x: 0, z: 0}
 			);
 
-			this.loadHiresMaterial(() => {
+			await this.loadHiresMaterial();
-				this.loadLowresMaterial(() => {
+			await this.loadLowresMaterial();
-					this.initModules();
+
-					this.start();
+			this.initModules();
-				});
+			this.start();
-			});
 		});
 	}
 
@@ -257,28 +256,26 @@ export default class BlueMap {
 		this.updateFrame = true;
 	}
 
-	loadSettings(callback) {
+	async loadSettings() {
-		let scope = this;
+		return new Promise(resolve => {
-
+			this.fileLoader.load(this.dataRoot + 'settings.json', settings => {
-		this.fileLoader.load(this.dataRoot + 'settings.json', settings => {
+				this.settings = JSON.parse(settings);
-			scope.settings = JSON.parse(settings);
+				this.maps = [];
-
+				for (let map in this.settings) {
-			scope.maps = [];
+					if (this.settings.hasOwnProperty(map) && this.settings[map].enabled){
-			for (let map in scope.settings) {
+						this.maps.push(map);
-				if (scope.settings.hasOwnProperty(map) && scope.settings[map].enabled){
+					}
-					scope.maps.push(map);
 				}
-			}
 
-			scope.maps.sort((map1, map2) => {
+				this.maps.sort((map1, map2) => {
-				var sort = scope.settings[map1].ordinal - scope.settings[map2].ordinal;
+					var sort = this.settings[map1].ordinal - this.settings[map2].ordinal;
-				if (isNaN(sort)) return 0;
+					if (isNaN(sort)) return 0;
-				return sort;
+					return sort;
+				});
+
+				this.map = this.maps[0];
+				resolve();
 			});
-
-			scope.map = scope.maps[0];
-
-			callback.call(scope);
 		});
 	}
 
@@ -357,53 +354,53 @@ export default class BlueMap {
 		return new Mesh(geometry, material);
 	}
 
-	loadHiresMaterial(callback) {
+	async loadHiresMaterial() {
-		let scope = this;
+		return new Promise(resolve => {
+			this.fileLoader.load(this.dataRoot + 'textures.json', textures => {
+				textures = JSON.parse(textures);
 
-		this.fileLoader.load(this.dataRoot + 'textures.json', textures => {
+				let materials = [];
-			textures = JSON.parse(textures);
+				for (let i = 0; i < textures['textures'].length; i++) {
+					let t = textures['textures'][i];
 
-			let materials = [];
+					let material = new MeshLambertMaterial({
-			for (let i = 0; i < textures['textures'].length; i++) {
+						transparent: t['transparent'],
-				let t = textures['textures'][i];
+						alphaTest: 0.01,
+						depthWrite: true,
+						depthTest: true,
+						blending: NormalBlending,
+						vertexColors: VertexColors,
+						side: FrontSide,
+						wireframe: false
+					});
 
-				let material = new MeshLambertMaterial({
+					let texture = new Texture();
-					transparent: t['transparent'],
+					texture.image = stringToImage(t['texture']);
-					alphaTest: 0.01,
-					depthWrite: true,
-					depthTest: true,
-					blending: NormalBlending,
-					vertexColors: VertexColors,
-					side: FrontSide,
-					wireframe: false
-				});
 
-				let texture = new Texture();
+					texture.premultiplyAlpha = false;
-				texture.image = stringToImage(t['texture']);
+					texture.generateMipmaps = false;
+					texture.magFilter = NearestFilter;
+					texture.minFilter = NearestFilter;
+					texture.wrapS = ClampToEdgeWrapping;
+					texture.wrapT = ClampToEdgeWrapping;
+					texture.flipY = false;
+					texture.needsUpdate = true;
+					texture.flatShading = true;
 
-				texture.premultiplyAlpha = false;
+					material.map = texture;
-				texture.generateMipmaps = false;
+					material.needsUpdate = true;
-				texture.magFilter = NearestFilter;
-				texture.minFilter = NearestFilter;
-				texture.wrapS = ClampToEdgeWrapping;
-				texture.wrapT = ClampToEdgeWrapping;
-				texture.flipY = false;
-				texture.needsUpdate = true;
-				texture.flatShading = true;
 
-				material.map = texture;
+					materials[i] = material;
-				material.needsUpdate = true;
+				}
 
-				materials[i] = material;
+				this.hiresMaterial = materials;
-			}
 
-			scope.hiresMaterial = materials;
+				resolve();
-
+			});
-			callback.call(scope);
 		});
 	}
 
-	loadLowresMaterial(callback) {
+	async loadLowresMaterial() {
 		this.lowresMaterial = new MeshLambertMaterial({
 			transparent: false,
 			depthWrite: true,
@@ -412,52 +409,48 @@ export default class BlueMap {
 			side: FrontSide,
 			wireframe: false
 		});
-
-		callback.call(this);
 	}
 
-	loadHiresTile(tileX, tileZ, callback, onError) {
+	async loadHiresTile(tileX, tileZ) {
 		let path = this.dataRoot + this.map + '/hires/';
 		path += pathFromCoords(tileX, tileZ);
 		path += '.json';
 
-		this.bufferGeometryLoader.load(path, geometry => {
+		return new Promise((resolve, reject) => {
-			let object = new Mesh(geometry, this.hiresMaterial);
+			this.bufferGeometryLoader.load(path, geometry => {
+				let object = new Mesh(geometry, this.hiresMaterial);
 
-			let tileSize = this.settings[this.map]['hires']['tileSize'];
+				let tileSize = this.settings[this.map]['hires']['tileSize'];
-			let translate = this.settings[this.map]['hires']['translate'];
+				let translate = this.settings[this.map]['hires']['translate'];
-			let scale = this.settings[this.map]['hires']['scale'];
+				let scale = this.settings[this.map]['hires']['scale'];
-			object.position.set(tileX * tileSize.x + translate.x, 0, tileZ * tileSize.z + translate.z);
+				object.position.set(tileX * tileSize.x + translate.x, 0, tileZ * tileSize.z + translate.z);
-			object.scale.set(scale.x, 1, scale.z);
+				object.scale.set(scale.x, 1, scale.z);
 
-			callback.call(this, object);
+				resolve(object);
-		}, () => {
+			}, () => {
-
+			}, reject);
-		}, error => {
-			onError.call(this, error);
 		});
 	}
 
-	loadLowresTile(tileX, tileZ, callback, onError) {
+	async loadLowresTile(tileX, tileZ) {
 		let path = this.dataRoot + this.map + '/lowres/';
 		path += pathFromCoords(tileX, tileZ);
 		path += '.json';
 
-		this.bufferGeometryLoader.load(path, geometry => {
+		return new Promise((reslove, reject) => {
-			let object = new Mesh(geometry, this.lowresMaterial);
+			this.bufferGeometryLoader.load(path, geometry => {
+				let object = new Mesh(geometry, this.lowresMaterial);
 
-			let tileSize = this.settings[this.map]['lowres']['tileSize'];
+				let tileSize = this.settings[this.map]['lowres']['tileSize'];
-			let translate = this.settings[this.map]['lowres']['translate'];
+				let translate = this.settings[this.map]['lowres']['translate'];
-			let scale = this.settings[this.map]['lowres']['scale'];
+				let scale = this.settings[this.map]['lowres']['scale'];
-			object.position.set(tileX * tileSize.x + translate.x, 0, tileZ * tileSize.z + translate.z);
+				object.position.set(tileX * tileSize.x + translate.x, 0, tileZ * tileSize.z + translate.z);
-			object.scale.set(scale.x, 1, scale.z);
+				object.scale.set(scale.x, 1, scale.z);
 
-			callback.call(this, object);
+				reslove(object);
-		}, () => {
+			}, () => {
-
+			}, reject);
-		}, error => {
+		})
-			onError.call(this, error);
-		});
 	}
 
 	// ###### UI ######