Added search config to disable some unneeded buttons
This commit is contained in:
BIN
public/icon/death-shadow.png
Normal file
BIN
public/icon/death-shadow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
public/icon/death.png
Normal file
BIN
public/icon/death.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
@@ -1,19 +1,9 @@
|
||||
---
|
||||
import type { MapMarker, PlayerMarker } from '@/types/Leaflet';
|
||||
import type { MapProps } from '@/types/Map';
|
||||
import MarkerCreator from './overlay/MarkerCreator.vue';
|
||||
|
||||
interface Props {
|
||||
mapKey: string
|
||||
zoomifyKey: string
|
||||
mapHeight: number
|
||||
mapWidth: number
|
||||
markers?: MapMarker[]
|
||||
players?: PlayerMarker
|
||||
rulerMainUnit?: string
|
||||
rulerDistanceRatio?: number
|
||||
rulerHideWalkDistance?: boolean
|
||||
backgroundColor?: string
|
||||
}
|
||||
interface Props extends MapProps {}
|
||||
|
||||
const {
|
||||
mapKey,
|
||||
|
||||
@@ -2,22 +2,24 @@
|
||||
import type { MapMarker, PlayerMarker } from "@/types/Leaflet";
|
||||
|
||||
import SearchMarkers from "./overlay/SearchMarkers.vue";
|
||||
import type { MapOverlayProps } from "@/types/Map";
|
||||
|
||||
interface Props {
|
||||
mapKey: string
|
||||
markers?: MapMarker[]
|
||||
players?: PlayerMarker
|
||||
}
|
||||
interface Props extends MapOverlayProps {}
|
||||
|
||||
const {
|
||||
mapKey,
|
||||
markers = [] as MapMarker[],
|
||||
players = {} as PlayerMarker,
|
||||
searchConfig = {
|
||||
disableCapitals: false,
|
||||
disableLandmarks: false,
|
||||
disableQuests: false,
|
||||
}
|
||||
} = Astro.props
|
||||
---
|
||||
|
||||
<div class="world-overlay">
|
||||
<SearchMarkers client:load mapKey={mapKey} markers={markers} players={players} />
|
||||
<SearchMarkers client:load mapKey={mapKey} markers={markers} players={players} searchConfig={searchConfig} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
@@ -0,0 +1,72 @@
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"group": "landmarks",
|
||||
"title": "Escalier principal",
|
||||
"description": "Escalier principal menant à l'entrée des mines.",
|
||||
"markerCoords": {
|
||||
"x": 204.17153606569804,
|
||||
"y": -97.2765317771096
|
||||
}
|
||||
},
|
||||
{
|
||||
"group": "landmarks",
|
||||
"title": "Escalier secret",
|
||||
"description": "Escalier secret menant à l'extérieur de la montagne. Il a été taillé dans la pierre par les Étincelles de Cantane.",
|
||||
"markerCoords": {
|
||||
"x": 30.312497957367608,
|
||||
"y": -112.61072064780724
|
||||
}
|
||||
},
|
||||
{
|
||||
"group": "landmarks",
|
||||
"title": "Cadavre de Taleb Vaht",
|
||||
"description": "Son visage a été vidé de sa chair et ses yeux ont été arrachés. Son bas corps est fondu dans le mur.",
|
||||
"markerCoords": {
|
||||
"x": 73.98667751443935,
|
||||
"y": -48.86054114319268
|
||||
},
|
||||
"icon": "death"
|
||||
},
|
||||
{
|
||||
"group": "landmarks",
|
||||
"title": "Cadavre de Thérence",
|
||||
"description": "Le corps est transpercé par une lance ; il a l'air de s'être jeté dessus.",
|
||||
"markerCoords": {
|
||||
"x": 53.322483262000056,
|
||||
"y": -47.64614423471167
|
||||
},
|
||||
"icon": "death"
|
||||
},
|
||||
{
|
||||
"group": "landmarks",
|
||||
"title": "Cadavre de Sébastien",
|
||||
"description": "Le corps est tranché en deux dans la longueur.",
|
||||
"markerCoords": {
|
||||
"x": 114.33884300089663,
|
||||
"y": -62.16106768041688
|
||||
},
|
||||
"icon": "death"
|
||||
},
|
||||
{
|
||||
"group": "landmarks",
|
||||
"title": "Cadavre de Donovane",
|
||||
"description": "Le corps complètement fondu dans le sol. La pierre alentour a été minée par sa main.",
|
||||
"markerCoords": {
|
||||
"x": 187.9956058143303,
|
||||
"y": 30.86756210204816
|
||||
},
|
||||
"icon": "death"
|
||||
},
|
||||
{
|
||||
"group": "landmarks",
|
||||
"title": "Cadavre de Mathilda Boulais",
|
||||
"description": "Son corps a l'air d'avoir explosé et fondu de l'intérieur. Elle n'est pas reconnaissable.",
|
||||
"markerCoords": {
|
||||
"x": 54.935192730348106,
|
||||
"y": 6.478401650708764
|
||||
},
|
||||
"icon": "death"
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,15 +1,17 @@
|
||||
<script setup lang="ts">
|
||||
import type { MapMarker, MapMarkerGroup, PlayerMarker } from '@/types/Leaflet';
|
||||
import type { SearchConfig } from '@/types/Map';
|
||||
import type { SearchMode } from '@/types/Search';
|
||||
import { onClickOutside, useFocus, useFocusWithin, useLocalStorage, useMagicKeys, whenever } from '@vueuse/core';
|
||||
import { computed, onMounted, ref, onUpdated, watch } from 'vue';
|
||||
import SearchMarkersTags from './SearchMarkersTags.vue';
|
||||
import { computed, onMounted, onUpdated, ref, watch } from 'vue';
|
||||
import SearchMapSwitch from './SearchMapSwitch.vue';
|
||||
import SearchMarkersTags from './SearchMarkersTags.vue';
|
||||
|
||||
const props = defineProps<{
|
||||
markers: MapMarker[],
|
||||
players: PlayerMarker,
|
||||
mapKey?: string
|
||||
mapKey?: string,
|
||||
searchConfig?: SearchConfig
|
||||
}>()
|
||||
|
||||
const customMarkersKey = props.mapKey ? `custom-markers-${props.mapKey}` : 'custom-markers'
|
||||
@@ -261,6 +263,7 @@ function resetAllFields(actionAfter?: "focusAfter") {
|
||||
<SearchMarkersTags
|
||||
:current-search-mode="currentSearchMode"
|
||||
:custom-markers="customMarkersData"
|
||||
:search-config="props.searchConfig"
|
||||
@on-category-switch="handleCategorySwitch"
|
||||
/>
|
||||
</nav>
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
<script lang="ts" setup>
|
||||
import type { MapMarker, MapMarkerGroup } from '@/types/Leaflet';
|
||||
import type { SearchConfig } from '@/types/Map';
|
||||
import type { SearchMode } from '@/types/Search';
|
||||
|
||||
defineProps<{
|
||||
currentSearchMode: SearchMode,
|
||||
customMarkers: MapMarker[]
|
||||
customMarkers: MapMarker[],
|
||||
searchConfig?: SearchConfig
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
@@ -18,7 +20,7 @@ function emitCategorySwitch(newCategory: MapMarkerGroup) {
|
||||
|
||||
<template>
|
||||
<menu class="tag-list">
|
||||
<li>
|
||||
<li v-if="!searchConfig?.disableQuests">
|
||||
<button
|
||||
@click="emitCategorySwitch('quests')"
|
||||
class="red"
|
||||
@@ -35,7 +37,7 @@ function emitCategorySwitch(newCategory: MapMarkerGroup) {
|
||||
</button>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<li v-if="!searchConfig?.disableCapitals">
|
||||
<button
|
||||
@click="emitCategorySwitch('capitals')"
|
||||
class="blue"
|
||||
@@ -52,7 +54,7 @@ function emitCategorySwitch(newCategory: MapMarkerGroup) {
|
||||
</button>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<li v-if="!searchConfig?.disableLandmarks">
|
||||
<button
|
||||
@click="emitCategorySwitch('landmarks')"
|
||||
class="orange"
|
||||
|
||||
@@ -14,6 +14,10 @@ const markers = markersData.data as MapMarker[]
|
||||
<MapOverlay
|
||||
mapKey='aldys-cantane'
|
||||
markers={markers}
|
||||
searchConfig={{
|
||||
disableCapitals: true,
|
||||
disableQuests: true,
|
||||
}}
|
||||
/>
|
||||
<Map
|
||||
mapKey='aldys-cantane'
|
||||
|
||||
33
src/pages/aldys/cantane/mines-blanches.astro
Normal file
33
src/pages/aldys/cantane/mines-blanches.astro
Normal file
@@ -0,0 +1,33 @@
|
||||
---
|
||||
import type { MapMarker, PlayerMarker } from '@/types/Leaflet';
|
||||
|
||||
import Layout from '@/layouts/Layout.astro';
|
||||
import Map from '@/components/maps/Map.astro'
|
||||
import MapOverlay from '@/components/maps/MapOverlay.astro'
|
||||
|
||||
import markersData from '@/components/maps/data/aldys/cantane/les-mines-blanches/markers.json';
|
||||
|
||||
const markers = markersData.data as MapMarker[]
|
||||
---
|
||||
|
||||
<Layout title="Les Mines Blanches ~ Cartographie">
|
||||
<MapOverlay
|
||||
mapKey='aldys-cantane-mines'
|
||||
markers={markers}
|
||||
searchConfig={{
|
||||
disableCapitals: true,
|
||||
disableQuests: true,
|
||||
}}
|
||||
/>
|
||||
<Map
|
||||
mapKey='aldys-cantane-mines'
|
||||
zoomifyKey='mines-blanches'
|
||||
mapHeight={6020}
|
||||
mapWidth={10290}
|
||||
markers={markers}
|
||||
rulerDistanceRatio={1.15}
|
||||
rulerMainUnit='Mètres'
|
||||
rulerHideWalkDistance={true}
|
||||
backgroundColor="#101010"
|
||||
/>
|
||||
</Layout>
|
||||
27
src/types/Map.ts
Normal file
27
src/types/Map.ts
Normal file
@@ -0,0 +1,27 @@
|
||||
import type { MapMarker, PlayerMarker } from "./Leaflet"
|
||||
|
||||
export interface SearchConfig {
|
||||
disableQuests?: boolean
|
||||
disableCapitals?: boolean
|
||||
disableLandmarks?: boolean
|
||||
}
|
||||
|
||||
export interface MapProps {
|
||||
mapKey: string
|
||||
zoomifyKey: string
|
||||
mapHeight: number
|
||||
mapWidth: number
|
||||
markers?: MapMarker[]
|
||||
players?: PlayerMarker
|
||||
rulerMainUnit?: string
|
||||
rulerDistanceRatio?: number
|
||||
rulerHideWalkDistance?: boolean
|
||||
backgroundColor?: string
|
||||
}
|
||||
|
||||
export interface MapOverlayProps {
|
||||
mapKey: string
|
||||
markers?: MapMarker[]
|
||||
players?: PlayerMarker
|
||||
searchConfig?: SearchConfig
|
||||
}
|
||||
Reference in New Issue
Block a user