Upstream/BlueMap
1
0
Fork 0
mirror of https://github.com/BlueMap-Minecraft/BlueMap.git synced 2024-11-22 10:35:16 +01:00
Code Issues Projects Releases Wiki Activity

Separate JavaScript into es6 classes

Browse Source
This commit is contained in:
Joshua Rodriguez 2020-01-14 05:31:37 -08:00
parent 7ae08d1f44
commit 60cdab8516
15 changed files with 1415 additions and 1143 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
BlueMapCore/package.json
View File

@ -29,6 +29,8 @@
"node-sass": "^4.13.0",
"sass": "^1.24.4",
"sass-loader": "^8.0.2",
"ts-loader": "^6.2.1",
"typescript": "^3.7.4",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.10.1"

297
BlueMapCore/src/main/webroot/js/libs/Controls.js Normal file
View File

@ -0,0 +1,297 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the 'Software'), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Softwarevent.
*
* THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARevent.
*/
import $ from 'jquery';
import {
Euler,
Raycaster,
Vector2,
Vector3,
MOUSE
} from 'three';
import { Vector2_ZERO } from './utils.js';
export default class Controls {
static KEYS = {
LEFT: 37,
UP: 38,
RIGHT: 39,
DOWN: 40,
ORBIT: MOUSE.RIGHT,
MOVE: MOUSE.LEFT
};
static STATES = {
NONE: -1,
ORBIT: 0,
MOVE: 1,
};
/**
* targetHeightScene and cameraHeightScene are scenes of objects that are checked via raycasting for a height for the target and the camera
*/
constructor(camera, element, heightScene) {
this.settings = {
zoom: {
min: 10,
max: 2000,
speed: 1.5,
smooth: 0.2,
},
move: {
speed: 1.75,
smooth: 0.3,
smoothY: 0.075,
},
tilt: {
max: Math.PI / 2.1,
speed: 1.5,
smooth: 0.3,
},
rotate: {
speed: 1.5,
smooth: 0.3,
}
};
this.camera = camera;
this.element = element;
this.heightScene = heightScene;
this.minHeight = 0;
this.raycaster = new Raycaster();
this.rayDirection = new Vector3(0, -1, 0);
this.resetPosition();
this.mouse = new Vector2(0, 0);
this.lastMouse = new Vector2(0, 0);
this.deltaMouse = new Vector2(0, 0);
//variables used to calculate with (to prevent object creation every update)
this.orbitRot = new Euler(0, 0, 0, 'YXZ');
this.cameraPosDelta = new Vector3(0, 0, 0);
this.moveDelta = new Vector2(0, 0);
this.keyStates = {}
this.state = Controls.STATES.NONE;
let canvas = $(this.element).find('canvas').get(0);
window.addEventListener('contextmenu', event => {
event.preventDefault();
}, false);
canvas.addEventListener('mousedown', this.onMouseDown, false);
window.addEventListener('mousemove', this.onMouseMove, false);
window.addEventListener('mouseup', this.onMouseUp, false);
canvas.addEventListener('wheel', this.onMouseWheel, false);
window.addEventListener('keydown', this.onKeyDown, false);
window.addEventListener('keyup', this.onKeyUp, false);
this.camera.position.set(0, 1000, 0);
this.camera.lookAt(this.position);
this.camera.updateProjectionMatrix();
}
resetPosition() {
this.position = new Vector3(0, 70, 0);
this.targetPosition = new Vector3(0, 70, 0);
this.distance = 5000;
this.targetDistance = 1000;
this.direction = 0;
this.targetDirection = 0;
this.angle = 0;
this.targetAngle = 0;
}
update() {
this.updateMouseMoves();
let changed = false;
let zoomLerp = (this.distance - 100) / 200;
if (zoomLerp < 0) zoomLerp = 0;
if (zoomLerp > 1) zoomLerp = 1;
this.targetPosition.y = 300 * zoomLerp + this.minHeight * (1 - zoomLerp);
this.position.x += (this.targetPosition.x - this.position.x) * this.settings.move.smooth;
this.position.y += (this.targetPosition.y - this.position.y) * this.settings.move.smoothY;
this.position.z += (this.targetPosition.z - this.position.z) * this.settings.move.smooth;
this.distance += (this.targetDistance - this.distance) * this.settings.zoom.smooth;
let deltaDir = (this.targetDirection - this.direction) * this.settings.rotate.smooth;
this.direction += deltaDir;
changed = changed || Math.abs(deltaDir) > 0.001;
let max = Math.min(this.settings.tilt.max, this.settings.tilt.max - Math.pow(((this.distance - this.settings.zoom.min) / (this.settings.zoom.max - this.settings.zoom.min)) * Math.pow(this.settings.tilt.max, 4), 1/4));
if (this.targetAngle > max) this.targetAngle = max;
if (this.targetAngle < 0.01) this.targetAngle = 0.001;
let deltaAngle = (this.targetAngle - this.angle) * this.settings.tilt.smooth;
this.angle += deltaAngle;
changed = changed || Math.abs(deltaAngle) > 0.001;
let last = this.camera.position.x + this.camera.position.y + this.camera.position.z;
this.orbitRot.set(this.angle, this.direction, 0);
this.cameraPosDelta.set(0, this.distance, 0).applyEuler(this.orbitRot);
this.camera.position.set(this.position.x + this.cameraPosDelta.x, this.position.y + this.cameraPosDelta.y, this.position.z + this.cameraPosDelta.z);
let move = last - (this.camera.position.x + this.camera.position.y + this.camera.position.z);
changed = changed || Math.abs(move) > 0.001;
if (changed) {
this.camera.lookAt(this.position);
this.camera.updateProjectionMatrix();
this.updateHeights();
}
return changed;
}
updateHeights() {
//TODO: this can be performance-improved by only intersecting the correct tile?
let rayStart = new Vector3(this.targetPosition.x, 300, this.targetPosition.z);
this.raycaster.set(rayStart, this.rayDirection);
this.raycaster.near = 1;
this.raycaster.far = 300;
let intersects = this.raycaster.intersectObjects(this.heightScene.children);
if (intersects.length > 0){
this.minHeight = intersects[0].point.y;
//this.targetPosition.y = this.minHeight;
} else {
//this.targetPosition.y = 0;
}
rayStart.set(this.camera.position.x, 300, this.camera.position.z);
this.raycaster.set(rayStart, this.rayDirection);
intersects.length = 0;
intersects = this.raycaster.intersectObjects(this.heightScene.children);
if (intersects.length > 0){
if (intersects[0].point.y > this.minHeight){
this.minHeight = intersects[0].point.y;
}
}
};
updateMouseMoves = () => {
this.deltaMouse.set(this.lastMouse.x - this.mouse.x, this.lastMouse.y - this.mouse.y);
this.moveDelta.x = 0;
this.moveDelta.y = 0;
if (this.keyStates[Controls.KEYS.UP]){
this.moveDelta.y -= 20;
}
if (this.keyStates[Controls.KEYS.DOWN]){
this.moveDelta.y += 20;
}
if (this.keyStates[Controls.KEYS.LEFT]){
this.moveDelta.x -= 20;
}
if (this.keyStates[Controls.KEYS.RIGHT]){
this.moveDelta.x += 20;
}
if (this.state === Controls.STATES.MOVE) {
if (this.deltaMouse.x === 0 && this.deltaMouse.y === 0) return;
this.moveDelta.copy(this.deltaMouse);
}
if (this.moveDelta.x !== 0 || this.moveDelta.y !== 0) {
this.moveDelta.rotateAround(Vector2_ZERO, -this.direction);
this.targetPosition.set(
this.targetPosition.x + (this.moveDelta.x * this.distance / this.element.clientHeight * this.settings.move.speed),
this.targetPosition.y,
this.targetPosition.z + (this.moveDelta.y * this.distance / this.element.clientHeight * this.settings.move.speed)
);
}
if (this.state === Controls.STATES.ORBIT) {
this.targetDirection += (this.deltaMouse.x / this.element.clientHeight * Math.PI);
this.targetAngle += (this.deltaMouse.y / this.element.clientHeight * Math.PI);
}
this.lastMouse.copy(this.mouse);
};
onMouseWheel = event => {
if (event.deltaY > 0) {
this.targetDistance *= this.settings.zoom.speed;
} else if (event.deltaY < 0) {
this.targetDistance /= this.settings.zoom.speed;
}
if (this.targetDistance < this.settings.zoom.min) this.targetDistance = this.settings.zoom.min;
if (this.targetDistance > this.settings.zoom.max) this.targetDistance = this.settings.zoom.max;
}
onMouseMove = event => {
this.mouse.set(event.clientX, event.clientY);
if (this.state !== Controls.STATES.NONE){
event.preventDefault();
}
}
onMouseDown = event => {
if (this.state !== Controls.STATES.NONE) return;
switch (event.button) {
case Controls.KEYS.MOVE :
this.state = Controls.STATES.MOVE;
event.preventDefault();
break;
case Controls.KEYS.ORBIT :
this.state = Controls.STATES.ORBIT;
event.preventDefault();
break;
}
}
onMouseUp = event => {
if (this.state === Controls.STATES.NONE) return;
switch (event.button) {
case Controls.KEYS.MOVE :
if (this.state === Controls.STATES.MOVE) this.state = Controls.STATES.NONE;
break;
case Controls.KEYS.ORBIT :
if (this.state === Controls.STATES.ORBIT) this.state = Controls.STATES.NONE;
break;
}
}
onKeyDown = event => {
this.keyStates[event.keyCode] = true;
}
onKeyUp = e => {
this.keyStates[event.keyCode] = false;
}
}

