Feature Coordinate Search

locales/en.json

@@ -65,6 +65,7 @@
     "menu.search_biome.title": "Search Biome",
     "menu.search_biome.toggle": "Toggle Biome Filter",
     "menu.structure_positions.title": "Structure Positions",
+    "menu.coordinate_search.title": "Go to Coordinates",
     "menu.reload_datapacks.title": "Reload Packs",
     "dropdown.add.zip": "Open Pack or Mod",
     "dropdown.add.picker.pack_and_mod": "Packs and Mods",
@@ -88,6 +89,14 @@
     "dropdown.add.recents.wrong_version": "unavailable for this version ",
     "dropdown.search_biome.placeholder": "Search Biome",
     "dropdown.structure_positions.placeholder": "Search Structure",
+    "dropdown.coordinate.title": "Go to Coordinates",
+    "dropdown.coordinate.x_label": "X Coordinate",
+    "dropdown.coordinate.z_label": "Z Coordinate", 
+    "dropdown.coordinate.x_placeholder": "Enter X coordinate",
+    "dropdown.coordinate.z_placeholder": "Enter Z coordinate",
+    "dropdown.coordinate.navigate": "Go to Location",
+    "dropdown.coordinate.current_location": "Use Current View",
+    "dropdown.coordinate.invalid_coordinates": "Please enter valid coordinates (numbers between -30,000,000 and 30,000,000)",
     "modrinth.title": "Open from Modrinth",
     "modrinth.search.aria-label": "Searchbar for datapacks on Modrinth",
     "modrinth.search.placeholder": "Search Modrinth...",

src/App.vue

