Nikolay Tatarinov
adfdfd01c4
- Modified docker-compose.dev.yml to conditionally run npm install based on the presence of package-lock.json. - Upgraded Nuxt version in package-lock.json from 3.21.1 to 4.3.1 for enhanced features. - Enhanced ConfirmModal component with aria-modal attribute for better accessibility. - Updated MapErrorBoundary component's error message for clarity. - Added role and aria-label attributes to MapView and MapSearch components for improved screen reader support. - Refactored various components to manage focus behavior on modal close, enhancing user experience. - Improved ToastContainer styling for better responsiveness and visibility. - Updated layout components to include skip navigation links for improved accessibility.
52 lines
1.8 KiB
Vue
52 lines
1.8 KiB
Vue
<template>
|
|
<div
|
|
v-if="displayCoords"
|
|
class="absolute bottom-2 right-2 z-[501] rounded-lg px-3 py-2 font-mono text-sm bg-base-100/95 backdrop-blur-sm border border-base-300/50 shadow cursor-pointer select-none transition-all hover:border-primary/50 hover:bg-base-100"
|
|
aria-label="Current grid position and zoom — click to copy share link"
|
|
:title="copied ? 'Copied!' : 'Click to copy share link'"
|
|
role="button"
|
|
tabindex="0"
|
|
@click="copyShareUrl"
|
|
@keydown.enter="copyShareUrl"
|
|
@keydown.space.prevent="copyShareUrl"
|
|
>
|
|
<span class="relative">
|
|
{{ mapid }} · {{ displayCoords.x }}, {{ displayCoords.y }} · z{{ displayCoords.z }}
|
|
<span
|
|
v-if="copied"
|
|
class="absolute -top-6 left-1/2 -translate-x-1/2 whitespace-nowrap rounded bg-primary px-2 py-1 text-xs font-sans text-primary-content shadow"
|
|
>
|
|
Copied!
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
mapid: number
|
|
displayCoords: { x: number; y: number; z: number } | null
|
|
}>()
|
|
|
|
const { fullUrl } = useAppPaths()
|
|
const copied = ref(false)
|
|
let copyTimeout: ReturnType<typeof setTimeout> | null = null
|
|
|
|
function copyShareUrl() {
|
|
if (!props.displayCoords) return
|
|
const path = `grid/${props.mapid}/${props.displayCoords.x}/${props.displayCoords.y}/${props.displayCoords.z}`
|
|
const url = fullUrl(path)
|
|
if (import.meta.client && navigator.clipboard?.writeText) {
|
|
navigator.clipboard.writeText(url).then(() => {
|
|
copied.value = true
|
|
useToast().success('Link copied')
|
|
if (copyTimeout) clearTimeout(copyTimeout)
|
|
copyTimeout = setTimeout(() => {
|
|
copied.value = false
|
|
copyTimeout = null
|
|
}, 2000)
|
|
})
|
|
}
|
|
}
|
|
</script>
|