59
BlueMapCore/src/main/webroot/js/libs/Tile.js Normal file
View File

@ -0,0 +1,59 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
export default class Tile {
isLoading = false;
disposed = false;
model = null;
constructor(scene, x, z) {
this.scene = scene;
this.x = x;
this.z = z;
}
setModel(model) {
this.disposeModel();
if (model) {
this.model = model;
this.scene.add(model);
//console.log("Added tile:", this.x, this.z);
}
}
disposeModel() {
this.disposed = true;
if (this.model) {
this.scene.remove(this.model);
this.model.geometry.dispose();
delete this.model;
//console.log("Removed tile:", this.x, this.z);
}
}
}

183
BlueMapCore/src/main/webroot/js/libs/TileManager.js Normal file
View File

@ -0,0 +1,183 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import { Vector2 } from 'three';
import Tile from './Tile.js';
import { hashTile } from './utils.js';
export default class TileManager {
constructor(blueMap, viewDistance, tileLoader, scene, tileSize, position) {
this.blueMap = blueMap;
this.viewDistance = viewDistance;
this.tileLoader = tileLoader;
this.scene = scene;
this.tileSize = new Vector2(tileSize.x, tileSize.z);
this.tile = new Vector2(position.x, position.z);
this.lastTile = this.tile.clone();
this.closed = false;
this.currentlyLoading = 0;
this.updateTimeout = null;
this.tiles = {};
}
setPosition(center) {
this.tile.set(center.x, center.z).divide(this.tileSize).floor();
if (!this.tile.equals(this.lastTile) && !this.closed) {
this.update();
this.lastTile.copy(this.tile);
}
}
update() {
if (this.closed) return;
//free a loader so if there was an error loading a tile we don"t get stuck forever with the blocked loading process
this.currentlyLoading--;
if (this.currentlyLoading < 0) this.currentlyLoading = 0;
this.removeFarTiles();
this.loadCloseTiles();
}
removeFarTiles() {
let keys = Object.keys(this.tiles);
for (let i = 0; i < keys.length; i++) {
if (!this.tiles.hasOwnProperty(keys[i])) continue;
let tile = this.tiles[keys[i]];
let vd = this.viewDistance;
if (
tile.x + vd < this.tile.x ||
tile.x - vd > this.tile.x ||
tile.z + vd < this.tile.y ||
tile.z - vd > this.tile.y
) {
tile.disposeModel();
delete this.tiles[keys[i]];
}
}
}
removeAllTiles() {
let keys = Object.keys(this.tiles);
for (let i = 0; i < keys.length; i++) {
if (!this.tiles.hasOwnProperty(keys[i])) continue;
let tile = this.tiles[keys[i]];
tile.disposeModel();
delete this.tiles[keys[i]];
}
}
close() {
this.closed = true;
this.removeAllTiles();
}
loadCloseTiles() {
if (this.closed) return;
if (this.currentlyLoading < 8) {
if (!this.loadNextTile()) return;
}
if (this.updateTimeout) clearTimeout(this.updateTimeout);
this.updateTimeout = setTimeout(() => this.loadCloseTiles(), 0);
}
loadNextTile() {
let x = 0;
let z = 0;
let d = 1;
let m = 1;
while (m < this.viewDistance * 2) {
while (2 * x * d < m) {
if (this.tryLoadTile(this.tile.x + x, this.tile.y + z)) return true;
x = x + d;
}
while (2 * z * d < m) {
if (this.tryLoadTile(this.tile.x + x, this.tile.y + z)) return true;
z = z + d;
}
d = -1 * d;
m = m + 1;
}
return false;
}
tryLoadTile(x, z) {
if (this.closed) return;
let tileHash = hashTile(x, z);
let tile = this.tiles[tileHash];
if (tile !== undefined) return false;
tile = new Tile(this.scene, x, z);
tile.isLoading = true;
this.currentlyLoading++;
this.tiles[tileHash] = tile;
this.tileLoader.call(this.blueMap, x, z, model => {
tile.isLoading = false;
if (tile.disposed || this.closed) {
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;
}, error => {
tile.isLoading = false;
tile.disposeModel();
this.currentlyLoading--;
//console.log("Failed to load tile: ", x, z);
});
return true;
}
}

1537
BlueMapCore/src/main/webroot/js/libs/bluemap.js
View File

File diff suppressed because it is too large Load Diff

53
BlueMapCore/src/main/webroot/js/libs/modules/Compass.js Normal file
View File

@ -0,0 +1,53 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import $ from 'jquery';
import { getTopLeftElement } from './Module.js';
import COMPASS from '../../../assets/compass.svg';
export default class Compass {
constructor(blueMap) {
this.blueMap = blueMap;
$('#bluemap-compass').remove();
this.element = $(`<div id="bluemap-compass" class="button"><img id="bluemap-compass-needle" src="${COMPASS}" /></div>`).appendTo(getTopLeftElement(blueMap));
this.needle = $('#bluemap-compass-needle');
$(document).on('bluemap-update-frame', this.onBlueMapUpdateFrame);
$(this.element).click(this.onClick);
}
onBlueMapUpdateFrame = () => {
this.needle.css('transform', `rotate(${this.blueMap.controls.direction}rad)`);
}
onClick = () => {
this.blueMap.controls.targetDirection = 0;
this.blueMap.controls.direction = this.blueMap.controls.direction % (Math.PI * 2);
if (this.blueMap.controls.direction < -Math.PI) this.blueMap.controls.direction += Math.PI * 2;
if (this.blueMap.controls.direction > Math.PI) this.blueMap.controls.direction -= Math.PI * 2;
}
}

49
BlueMapCore/src/main/webroot/js/libs/modules/Info.js Normal file
View File

@ -0,0 +1,49 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import $ from 'jquery';
import { getTopRightElement } from './Module.js';
export default class Info {
constructor(blueMap) {
this.blueMap = blueMap;
const parent = getTopRightElement(blueMap);
$('#bluemap-info').remove();
this.elementInfo = $('<div id="bluemap-info" class="button"></div>').appendTo(parent);
this.elementInfo.click(this.onClick);
}
onClick = () => {
this.blueMap.alert(
'<h1>Info</h1>' +
'Visit BlueMap on <a href="https://github.com/BlueMap-Minecraft">GitHub</a>!<br>' +
'BlueMap works best with <a href="https://www.google.com/chrome/">Chrome</a>.<br>' +
'<h2>Controls</h2>' +
'Leftclick-drag with your mouse or use the arrow-keys to navigate.<br>' +
'Rightclick-drag with your mouse to rotate your view.<br>' +
'Scroll to zoom.<br>'
);
}
}

63
BlueMapCore/src/main/webroot/js/libs/modules/MapMenu.js Normal file
View File

@ -0,0 +1,63 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import $ from 'jquery';
import { getTopLeftElement } from './Module.js';
export default class MapMenu {
constructor(blueMap) {
this.bluemap = blueMap;
const maps = this.bluemap.settings;
$('#bluemap-mapmenu').remove();
this.element = $(`<div id="bluemap-mapmenu" class="dropdown-container"><span class="selection">${maps[this.bluemap.map].name}</span></div>`).appendTo(getTopLeftElement(blueMap));
const dropdown = $('<div class="dropdown"></div>').appendTo(this.element);
this.maplist = $('<ul></ul>').appendTo(dropdown);
for (let mapId in maps) {
if (!maps.hasOwnProperty(mapId)) continue;
if (!maps.enabled) continue;
const map = maps[mapId];
$(`<li map="${mapId}">${map.name}</li>`).appendTo(this.maplist);
}
this.maplist.find('li[map=' + this.bluemap.map + ']').hide();
this.maplist.find('li[map]').click(this.onMapClick);
$(document).on('bluemap-map-change', this.onBlueMapMapChange);
}
onMapClick = event => {
const map = $(this).attr('map');
this.bluemap.changeMap(map);
}
onBlueMapMapChange = () => {
this.maplist.find('li').show();
this.maplist.find('li[map=' + this.bluemap.map + ']').hide();
this.element.find('.selection').html(this.bluemap.settings[this.bluemap.map].name);
}
}

47
BlueMapCore/src/main/webroot/js/libs/modules/Module.js Normal file
View File

@ -0,0 +1,47 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import $ from 'jquery';
// ###### Modules ######
export const getTopRightElement = blueMap => {
let element = $('#bluemap-topright');
if (element.length === 0){
element = $('<div id="bluemap-topright" class="box"></div>').appendTo(blueMap.element);
}
return element;
};
export const getTopLeftElement = blueMap => {
let element = $('#bluemap-topleft');
if (element.length === 0){
element = $('<div id="bluemap-topleft" class="box"></div>').appendTo(blueMap.element);
}
return element;
};

47
BlueMapCore/src/main/webroot/js/libs/modules/Position.js Normal file
View File

@ -0,0 +1,47 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import $ from 'jquery';
import { getTopLeftElement } from './Module.js';
export default class Position {
constructor(blueMap) {
this.blueMap = blueMap;
const parent = getTopLeftElement(blueMap);
$('.bluemap-position').remove();
this.elementX = $('<div class="bluemap-position pos-x">0</div>').appendTo(parent);
//this.elementY = $('<div class="bluemap-position pos-y">0</div>').appendTo(parent);
this.elementZ = $('<div class="bluemap-position pos-z">0</div>').appendTo(parent);
$(document).on('bluemap-update-frame', this.onBlueMapUpdateFrame);
}
onBlueMapUpdateFrame = () => {
this.elementX.html(Math.floor(this.blueMap.controls.targetPosition.x));
//this.elementY.html(this.blueMap.controls.targetPosition.y === 0 ? "-" : Math.floor(this.blueMap.controls.targetPosition.y));
this.elementZ.html(Math.floor(this.blueMap.controls.targetPosition.z));
}
}

122
BlueMapCore/src/main/webroot/js/libs/modules/Settings.js Normal file
View File

@ -0,0 +1,122 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import $ from 'jquery';
import { Math as Math3 } from 'three';
import { getTopRightElement } from './Module.js';
import GEAR from '../../../assets/gear.svg';
export default class Settings {
constructor(blueMap) {
this.blueMap = blueMap;
const parent = getTopRightElement(blueMap);
$('#bluemap-settings').remove();
this.elementMenu = $('<div id="bluemap-settings-container" style="display: none"></div>').appendTo(parent);
this.elementSettings = $(`<div id="bluemap-settings" class="button"><img src="${GEAR}" /></div>`).appendTo(parent);
this.elementSettings.click(this.onSettingsClick);
/* Quality */
this.elementQuality = $(
'<div id="bluemap-settings-quality" class="dropdown-container"><span class="selection">Quality: <span>Normal</span></span><div class="dropdown"><ul>' +
'<li quality="2">High</li>' +
'<li quality="1" style="display: none">Normal</li>' +
'<li quality="0.75">Fast</li>' +
'</ul></div></div>'
).prependTo(this.elementMenu);
this.elementQuality.find('li[quality]').click(this.onQualityClick);
this.elementRenderDistance = $('<div id="bluemap-settings-render-distance" class="dropdown-container"></div>').prependTo(this.elementMenu);
this.init();
$(document).on('bluemap-map-change', this.init);
}
init = () => {
this.defaultHighRes = this.blueMap.hiresTileManager.viewDistance;
this.defaultLowRes = this.blueMap.lowresTileManager.viewDistance;
this.elementRenderDistance.html(
'<span class="selection">View Distance: <span>' + this.blueMap.hiresTileManager.viewDistance + '</span></span>' +
'<div class="dropdown">' +
'<input type="range" min="0" max="100" step="1" value="' + this.renderDistanceToPct(this.blueMap.hiresTileManager.viewDistance, this.defaultHighRes) + '" />' +
'</div>'
);
this.slider = this.elementRenderDistance.find('input');
this.slider.on('change input', this.onViewDistanceSlider);
};
onViewDistanceSlider = () => {
this.blueMap.hiresTileManager.viewDistance = this.pctToRenderDistance(parseFloat(this.slider.val()), this.defaultHighRes);
this.blueMap.lowresTileManager.viewDistance = this.pctToRenderDistance(parseFloat(this.slider.val()), this.defaultLowRes);
this.elementRenderDistance.find('.selection > span').html(Math.round(this.blueMap.hiresTileManager.viewDistance * 10) / 10);
this.blueMap.lowresTileManager.update();
this.blueMap.hiresTileManager.update();
};
onQualityClick = (event) => {
const target = event.target
const desc = $(target).html();
this.blueMap.quality = parseFloat($(target).attr("quality"));
this.elementQuality.find('li').show();
this.elementQuality.find(`li[quality="${this.blueMap.quality}"]`).hide();
this.elementQuality.find('.selection > span').html(desc);
this.blueMap.handleContainerResize();
};
onSettingsClick = () => {
if (this.elementMenu.css('display') === 'none'){
this.elementSettings.addClass('active');
} else {
this.elementSettings.removeClass('active');
}
this.elementMenu.animate({
width: 'toggle'
}, 200);
}
pctToRenderDistance(value, defaultValue) {
let max = defaultValue * 5;
if (max > 20) max = 20;
return Math3.mapLinear(value, 0, 100, 1, max);
}
renderDistanceToPct(value, defaultValue) {
let max = defaultValue * 5;
if (max > 20) max = 20;
return Math3.mapLinear(value, 1, max, 0, 100);
}
}

66
BlueMapCore/src/main/webroot/js/libs/utils.js Normal file
View File

@ -0,0 +1,66 @@
/*
* This file is part of BlueMap, licensed under the MIT License (MIT).
*
* Copyright (c) Blue (Lukas Rieger) <https://bluecolored.de>
* Copyright (c) contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
import { Vector2, Vector3 } from 'three';
export const stringToImage = string => {
let image = document.createElementNS("http://www.w3.org/1999/xhtml", "img");
image.src = string;
return image;
};
export const pathFromCoords = (x, z) => {
let path = "x";
path += splitNumberToPath(x);
path += "z";
path += splitNumberToPath(z);
path = path.substring(0, path.length - 1);
return path;
};
export const splitNumberToPath = num => {
let path = "";
if (num < 0) {
num = -num;
path += "-";
}
let s = num.toString();
for (let i = 0; i < s.length; i++) {
path += s.charAt(i) + "/";
}
return path;
};
export const hashTile = (x, z) => `x${x}z${z}`;
export const Vector2_ZERO = new Vector2(0, 0);
export const Vector3_ZERO = new Vector3(0, 0, 0);

13
BlueMapCore/src/main/webroot/js/site.js
View File

@ -1,11 +1,8 @@
import $ from "jquery";
import BlueMap from "./libs/bluemap.js";
import $ from 'jquery';
import BlueMap from './libs/BlueMap.js';
import "../style/style.css"
import '../style/style.css';
// global variable to enable access through browser console
var blueMap;
$(document).ready(function () {
blueMap = new BlueMap($("#map-container")[0], "data/");
$(document).ready(() => {
window.blueMap = new BlueMap($('#map-container')[0], 'data/');
});

14
BlueMapCore/tsconfig.json Normal file
View File

@ -0,0 +1,14 @@
{
"compilerOptions": {
"sourceMap": true,
"module": "esnext",
"target": "es6",
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"moduleResolution": "node",
"strict": true,
"esModuleInterop": true,
"allowJs": true
},
"include": [ "src" ]
}

6
BlueMapCore/webpack.config.js
View File

@ -38,6 +38,12 @@ module.exports = {
},
module: {
rules: [
// Transpile JavaScript source files using TypeScript engine
{
test: /\.(js|ts)$/,
include: /src/,
use: 'ts-loader',
},
// Just import normal css files
{
test: /\.css$/,