diff --git a/BlueMapCore/src/main/webroot/js/libs/modules/HudInfo.js b/BlueMapCore/src/main/webroot/js/libs/modules/HudInfo.js index f91acbd3..6c2d9517 100644 --- a/BlueMapCore/src/main/webroot/js/libs/modules/HudInfo.js +++ b/BlueMapCore/src/main/webroot/js/libs/modules/HudInfo.js @@ -1,7 +1,10 @@ import $ from 'jquery'; import { Raycaster, - Vector2 + Vector2, + BoxBufferGeometry, + Mesh, + MeshBasicMaterial } from 'three'; import {pathFromCoords} from "../utils"; @@ -11,6 +14,16 @@ export default class HudInfo { this.blueMap = blueMap; this.container = container; + let blockMarkerGeo = new BoxBufferGeometry( 1, 1, 1 ); + blockMarkerGeo.translate(0.5, 0.5, 0.5); + this.blockMarker = new Mesh(blockMarkerGeo, new MeshBasicMaterial( { + color: 0xffffff, + opacity: 0.3, + depthWrite: false, + depthTest: false, + transparent: true + } )); + this.rayPosition = new Vector2(); this.raycaster = new Raycaster(); @@ -125,6 +138,12 @@ export default class HudInfo { this.element.removeClass("below"); } this.element.fadeIn(200); + + if (hiresData){ + this.blockMarker.position.set(block.x, block.y, block.z); + this.blueMap.hiresScene.add(this.blockMarker); + this.blueMap.updateFrame = true; + } } }; @@ -132,6 +151,8 @@ export default class HudInfo { onHideInfo = event => { if (!this.element.is(':animated')) { this.element.fadeOut(200); + this.blueMap.hiresScene.remove(this.blockMarker); + this.blueMap.updateFrame = true; } }; diff --git a/BlueMapCore/src/main/webroot/js/libs/ui/Menu.js b/BlueMapCore/src/main/webroot/js/libs/ui/Menu.js index a1d00f0f..c587babf 100644 --- a/BlueMapCore/src/main/webroot/js/libs/ui/Menu.js +++ b/BlueMapCore/src/main/webroot/js/libs/ui/Menu.js @@ -25,6 +25,7 @@ import $ from 'jquery'; import Element from './Element.js'; +import Separator from "./Separator"; export default class Menu { @@ -47,6 +48,23 @@ export default class Menu { this.children.forEach(child => { this.content.append(child.createElement()); }); + + $(`
`).appendTo(this.content); + + $(` + + `).appendTo(this.content); } isOpen = () => { diff --git a/BlueMapCore/src/main/webroot/js/libs/ui/UI.js b/BlueMapCore/src/main/webroot/js/libs/ui/UI.js index e947ff33..4a96b5c6 100644 --- a/BlueMapCore/src/main/webroot/js/libs/ui/UI.js +++ b/BlueMapCore/src/main/webroot/js/libs/ui/UI.js @@ -69,7 +69,7 @@ export default class UI { let posZ = new Position(this.blueMap, 'z'); let compass = new Compass(this.blueMap); - let mobSpawnOverlay = new ToggleButton("mob-spawnable overlay", blueMap.mobSpawnOverlay.value, button => { + let mobSpawnOverlay = new ToggleButton("mob-spawn (experimental)", blueMap.mobSpawnOverlay.value, button => { this.blueMap.mobSpawnOverlay.value = button.isSelected(); this.blueMap.updateFrame = true; }); @@ -119,6 +119,7 @@ export default class UI { this.menu.addElement(new Separator()); this.menu.addElement(debugInfo); this.menu.update(); + } } \ No newline at end of file diff --git a/BlueMapCore/src/main/webroot/style/ui/menu.scss b/BlueMapCore/src/main/webroot/style/ui/menu.scss index 43e19836..1321bdc4 100644 --- a/BlueMapCore/src/main/webroot/style/ui/menu.scss +++ b/BlueMapCore/src/main/webroot/style/ui/menu.scss @@ -69,6 +69,9 @@ $menu-width: 375px; right: 0; top: 3rem; + display: flex; + flex-direction: column; + width: calc(375px - 1rem); height: calc(100% - 4rem); @@ -80,6 +83,11 @@ $menu-width: 375px; width: calc(100% - 1rem); } + > * { + flex-grow: 0; + flex-shrink: 0; + } + > .separator { position: relative; left: -0.5rem; @@ -88,6 +96,11 @@ $menu-width: 375px; border-top: solid 1px $line_color; margin: 0.5rem 0; + + &.greedy { + flex-grow: 1; + border-bottom: solid 1px $line_color; + } } > .label { @@ -127,5 +140,40 @@ $menu-width: 375px; color: $hover_fg; } } + + > .footer-separator{ + flex-grow: 1; + } + + > .footer { + margin: 0.5rem -0.5rem -0.5rem -0.5rem; + padding: 0 0.5rem 0.5rem 0.5rem; + + border-top: solid 1px $line_color; + + line-height: 1rem; + font-size: 0.8rem; + + white-space: normal; + + h1 { + margin: 1rem 0 0.5rem 0; + font-size: 1rem; + text-align: center; + } + + h2 { + margin: 1rem 0 0 0; + font-size: inherit; + } + + p { + margin: 0 0 0.5rem 0; + + &:last-child { + margin-bottom: 0; + } + } + } } } \ No newline at end of file