mirror of
https://github.com/BlueMap-Minecraft/BlueMapWeb.git
synced 2024-09-27 13:12:46 +02:00
More tweaks
This commit is contained in:
parent
ba99a79109
commit
760368eaa2
@ -176,21 +176,44 @@ export class MapViewer {
|
|||||||
|
|
||||||
// check Object3D interactions
|
// check Object3D interactions
|
||||||
let intersects = this.raycaster.intersectObjects([this.map.hiresTileManager.scene, this.map.lowresTileManager.scene, this.markers], true);
|
let intersects = this.raycaster.intersectObjects([this.map.hiresTileManager.scene, this.map.lowresTileManager.scene, this.markers], true);
|
||||||
|
let hit = null;
|
||||||
|
let lowresHit = null;
|
||||||
|
let hiresHit = null;
|
||||||
let covered = false;
|
let covered = false;
|
||||||
for (let i = 0; i < intersects.length; i++) {
|
for (let i = 0; i < intersects.length; i++) {
|
||||||
if (intersects[i].object){
|
if (intersects[i].object){
|
||||||
let object = intersects[i].object;
|
let object = intersects[i].object;
|
||||||
|
|
||||||
if (object.visible) {
|
// check if deeply-visible
|
||||||
|
let parent = object;
|
||||||
|
let visible = parent.visible;
|
||||||
|
while (visible && parent.parent){
|
||||||
|
parent = parent.parent;
|
||||||
|
visible = parent.visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (visible) {
|
||||||
|
if (!hit) hit = intersects[i];
|
||||||
|
|
||||||
|
// find root-scene
|
||||||
|
let parentRoot = object;
|
||||||
|
while(parentRoot.parent) parentRoot = parentRoot.parent;
|
||||||
|
|
||||||
|
if (parentRoot === this.map.lowresTileManager.scene) {
|
||||||
|
if (!lowresHit) lowresHit = intersects[i];
|
||||||
|
}
|
||||||
|
|
||||||
|
if (parentRoot === this.map.hiresTileManager.scene) {
|
||||||
|
if (!hiresHit) hiresHit = intersects[i];
|
||||||
|
}
|
||||||
|
|
||||||
if (!covered || (object.material && !object.material.depthTest)) {
|
if (!covered || (object.material && !object.material.depthTest)) {
|
||||||
if (object.onClick({
|
if (object.onClick && object.onClick({
|
||||||
data: data,
|
data: data,
|
||||||
intersection: intersects[i]
|
intersection: intersects[i]
|
||||||
})) return;
|
})) return;
|
||||||
}
|
}
|
||||||
|
|
||||||
let parentRoot = object;
|
|
||||||
while(parentRoot.parent) parentRoot = parentRoot.parent;
|
|
||||||
if (parentRoot !== this.map.lowresTileManager.scene) {
|
if (parentRoot !== this.map.lowresTileManager.scene) {
|
||||||
covered = true;
|
covered = true;
|
||||||
}
|
}
|
||||||
@ -201,7 +224,11 @@ export class MapViewer {
|
|||||||
// fire event
|
// fire event
|
||||||
dispatchEvent(this.events, "bluemapMapInteraction", {
|
dispatchEvent(this.events, "bluemapMapInteraction", {
|
||||||
data: data,
|
data: data,
|
||||||
intersections: intersects
|
hit: hit,
|
||||||
|
hiresHit: hiresHit,
|
||||||
|
lowresHit: lowresHit,
|
||||||
|
intersections: intersects,
|
||||||
|
ray: this.raycaster.ray
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -285,6 +312,10 @@ export class MapViewer {
|
|||||||
if (this.map && this.map.isMap) {
|
if (this.map && this.map.isMap) {
|
||||||
return map.load(HIRES_VERTEX_SHADER, HIRES_FRAGMENT_SHADER, LOWRES_VERTEX_SHADER, LOWRES_FRAGMENT_SHADER, this.data.uniforms)
|
return map.load(HIRES_VERTEX_SHADER, HIRES_FRAGMENT_SHADER, LOWRES_VERTEX_SHADER, LOWRES_FRAGMENT_SHADER, this.data.uniforms)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
|
for (let texture of this.map.loadedTextures){
|
||||||
|
this.renderer.initTexture(texture);
|
||||||
|
}
|
||||||
|
|
||||||
this.data.uniforms.skyColor.value = map.data.skyColor;
|
this.data.uniforms.skyColor.value = map.data.skyColor;
|
||||||
this.data.uniforms.ambientLight.value = map.data.ambientLight;
|
this.data.uniforms.ambientLight.value = map.data.ambientLight;
|
||||||
this.data.uniforms.hiresTileMap.value.map = map.hiresTileManager.tileMap.texture;
|
this.data.uniforms.hiresTileMap.value.map = map.hiresTileManager.tileMap.texture;
|
||||||
|
@ -142,8 +142,8 @@ export class FreeFlightControls {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onMouseUp = evt => {
|
onMouseUp = evt => {
|
||||||
if (this.clickStart.x !== evt.x) return;
|
if (Math.abs(this.clickStart.x - evt.x) > 5) return;
|
||||||
if (this.clickStart.y !== evt.y) return;
|
if (Math.abs(this.clickStart.y - evt.y) > 5) return;
|
||||||
|
|
||||||
this.target.requestPointerLock();
|
this.target.requestPointerLock();
|
||||||
}
|
}
|
||||||
|
@ -35,6 +35,7 @@ export class KeyHeightControls {
|
|||||||
],
|
],
|
||||||
DOWN: [
|
DOWN: [
|
||||||
new KeyCombination("ShiftLeft"),
|
new KeyCombination("ShiftLeft"),
|
||||||
|
new KeyCombination("ShiftRight"),
|
||||||
new KeyCombination("PageDown")
|
new KeyCombination("PageDown")
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
|
@ -244,7 +244,7 @@ export class MapControls {
|
|||||||
}
|
}
|
||||||
|
|
||||||
initializeHammer() {
|
initializeHammer() {
|
||||||
let touchTap = new Tap({ event: 'tap', pointers: 1, taps: 1, threshold: 2 });
|
let touchTap = new Tap({ event: 'tap', pointers: 1, taps: 1, threshold: 5 });
|
||||||
let touchMove = new Pan({ event: 'move', pointers: 1, direction: DIRECTION_ALL, threshold: 0 });
|
let touchMove = new Pan({ event: 'move', pointers: 1, direction: DIRECTION_ALL, threshold: 0 });
|
||||||
let touchTilt = new Pan({ event: 'tilt', pointers: 2, direction: DIRECTION_VERTICAL, threshold: 0 });
|
let touchTilt = new Pan({ event: 'tilt', pointers: 2, direction: DIRECTION_VERTICAL, threshold: 0 });
|
||||||
let touchRotate = new Rotate({ event: 'rotate', pointers: 2, threshold: 0 });
|
let touchRotate = new Rotate({ event: 'rotate', pointers: 2, threshold: 0 });
|
||||||
|
@ -74,10 +74,15 @@ export class TileManager {
|
|||||||
loadAroundTile(x, z, viewDistanceX, viewDistanceZ) {
|
loadAroundTile(x, z, viewDistanceX, viewDistanceZ) {
|
||||||
this.unloaded = false;
|
this.unloaded = false;
|
||||||
|
|
||||||
|
let unloadTiles = false;
|
||||||
|
if (this.viewDistanceX > viewDistanceX || this.viewDistanceZ > viewDistanceZ) {
|
||||||
|
unloadTiles = true;
|
||||||
|
}
|
||||||
|
|
||||||
this.viewDistanceX = viewDistanceX;
|
this.viewDistanceX = viewDistanceX;
|
||||||
this.viewDistanceZ = viewDistanceZ;
|
this.viewDistanceZ = viewDistanceZ;
|
||||||
|
|
||||||
if (this.centerTile.x !== x || this.centerTile.y !== z) {
|
if (unloadTiles || this.centerTile.x !== x || this.centerTile.y !== z) {
|
||||||
this.centerTile.set(x, z);
|
this.centerTile.set(x, z);
|
||||||
this.removeFarTiles();
|
this.removeFarTiles();
|
||||||
|
|
||||||
|
@ -82,7 +82,7 @@ export class HtmlMarker extends Marker {
|
|||||||
* @returns {Element}
|
* @returns {Element}
|
||||||
*/
|
*/
|
||||||
get element() {
|
get element() {
|
||||||
return this.elementObject.element;
|
return this.elementObject.element.getElementsByTagName("div")[0];
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -59,12 +59,17 @@ export class MarkerManager {
|
|||||||
* @param ms - interval in milliseconds
|
* @param ms - interval in milliseconds
|
||||||
*/
|
*/
|
||||||
setAutoUpdateInterval(ms) {
|
setAutoUpdateInterval(ms) {
|
||||||
if (this._updateInterval) clearInterval(this._updateInterval);
|
if (this._updateInterval) clearTimeout(this._updateInterval);
|
||||||
if (ms > 0) {
|
if (ms > 0) {
|
||||||
let autoUpdate = () => {
|
let autoUpdate = () => {
|
||||||
this.update().finally(() => {
|
this.update()
|
||||||
this._updateInterval = setTimeout(autoUpdate, ms);
|
.then(() => {
|
||||||
});
|
this._updateInterval = setTimeout(autoUpdate, ms);
|
||||||
|
})
|
||||||
|
.catch(e => {
|
||||||
|
alert(this.events, e, "warning");
|
||||||
|
this._updateInterval = setTimeout(autoUpdate, Math.max(ms, 1000 * 15));
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
this._updateInterval = setTimeout(autoUpdate, ms);
|
this._updateInterval = setTimeout(autoUpdate, ms);
|
||||||
@ -77,10 +82,7 @@ export class MarkerManager {
|
|||||||
*/
|
*/
|
||||||
update() {
|
update() {
|
||||||
return this.loadMarkerFile()
|
return this.loadMarkerFile()
|
||||||
.then(markerFileData => this.updateFromData(markerFileData))
|
.then(markerFileData => this.updateFromData(markerFileData));
|
||||||
.catch(error => {
|
|
||||||
alert(this.events, error, "warning");
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -38,6 +38,7 @@ export class ObjectMarker extends Marker {
|
|||||||
this.data.type = "object";
|
this.data.type = "object";
|
||||||
|
|
||||||
this.data.label = null;
|
this.data.label = null;
|
||||||
|
this.data.detail = null;
|
||||||
this.data.link = null;
|
this.data.link = null;
|
||||||
this.data.newTab = true;
|
this.data.newTab = true;
|
||||||
}
|
}
|
||||||
@ -49,8 +50,8 @@ export class ObjectMarker extends Marker {
|
|||||||
pos.sub(this.position);
|
pos.sub(this.position);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.data.label) {
|
if (this.data.detail || this.data.label) {
|
||||||
let popup = new LabelPopup(this.data.label);
|
let popup = new LabelPopup(this.data.detail || this.data.label);
|
||||||
popup.position.copy(pos);
|
popup.position.copy(pos);
|
||||||
this.add(popup);
|
this.add(popup);
|
||||||
popup.open();
|
popup.open();
|
||||||
@ -67,6 +68,7 @@ export class ObjectMarker extends Marker {
|
|||||||
* @param markerData {{
|
* @param markerData {{
|
||||||
* position: {x: number, y: number, z: number},
|
* position: {x: number, y: number, z: number},
|
||||||
* label: string,
|
* label: string,
|
||||||
|
* detail: string,
|
||||||
* link: string,
|
* link: string,
|
||||||
* newTab: boolean
|
* newTab: boolean
|
||||||
* }}
|
* }}
|
||||||
@ -82,10 +84,12 @@ export class ObjectMarker extends Marker {
|
|||||||
// update label
|
// update label
|
||||||
this.data.label = markerData.label || null;
|
this.data.label = markerData.label || null;
|
||||||
|
|
||||||
|
//update detail
|
||||||
|
this.data.detail = markerData.detail || null;
|
||||||
|
|
||||||
// update link
|
// update link
|
||||||
this.data.link = markerData.link || null;
|
this.data.link = markerData.link || null;
|
||||||
this.data.newTab = !!markerData.newTab;
|
this.data.newTab = !!markerData.newTab;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -43,7 +43,7 @@ export class PoiMarker extends HtmlMarker {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onClick(event) {
|
onClick(event) {
|
||||||
if (this.highlight) return;
|
if (this.highlight || !this.data.label) return true;
|
||||||
this.highlight = true;
|
this.highlight = true;
|
||||||
|
|
||||||
let eventHandler = evt => {
|
let eventHandler = evt => {
|
||||||
@ -102,12 +102,15 @@ export class PoiMarker extends HtmlMarker {
|
|||||||
|
|
||||||
// update anchor
|
// update anchor
|
||||||
let anch = markerData.anchor || markerData.iconAnchor || {}; //"iconAnchor" for backwards compatibility
|
let anch = markerData.anchor || markerData.iconAnchor || {}; //"iconAnchor" for backwards compatibility
|
||||||
this.anchor.setX(anch.x || 0);
|
this.iconElement.style.transform = `translate(${-anch.x}px, ${-anch.y}px)`;
|
||||||
this.anchor.setY(anch.y || 0);
|
//this.anchor.setX(anch.x || 0);
|
||||||
|
//this.anchor.setY(anch.y || 0);
|
||||||
|
|
||||||
|
|
||||||
// update label
|
// update label
|
||||||
if (this.labelElement.innerHTML !== markerData.label){
|
if (this.data.label !== markerData.label){
|
||||||
this.labelElement.innerHTML = markerData.label || "";
|
this.data.label = markerData.label || "";
|
||||||
|
this.labelElement.innerHTML = this.data.label || "";
|
||||||
}
|
}
|
||||||
|
|
||||||
// update icon
|
// update icon
|
||||||
|
@ -38,8 +38,18 @@ var CSS2DObject = function ( element ) {
|
|||||||
|
|
||||||
} );
|
} );
|
||||||
|
|
||||||
this.element.addEventListener("click", event => this.onClick(event));
|
this.element.addEventListener("click", event => {
|
||||||
this.element.addEventListener("touch", event => this.onClick(event));
|
if (this.onClick(event)) {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.element.addEventListener("touch", event => {
|
||||||
|
if (this.onClick(event)) {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user