@@ -24,9 +24,12 @@ onBeforeMount(async () => {
 <template>
   <div class="layout" v-if="loaded">
     <Collapsable>
-      <Sidebar />
+      <Sidebar 
+        @navigateToCoordinates="(x, z) => $refs.mainMap?.navigateToCoordinates(x, z)" 
+        @getCurrentMapCenter="() => $refs.mainMap?.getCurrentMapCenter()"
+      />
     </Collapsable>
-    <MainMap />
+    <MainMap ref="mainMap" />
   </div>
   <div class="layout loading" v-else>
     <p>Loading...</p>

src/components/MainMap.vue

@@ -9,7 +9,8 @@ import { BlockPos, Chunk, ChunkPos, DensityFunction, Identifier, RandomState, St
 import YSlider from './YSlider.vue';
 import { useSearchStore } from '../stores/useBiomeSearchStore';
 import { useSettingsStore } from '../stores/useSettingsStore';
-import { useLoadedDimensionStore } from '../stores/useLoadedDimensionStore'
+import { useLoadedDimensionStore } from '../stores/useLoadedDimensionStore';
+import { useCoordinateStore } from '../stores/useCoordinateStore'
 import { CachedBiomeSource } from '../util/CachedBiomeSource';
 import MapButton from './MapButton.vue';
 import { SpawnTarget } from '../util/SpawnTarget';
@@ -19,6 +20,7 @@ import { versionMetadata } from "../util";
 const searchStore = useSearchStore()
 const settingsStore = useSettingsStore()
 const loadedDimensionStore = useLoadedDimensionStore()
+const coordinateStore = useCoordinateStore()
 const i18n = useI18n()
 
 let biomeLayer: BiomeLayer
@@ -307,6 +309,43 @@ watch(searchStore.structures, () => {
     updateMarkers()
 })
 
+// Coordinate navigation function
+function navigateToCoordinates(x: number, z: number) {
+    if (!map) return
+
+    const crs = map.options.crs!
+    const point = new L.Point(x, -z)
+    const latlng = crs.unproject(point)
+
+    // Center the map on the coordinates with a smooth animation
+    map.setView(latlng, map.getZoom(), {
+        animate: true,
+        duration: 0.5
+    })
+}
+
+// Get current map center coordinates
+function getCurrentMapCenter() {
+    if (!map) return
+
+    const center = map.getCenter()
+    const crs = map.options.crs!
+    const point = crs.project(center)
+
+    // Convert to Minecraft coordinates
+    const x = Math.round(point.x)
+    const z = Math.round(-point.y)
+
+    // Update the coordinate store with current location
+    coordinateStore.setCoordinates(x, z)
+}
+
+// Expose the navigation functions
+defineExpose({
+    navigateToCoordinates,
+    getCurrentMapCenter
+})
+
 </script>
 
 <template>

src/components/MenuButtons.vue

@@ -3,19 +3,23 @@ import { ref } from 'vue';
 import { useDatapackStore } from '../stores/useDatapackStore';
 import FindBiomeDropdown from './dropdown/FindBiomeDropdown.vue';
 import OpenDropdown from './dropdown/OpenDropdown.vue';
+import CoordinateDropdown from './dropdown/CoordinateDropdown.vue';
 import { vOnClickOutside }from '@vueuse/components';
 import { useSearchStore } from '../stores/useBiomeSearchStore';
+import { useCoordinateStore } from '../stores/useCoordinateStore';
 import StructureDropdown from './dropdown/StructureDropdown.vue';
 import { useSettingsStore } from '../stores/useSettingsStore';
 import { EventTracker } from '../util/EventTracker';
 
 const datapackStore = useDatapackStore()
 const searchStore = useSearchStore()
+const coordinateStore = useCoordinateStore()
 const settingsStore = useSettingsStore()
 
 const openDropdownOpen = ref(false)
 const searchBiomeDropdownOpen = ref(false)
 const structureDropdownOpen = ref(false)
+const coordinateDropdownOpen = ref(false)
 
 function reload(event: MouseEvent){
     EventTracker.track("reload")
@@ -39,6 +43,24 @@ function clearStructureSearch() {
     structureDropdownOpen.value = false
 }
 
+function clearCoordinateSearch() {
+    coordinateStore.clear()
+    coordinateDropdownOpen.value = false
+}
+
+const emit = defineEmits<{
+    navigateToCoordinates: [x: number, z: number]
+    getCurrentMapCenter: []
+}>()
+
+function handleCoordinateNavigation(x: number, z: number) {
+    emit('navigateToCoordinates', x, z)
+}
+
+function handleGetCurrentLocation() {
+    emit('getCurrentMapCenter')
+}
+
 
 </script>
 
@@ -93,6 +115,20 @@ function clearStructureSearch() {
                 @dblclick.prevent="clearStructureSearch"
             />
 
+            <font-awesome-icon
+                icon="fa-crosshairs"
+                class="button"
+                tabindex="0"
+                :class="{
+                    open: coordinateDropdownOpen
+                }"
+                :title="$t('menu.coordinate_search.title')"
+                @click="coordinateDropdownOpen = true"
+                @keypress.enter="coordinateDropdownOpen = true"
+                @contextmenu.prevent="clearCoordinateSearch"    
+                @dblclick.prevent="clearCoordinateSearch"
+            />
+
             <font-awesome-icon v-if="settingsStore.dev_mode" icon="fa-rotate-right" class="button" tabindex="0" :title="$t('menu.reload_datapacks.title')" @click="reload" @keypress.enter="reload" />
         </div>
         <div class="dropdowns">
@@ -109,6 +145,16 @@ function clearStructureSearch() {
                     <StructureDropdown v-if="structureDropdownOpen" v-on-click-outside="() => {structureDropdownOpen=false}" tabindex="-1"/>
                 </Suspense>
             </Transition>
+            <Transition>
+                <CoordinateDropdown 
+                    v-if="coordinateDropdownOpen" 
+                    v-on-click-outside="() => {coordinateDropdownOpen=false}" 
+                    @navigate="handleCoordinateNavigation"
+                    @getCurrentLocation="handleGetCurrentLocation"
+                    @close="coordinateDropdownOpen=false"
+                    tabindex="-1"
+                />
+            </Transition>
         </div>
     </div>
 </template>

src/components/Sidebar.vue

@@ -16,6 +16,12 @@ import { EventTracker } from '../util/EventTracker';
     const settingsStore = useSettingsStore()
     const recentStore = useRecentStore();
 
+    const emit = defineEmits<{
+        navigateToCoordinates: [x: number, z: number]
+        getCurrentMapCenter: []
+        open_popup: []
+    }>()
+
     const file_dragging = ref(false)
     const show_tipmessage = ref(true)
 
@@ -75,7 +81,10 @@ import { EventTracker } from '../util/EventTracker';
         @dragleave="file_dragging=false"
         :class="{file_dragging: file_dragging}"
     >
-        <MenuButtons />
+        <MenuButtons 
+            @navigateToCoordinates="(x, z) => $emit('navigateToCoordinates', x, z)" 
+            @getCurrentMapCenter="() => $emit('getCurrentMapCenter')"
+        />
         <Suspense>
             <SettingsPanel />
         </Suspense>