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

Add abillity to copy a block-position into clipboard

Browse Source
This commit is contained in:
Lukas Rieger (Blue) 2024-11-28 16:28:19 +01:00
parent 5c59a957ff
commit 966234ef42
No known key found for this signature in database
GPG Key ID: AA33883B1BBA03E6
3 changed files with 80 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
common/webapp/public/lang/en.conf
View File

@ -135,6 +135,7 @@
sun: "Sun"
block: "Block"
}
clipboard: "click to copy"
}
info: {
title: "Info"

38
common/webapp/src/js/PopupMarker.js
View File

@ -70,6 +70,10 @@ export class PopupMarker extends Marker {
return true;
}
static blockClipboardFormat = (pos, isHires) => isHires ? `${pos.x} ${pos.y} ${pos.z}` : `${pos.x} ${pos.z}`;
static chunkClipboardFormat = (pos, isHires) => isHires ? `${pos.x} ${pos.y} ${pos.z}` : `${pos.x} ${pos.z}`;
static regionClipboardFormat = pos => `r.${pos.x}.${pos.z}.mca`
onMapInteraction = evt => {
let isHires = true;
let int = evt.detail.hiresHit;
@ -96,7 +100,9 @@ export class PopupMarker extends Marker {
if (isHires) {
this.element.innerHTML = `
<div class="group">
<div class="group"
data-tooltip="${i18n.t("blockTooltip.clipboard")}"
onclick="navigator.clipboard.writeText('${PopupMarker.blockClipboardFormat(this.position, true)}')" >
<div class="label">${i18n.t("blockTooltip.block")}:</div>
<div class="content">
<div class="entry"><span class="label">x: </span><span class="value">${this.position.x}</span></div>
@ -107,7 +113,9 @@ export class PopupMarker extends Marker {
`;
} else {
this.element.innerHTML = `
<div class="group">
<div class="group"
data-tooltip="${i18n.t("blockTooltip.clipboard")}"
onclick="navigator.clipboard.writeText('${PopupMarker.blockClipboardFormat(this.position, false)}')" >
<div class="label">${i18n.t("blockTooltip.position")}:</div>
<div class="content">
<div class="entry"><span class="label">x: </span><span class="value">${this.position.x}</span></div>
@ -122,9 +130,12 @@ export class PopupMarker extends Marker {
let regionCoords = new Vector2(this.position.x, this.position.z).divideScalar(512).floor();
let regionFile = `r.${regionCoords.x}.${regionCoords.y}.mca`;
if (isHires) {
this.element.innerHTML += `
<hr>
<div class="group">
<div class="group"
data-tooltip="${i18n.t("blockTooltip.clipboard")}"
onclick="navigator.clipboard.writeText('${PopupMarker.chunkClipboardFormat(chunkCoords, true)}')" >
<div class="label">${i18n.t("blockTooltip.chunk")}:</div>
<div class="content">
<div class="entry"><span class="label">x: </span><span class="value">${chunkCoords.x}</span></div>
@ -132,8 +143,27 @@ export class PopupMarker extends Marker {
<div class="entry"><span class="label">z: </span><span class="value">${chunkCoords.z}</span></div>
</div>
</div>
`;
} else {
this.element.innerHTML += `
<hr>
<div class="group">
<div class="group"
data-tooltip="${i18n.t("blockTooltip.clipboard")}"
onclick="navigator.clipboard.writeText('${PopupMarker.chunkClipboardFormat(chunkCoords, false)}')" >
<div class="label">${i18n.t("blockTooltip.chunk")}:</div>
<div class="content">
<div class="entry"><span class="label">x: </span><span class="value">${chunkCoords.x}</span></div>
<div class="entry"><span class="label">z: </span><span class="value">${chunkCoords.z}</span></div>
</div>
</div>
`;
}
this.element.innerHTML += `
<hr>
<div class="group"
data-tooltip="${i18n.t("blockTooltip.clipboard")}"
onclick="navigator.clipboard.writeText('${PopupMarker.regionClipboardFormat(regionCoords)}')" >
<div class="label">${i18n.t("blockTooltip.region.region")}:</div>
<div class="content">
<div class="entry"><span class="label">x: </span><span class="value">${regionCoords.x}</span></div>

37
common/webapp/src/scss/markers.scss
View File

@ -89,6 +89,43 @@
line-height: 1.2em;
.group {
&[data-tooltip] {
position: relative;
pointer-events: auto;
user-select: none;
cursor: pointer;
margin: -0.5em;
padding: 0.5em;
&:hover::before {
display: block;
position: absolute;
z-index: 1;
left: 50%;
bottom: calc(100% + 0.5em);
transform: translate(-50%, 0);
content: attr(data-tooltip);
background: var(--theme-bg);
color: var(--theme-fg-light);
filter: drop-shadow(1px 1px 3px #0008);
font-size: 0.75em;
line-height: 1em;
padding: .5em;
}
&:active {
background-color: var(--theme-bg-light);
}
}
> .label {
position: relative;
top: 0;