mirror of
https://github.com/BlueMap-Minecraft/BlueMapWeb.git
synced 2024-11-28 04:45:13 +01:00
Small fixes and improvements
This commit is contained in:
parent
eda14d3c32
commit
ba99a79109
@ -147,8 +147,13 @@ export class ControlsManager {
|
||||
if (this.mapViewer.map) {
|
||||
let triggerDistance = 1;
|
||||
if (valueChanged) {
|
||||
triggerDistance = this.mapViewer.loadedLowresViewDistance * 0.5;
|
||||
if (this.distance > 300) {
|
||||
triggerDistance = this.mapViewer.data.loadedLowresViewDistance * 0.5;
|
||||
} else {
|
||||
triggerDistance = this.mapViewer.data.loadedHiresViewDistance * 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
if (
|
||||
Math.abs(this.lastMapUpdatePosition.x - this.position.x) >= triggerDistance ||
|
||||
Math.abs(this.lastMapUpdatePosition.z - this.position.z) >= triggerDistance
|
||||
|
@ -96,39 +96,11 @@ export class Map {
|
||||
load(hiresVertexShader, hiresFragmentShader, lowresVertexShader, lowresFragmentShader, uniforms) {
|
||||
this.unload()
|
||||
|
||||
let settingsFilePromise = this.loadSettingsFile();
|
||||
let settingsPromise = this.loadSettings();
|
||||
let textureFilePromise = this.loadTexturesFile();
|
||||
|
||||
this.lowresMaterial = this.createLowresMaterial(lowresVertexShader, lowresFragmentShader, uniforms);
|
||||
|
||||
let settingsPromise = settingsFilePromise
|
||||
.then(worldSettings => {
|
||||
this.data.name = worldSettings.name ? worldSettings.name : this.data.name;
|
||||
this.data.world = worldSettings.world ? worldSettings.world : this.data.world;
|
||||
|
||||
this.data.startPos = {...this.data.startPos, ...worldSettings.startPos};
|
||||
this.data.skyColor.setRGB(
|
||||
worldSettings.skyColor.r || this.data.skyColor.r,
|
||||
worldSettings.skyColor.g || this.data.skyColor.g,
|
||||
worldSettings.skyColor.b || this.data.skyColor.b,
|
||||
);
|
||||
this.data.ambientLight = worldSettings.ambientLight ? worldSettings.ambientLight : this.data.ambientLight;
|
||||
|
||||
if (worldSettings.hires === undefined) worldSettings.hires = {};
|
||||
if (worldSettings.lowres === undefined) worldSettings.lowres = {};
|
||||
|
||||
this.data.hires = {
|
||||
tileSize: {...this.data.hires.tileSize, ...worldSettings.hires.tileSize},
|
||||
scale: {...this.data.hires.scale, ...worldSettings.hires.scale},
|
||||
translate: {...this.data.hires.translate, ...worldSettings.hires.translate}
|
||||
};
|
||||
this.data.lowres = {
|
||||
tileSize: {...this.data.lowres.tileSize, ...worldSettings.lowres.tileSize},
|
||||
scale: {...this.data.lowres.scale, ...worldSettings.lowres.scale},
|
||||
translate: {...this.data.lowres.translate, ...worldSettings.lowres.translate}
|
||||
};
|
||||
});
|
||||
|
||||
return Promise.all([settingsPromise, textureFilePromise])
|
||||
.then(values => {
|
||||
let textures = values[1];
|
||||
@ -146,6 +118,42 @@ export class Map {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Loads the settings of this map
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
loadSettings() {
|
||||
return this.loadSettingsFile()
|
||||
.then(worldSettings => {
|
||||
this.data.name = worldSettings.name ? worldSettings.name : this.data.name;
|
||||
this.data.world = worldSettings.world ? worldSettings.world : this.data.world;
|
||||
|
||||
this.data.startPos = {...this.data.startPos, ...worldSettings.startPos};
|
||||
this.data.skyColor.setRGB(
|
||||
worldSettings.skyColor.r !== undefined ? worldSettings.skyColor.r : this.data.skyColor.r,
|
||||
worldSettings.skyColor.g !== undefined ? worldSettings.skyColor.g : this.data.skyColor.g,
|
||||
worldSettings.skyColor.b !== undefined ? worldSettings.skyColor.b : this.data.skyColor.b
|
||||
);
|
||||
this.data.ambientLight = worldSettings.ambientLight ? worldSettings.ambientLight : this.data.ambientLight;
|
||||
|
||||
if (worldSettings.hires === undefined) worldSettings.hires = {};
|
||||
if (worldSettings.lowres === undefined) worldSettings.lowres = {};
|
||||
|
||||
this.data.hires = {
|
||||
tileSize: {...this.data.hires.tileSize, ...worldSettings.hires.tileSize},
|
||||
scale: {...this.data.hires.scale, ...worldSettings.hires.scale},
|
||||
translate: {...this.data.hires.translate, ...worldSettings.hires.translate}
|
||||
};
|
||||
this.data.lowres = {
|
||||
tileSize: {...this.data.lowres.tileSize, ...worldSettings.lowres.tileSize},
|
||||
scale: {...this.data.lowres.scale, ...worldSettings.lowres.scale},
|
||||
translate: {...this.data.lowres.translate, ...worldSettings.lowres.translate}
|
||||
};
|
||||
|
||||
alert(this.events, `Settings for map '${this.data.id}' loaded.`, "fine");
|
||||
});
|
||||
}
|
||||
|
||||
onTileLoad = layer => tile => {
|
||||
dispatchEvent(this.events, "bluemapMapTileLoaded", {
|
||||
tile: tile,
|
||||
@ -198,7 +206,7 @@ export class Map {
|
||||
if (settings.maps && settings.maps[this.data.id]) {
|
||||
resolve(settings.maps[this.data.id]);
|
||||
} else {
|
||||
reject(`the settings.json does not contain informations for map: ${this.data.id}`);
|
||||
reject(`the settings.json does not contain information for map: ${this.data.id}`);
|
||||
}
|
||||
},
|
||||
() => {},
|
||||
@ -268,7 +276,8 @@ export class Map {
|
||||
textureImage: {
|
||||
type: 't',
|
||||
value: texture
|
||||
}
|
||||
},
|
||||
transparent: { value: transparent }
|
||||
},
|
||||
vertexShader: vertexShader,
|
||||
fragmentShader: fragmentShader,
|
||||
|
@ -36,7 +36,8 @@ export class Marker extends Object3D {
|
||||
this.data = {
|
||||
id: markerId,
|
||||
type: "marker",
|
||||
position: this.position
|
||||
position: this.position,
|
||||
visible: this.visible
|
||||
};
|
||||
|
||||
// redirect parent properties
|
||||
@ -44,6 +45,10 @@ export class Marker extends Object3D {
|
||||
get() { return this.data.position },
|
||||
set(value) { this.data.position = value }
|
||||
});
|
||||
Object.defineProperty(this, "visible", {
|
||||
get() { return this.data.visible },
|
||||
set(value) { this.data.visible = value }
|
||||
});
|
||||
}
|
||||
|
||||
dispose() {}
|
||||
|
@ -88,12 +88,16 @@ export class MarkerFileManager extends MarkerManager {
|
||||
if (!markerSet) {
|
||||
markerSet = new MarkerSet(markerSetData.id);
|
||||
this.addMarkerSet(markerSet);
|
||||
|
||||
if (markerSetData.defaultHide) {
|
||||
markerSet.visible = false;
|
||||
}
|
||||
}
|
||||
|
||||
// update set info
|
||||
markerSet.label = markerSetData.label || markerSetData.id;
|
||||
markerSet.toggleable = !!markerSetData.toggleable;
|
||||
markerSet.defaultHide = !!markerSetData.defaultHide;
|
||||
markerSet.data.label = markerSetData.label || markerSetData.id;
|
||||
markerSet.data.toggleable = !!markerSetData.toggleable;
|
||||
markerSet.data.defaultHide = !!markerSetData.defaultHide;
|
||||
|
||||
// update markers
|
||||
let updatedMarkers = new Set();
|
||||
|
@ -40,7 +40,13 @@ export class MarkerSet extends Scene {
|
||||
defaultHide: false,
|
||||
markerSets: [],
|
||||
markers: [],
|
||||
visible: this.visible,
|
||||
};
|
||||
|
||||
Object.defineProperty(this, "visible", {
|
||||
get() { return this.data.visible },
|
||||
set(value) { this.data.visible = value }
|
||||
});
|
||||
}
|
||||
|
||||
add(...object) {
|
||||
@ -74,8 +80,6 @@ export class MarkerSet extends Scene {
|
||||
}
|
||||
|
||||
dispose() {
|
||||
super.dispose();
|
||||
|
||||
this.children.forEach(child => {
|
||||
if (child.dispose) child.dispose();
|
||||
});
|
||||
|
@ -80,11 +80,11 @@ export class ObjectMarker extends Marker {
|
||||
this.position.setZ(pos.z || 0);
|
||||
|
||||
// update label
|
||||
this.label = markerData.label || null;
|
||||
this.data.label = markerData.label || null;
|
||||
|
||||
// update link
|
||||
this.link = markerData.link || null;
|
||||
this.newTab = !!markerData.newTab;
|
||||
this.data.link = markerData.link || null;
|
||||
this.data.newTab = !!markerData.newTab;
|
||||
|
||||
}
|
||||
|
||||
|
@ -37,11 +37,12 @@ export class PlayerMarker extends Marker {
|
||||
Object.defineProperty(this, 'isPlayerMarker', {value: true});
|
||||
this.data.type = "player";
|
||||
|
||||
this.playerUuid = playerUuid;
|
||||
this.data.playerUuid = playerUuid;
|
||||
this.data.name = playerUuid;
|
||||
|
||||
this.elementObject = new CSS2DObject(htmlToElement(`
|
||||
<div id="bm-marker-${this.data.id}" class="bm-marker-${this.data.type}">
|
||||
<img src="assets/playerheads/${this.playerUuid}.png" alt="playerhead" draggable="false">
|
||||
<img src="assets/playerheads/${this.data.playerUuid}.png" alt="playerhead" draggable="false">
|
||||
<div class="bm-player-name"></div>
|
||||
</div>
|
||||
`));
|
||||
@ -55,7 +56,7 @@ export class PlayerMarker extends Marker {
|
||||
});
|
||||
|
||||
this.playerHeadElement.addEventListener('error', () => {
|
||||
this.playerHeadElement.src = "assets/playerheads/steve.png";
|
||||
this.playerHeadElement.src = "assets/steve.png";
|
||||
}, {once: true});
|
||||
|
||||
this.add(this.elementObject);
|
||||
@ -65,11 +66,21 @@ export class PlayerMarker extends Marker {
|
||||
* @returns {Element}
|
||||
*/
|
||||
get element() {
|
||||
return this.elementObject.element;
|
||||
return this.elementObject.element.getElementsByTagName("div")[0];
|
||||
}
|
||||
|
||||
onBeforeRender(renderer, scene, camera) {
|
||||
this.element.setAttribute("distance-data", Marker.calculateDistanceToCameraPlane(this.position, camera).toString());
|
||||
let distance = Marker.calculateDistanceToCameraPlane(this.position, camera);
|
||||
|
||||
let value = "near";
|
||||
if (distance > 1000) {
|
||||
value = "med";
|
||||
}
|
||||
if (distance > 5000) {
|
||||
value = "far";
|
||||
}
|
||||
|
||||
this.element.setAttribute("distance-data", value);
|
||||
}
|
||||
|
||||
/**
|
||||
@ -103,7 +114,7 @@ export class PlayerMarker extends Marker {
|
||||
}
|
||||
let deltaPos = {
|
||||
x: (pos.x || 0) - startPos.x,
|
||||
y: (pos.y || 0) - startPos.y,
|
||||
y: ((pos.y || 0) + 1.8) - startPos.y,
|
||||
z: (pos.z || 0) - startPos.z,
|
||||
}
|
||||
if (deltaPos.x || deltaPos.y || deltaPos.z) {
|
||||
@ -119,7 +130,8 @@ export class PlayerMarker extends Marker {
|
||||
}
|
||||
|
||||
// update name
|
||||
let name = markerData.name || this.playerUuid;
|
||||
let name = markerData.name || this.data.playerUuid;
|
||||
this.data.name = name;
|
||||
if (this.playerNameElement.innerHTML !== name)
|
||||
this.playerNameElement.innerHTML = name;
|
||||
|
||||
@ -128,7 +140,8 @@ export class PlayerMarker extends Marker {
|
||||
dispose() {
|
||||
super.dispose();
|
||||
|
||||
if (this.element.parentNode) this.element.parentNode.removeChild(this.element);
|
||||
let element = this.elementObject.element;
|
||||
if (element.parentNode) element.parentNode.removeChild(element);
|
||||
}
|
||||
|
||||
}
|
@ -116,6 +116,7 @@ export class PlayerMarkerManager extends MarkerManager {
|
||||
|
||||
if (!playerMarkerSet) {
|
||||
playerMarkerSet = new MarkerSet("bm-players");
|
||||
playerMarkerSet.data.label = "Players";
|
||||
this.addMarkerSet(playerMarkerSet);
|
||||
}
|
||||
|
||||
|
@ -33,7 +33,7 @@ void main() {
|
||||
float horizonWidth = 0.005;
|
||||
float horizonHeight = 0.0;
|
||||
|
||||
vec4 color = vec4(skyColor * max(sunlightStrength, ambientLight), 1.0);
|
||||
vec4 color = vec4(skyColor * max(sunlightStrength * sunlightStrength, ambientLight), 1.0);
|
||||
float voidMultiplier = (clamp(vPosition.y - horizonHeight, -horizonWidth, horizonWidth) + horizonWidth) / (horizonWidth * 2.0);
|
||||
color.rgb *= voidMultiplier;
|
||||
|
||||
|
@ -9,12 +9,17 @@ import {
|
||||
Object3D, Vector2,
|
||||
Vector3
|
||||
} from "three";
|
||||
import {htmlToElement} from "./Utils";
|
||||
|
||||
var CSS2DObject = function ( element ) {
|
||||
|
||||
Object3D.call( this );
|
||||
|
||||
this.element = element;
|
||||
this.element = document.createElement("div");
|
||||
let parent = element.parentNode;
|
||||
parent.replaceChild(this.element, element);
|
||||
this.element.appendChild(element);
|
||||
|
||||
this.element.style.position = 'absolute';
|
||||
|
||||
this.anchor = new Vector2();
|
||||
|
Loading…
Reference in New Issue
Block a user