Upstream/BlueMap
1
0
Fork 0
mirror of https://github.com/BlueMap-Minecraft/BlueMap.git synced 2024-12-24 01:48:05 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #18 from ewized/feature/cords

Browse Source 
Set positon cords from input field
This commit is contained in:
Lukas Rieger 2020-01-17 09:52:28 +01:00 committed by GitHub
commit a346bfc232
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 58 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
BlueMapCore/src/main/webroot/js/libs/Controls.js
View File

@ -101,10 +101,10 @@ export default class Controls {
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);
canvas.addEventListener('mousedown', this.onMouseDown, false);
canvas.addEventListener('mouseup', this.onMouseUp, false);
canvas.addEventListener('wheel', this.onMouseWheel, { passive: true });
window.addEventListener('keydown', this.onKeyDown, false);
window.addEventListener('keyup', this.onKeyUp, false);
@ -291,7 +291,7 @@ export default class Controls {
this.keyStates[event.keyCode] = true;
}
onKeyUp = e => {
onKeyUp = event => {
this.keyStates[event.keyCode] = false;
}
}

40
BlueMapCore/src/main/webroot/js/libs/modules/Position.js
View File

@ -29,19 +29,43 @@ 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);
this.elements = [
this.createPositionElement('x'),
null,//this.elementY = this.createPositionElement('y');
this.createPositionElement('z'),
];
$(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));
/** Creates the position display */
createPositionElement(type) {
const parent = getTopLeftElement(this.blueMap);
const element = $(`<div class="bluemap-position" data-pos="${type}"><input type="number" value="0" /></div>`)
.appendTo(parent)
.children()
.first();
element.on('input', this.onInput(type));
return element;
}
onInput = type => event => {
const value = Number(event.target.value);
if (!isNaN(value)) {
this.blueMap.controls.targetPosition[type] = value;
}
};
onBlueMapUpdateFrame = () => {
const { x, y, z } = this.blueMap.controls.targetPosition;
const values = [ z, y, x ];
for (let element of this.elements) {
const value = Math.floor(values.pop());
if (element) {
element.val(value);
}
}
};
}

21
BlueMapCore/src/main/webroot/style/modules/position.scss Normal file
View File

@ -0,0 +1,21 @@
.bluemap-position {
position: relative;
input {
width: 60px;
height: 30px;
border: none;
outline: none;
background: transparent;
padding: 0 5px 0 25px;
font-family: Verdana,Helvetica,Arial,sans-serif;
}
&[data-pos]::before {
position: absolute;
left: 7px;
color: #888888;
content: attr(data-pos)':';
}
}

27
BlueMapCore/src/main/webroot/style/style.scss
View File

@ -2,6 +2,7 @@
@import "./modules/compass.scss";
@import "./modules/info.scss";
@import "./modules/mapmenu.scss";
@import "./modules/position.scss";
@import "./modules/settings.scss";
html, body {
@ -125,29 +126,3 @@ html, body {
#bluemap-topleft > *:not(:last-child) {
border-right: solid 1px #dddddd;
}
.bluemap-position {
position: relative;
width: 60px;
height: 30px;
padding: 0 5px 0 25px;
}
.bluemap-position::before {
position: absolute;
left: 7px;
color: #888888;
}
.bluemap-position.pos-x::before {
content: "x:";
}
.bluemap-position.pos-y::before {
content: "y:";
}
.bluemap-position.pos-z::before {
content: "z:";
}